sticky
Adding wide tiles to apps with the Windows Phone SDK 7.1

    General discussion

  • The Windows Phone SDK Update for Windows Phone 7.8 lets you develop apps for Windows Phone OS 7.1 that provide a Start screen experience similar to Windows Phone 8, including wide tiles and the new tile templates, when the apps run on a Windows Phone 7.8 or Windows Phone 8.0 device. For more info, see Adding Windows Phone 8 and 7.8 Tile functionality to Windows Phone OS 7.1 apps.

    The SDK Update provides updates for both Windows Phone SDK 8.0 and Windows Phone SDK 7.1 to let you see how your app looks and runs on a Windows Phone 7.8 device. To add wide tile support to your app, the only recommended and supported SDK to use is Windows Phone SDK 8.0.

    If you add wide tiles to your app in the Windows Phone SDK 7.1 tools, an error occurs when you build the app because of the new <AppExtra> element in the app manifest file. You can use the following (non-officially supported) workaround to publish your app successfully to the Windows Phone Store.

    To build and test an app with wide tiles in the Windows Phone SDK 7.1 tools, you have to remove (or omit) the <AppExtra> element from the app manifest file until you're ready to publish your app to the Windows Phone Store. The <AppExtra> element is described in the topic, Adding Windows Phone 8 and 7.8 Tile functionality to Windows Phone OS 7.1 apps.

    In Visual Studio, in the app project, open the app manifest file.

    1. Remove the <AppExtra> element and its contents if the element is present.
    2. Save the changes to the app manifest file.
    3. Build and test the app.

    To publish an app with wide tiles built with the Windows Phone SDK 7.1 tools, you have to insert the <AppExtra> element into the app manifest file before you submit the app to the Store.

    1. In Visual Studio, build the release version of the app.
    2. In Windows Explorer, locate the XAP file in the <project name>\Bin\Release folder. Note the name of the XAP file.
    3. Change the extension of the file temporarily from XAP to ZIP. Now Windows Explorer recognizes that the file is a compressed (zipped) folder.
    4. Extract the contents of the ZIP file.
    5. Open the extracted app manifest file, WMAppManifest.xml.
    6. Insert the <AppExtra> element as described in the topic, Adding Windows Phone 8 and 7.8 Tile functionality to Windows Phone OS 7.1 apps.
    7. Save the changed app manifest file.
    8. Compress the files again into a XAP file. To do this, select the files in the folder, right-click, and then select Send To | Compressed (zipped) folder. Give the XAP file the same name that it had originally.
    9. Before you publish the app, deploy the new XAP file and test it on the emulator and, if possible, on a device.

    After you add the <AppExtra> element in the app manifest file, you can publish the app with wide tiles to the Store.


    Mark Chamberlain Sr. Escalation Engineer | Microsoft Developer Support | Windows Phone 8

    Thursday, January 31, 2013 8:16 PM

All replies

  • how can i create a secondary Tiles by Cycle Tile or  Iconic Tile ?

    Thanks

    Monday, February 04, 2013 6:56 AM
  • please Guide me on how to add Iconic Tiles......Thank You

    http://www.windowsphone.com/en-in/store/app/people-analyser/39d689ed-622b-49fb-b2c0-36114a5f7c3c

    Monday, February 04, 2013 7:33 AM
  • Hello,

    Thank you for this valuable information. I am really interested in Windows Phone app development. The next thing I will try will be a VoIP app for Windows Phone 7 OS. It will be done according to a description (http://www.voip-sip-sdk.com/p_511-windows-phone-platform-voip.html) with an SDK called Ozeki VoIP SIP SDK. I am also working with the Windows Phone SDK 7.1 tools and found the topic Adding Windows Phone 8 and 7.8 Tile functionality to Windows Phone OS 7.1 apps really useful.

    Tuesday, February 05, 2013 10:28 AM
  • Here is my Sample

                    Type tileDataType = Type.GetType("Microsoft.Phone.Shell.IconicTileData, Microsoft.Phone");
                    ShellTileData IconicTileData = (ShellTileData)tileDataType.GetConstructor(new Type[] { }).Invoke(null);
                    SetProperty(IconicTileData, "Title", "Iconic Tile Title");
                    SetProperty(IconicTileData, "Count", 7);
                    SetProperty(IconicTileData, "BackgroundColor", Colors.Purple);//Color.FromArgb(255, 200, 10, 30)
                    SetProperty(IconicTileData, "IconImage", new Uri("\\Iconic\\202.png", UriKind.Relative));
                    SetProperty(IconicTileData, "SmallIconImage", new Uri("\\Iconic\\110.png", UriKind.Relative));
                    SetProperty(IconicTileData, "WideContent1", "WideContent1");
                    SetProperty(IconicTileData, "WideContent2", "WideContent2");
                    SetProperty(IconicTileData, "WideContent3", "WideContent3");
                    Create(new Uri("/MainPage.xaml?tile=Iconic", UriKind.Relative), IconicTileData, true);

            public static void Create(Uri uri, ShellTileData tiledata, bool usewide)
            {
                Type shellTileType = Type.GetType("Microsoft.Phone.Shell.ShellTile, Microsoft.Phone");
                MethodInfo createmethod = shellTileType.GetMethod("Create", new[] { typeof(Uri), typeof(ShellTileData), typeof(bool) });
                createmethod.Invoke(null, new object[] { uri, tiledata, usewide });
            }
    
            private static void SetProperty(object instance, string name, object value)
            {
                var setMethod = instance.GetType().GetProperty(name).GetSetMethod();
                setMethod.Invoke(instance, new object[] { value });
            }

    Tuesday, February 05, 2013 5:35 PM
  • thanx for sharing

    http://www.windowsphone.com/en-IN/store/publishers?publisherId=saurabh+aggarwal&appId=e4ef99cb-476b-4495-abde-65da90cb8b31

    Friday, February 08, 2013 7:29 PM
  • see Mangopollo library on Codeplex:  http://mangopollo.codeplex.com/

    Wednesday, April 17, 2013 6:19 PM
  • Great post!  Thanks!
    Friday, April 26, 2013 1:19 PM
  • Hi Mark,

    You said that <AppExtra> be removed for debugging and testing the app. But with that in place, the app is compiled and deployed to WP7.8 Emulator. What's the catch?


    ThanQ...

    Wednesday, June 12, 2013 7:20 PM
  • Hi,

    This discussion was posted as a workaround to an error that occurs when building/compiling the app (and is mentioned in the MSDN content here). After compiling and testing, compile it for the device in release configuration, and then restore <AppExtra> just before publishing.

    -Mark


    Getting Started? Click here
    Blog: Windows Store & Phone Developer Solutions

    Wednesday, June 12, 2013 7:31 PM
  • Hi Mark,

    What will happen if I don't remove the <AppExtra> element is added for testing? Will it give compile errors, or will it not run in emulator or dev device?


    ThanQ...

    Thursday, June 13, 2013 1:54 AM
  • Hi,

    It gave compile errors, in the SDK 7.1 tools. If you are using the 8.0 tools then this discussion is not relevant.

    -Mark


    Getting Started? Click here
    Blog: Windows Store & Phone Developer Solutions

    Thursday, June 13, 2013 2:11 PM
  • OK, Mark, Here is the screenshot (in a word docx). This is showing my WMAppManifest.xml, containing <AppExtra> element, in VS2010 Professional with WP SDK 7.1.1, Debug Build Succeeded.

    So, I was wondering whether it is necessary to remove it for testing and restore it before publishing?


    ThanQ...

    Thursday, June 13, 2013 4:11 PM
  • If your app isn't crashing with the element included, then you should be good to go. No need to remove it.

    -Mark


    Getting Started? Click here
    Blog: Windows Store & Phone Developer Solutions

    Thursday, June 13, 2013 4:28 PM
  • Hi there, I want to create a wide tile for my app like this also. Where within my app do I insert the above code for that tile?
    Saturday, October 12, 2013 4:23 PM
  • Where ever you want to update the tile

    http://pauliom.wordpress.com

    Saturday, October 12, 2013 7:34 PM
  • What do you mean? Wouldn't it go in my AppManifestfile?
    Saturday, October 12, 2013 9:34 PM
  • As the post states, you need to put some config in there to explain that you can support wide tiles and then you need to use the reflection in your code, as stated in the post too, to actually change what the tile shows

    http://pauliom.wordpress.com

    Saturday, October 12, 2013 10:08 PM
  • here is my simple :http://www.cnblogs.com/sun8134/archive/2013/02/06/2908102.html

    My Blog:http://sun8134.cnblogs.com

    Sunday, October 13, 2013 1:20 AM
  • What should the namespace be called?
    Sunday, October 13, 2013 5:35 PM