||This information is contained in my book C# 24-Hour Trainer, second edition.|
The Windows operating system can display a Store app’s icon at many different sizes. For example, on the Start screen it can display the icon at Small, Medium, Large, or Wide sizes.
The post Make a Windows Forms application display icons at appropriate sizes in C# explains how to assign images of the appropriate sizes to a Windows Forms application. That post is a bit wishy-washy because different versions of Windows with different settings may display the application’s icon at a wide variety of sizes.
This post explains how to set similar images for a Windows Store app. It’s a bit less wishy-washy because Microsoft explicitly defined the sizes that the app can provide. It’s still fairly odd, however, because Microsoft uses a lot of different sizes for rather ill-defined purposes.
Microsoft has changed the way this works slightly in different versions of Visual Studio, but I think this method should work at least as far back as Visual Studio 2013 for Windows. Because we’re working with a Windows Store app, you need to be using a “for Windows” version of Visual Studio, not the “for Desktop” version.
The downloadable example was built using Microsoft Visual Studio Community 2015. To create a Windows Store app, use File > New > Project or press Ctrl+Shift+N to open the New Project dialog. In the treeview on the left, select Installed > Templates > Visual C# > Windows > Windows 8 > Windows > Blank App. Then press OK.
To set the application’s icon images, open Solution Explorer and double-click the Package.appxmanifest entry. Then click the Visual Assets tab.
Use the list on the left to select the type of image you want to set, or pick All Image Assets to see them all.
Find the image category you want and the size within that category. Then click the ellipsis below that size. Use the file selection dialog to select the image and click Open. If an image has already been assigned for that size (including the default image), Visual Studio will make you confirm before you replace the image.
Note that an image must match the selected size exactly. For example, you cannot assign a 151×151 pixel image to the 150×150 size.
Also note that some images are required and others are required if you want to allow the user to represent the app with a wide icon.
After you set the images that you want, run the application to install it on the local system. Later you can use the Windows Search tool to find the app. Then right-click it to pin it to the Start screen or the Taskbar.
After you pin the app to the Start screen, you can right-click its icon to select different icon sizes. The sizes that are available will depend on which images you assigned in the Package.appxmanifest. (You can also right-click the app in the Search tool, the Start screen, or the Taskbar to unpin or uninstall it.)
The following table shows the image sizes that you can define for a Windows Store app. The sizes listed in red are required.
|Store logo||Windows Store detail listings||50×50
|Square 30×30||Use by Windows in various places||24×24
|Square 70×70||Small Start screen tile||56×56
|Square 150×150||Medium Start screen tile||120×120
|Wide 310×150||Wide Start screen tile||248×120
|Square 310×310||Large Start screen tile||248×248
|Splash screen||Splash screen||620×300
Windows will scale an image if necessary to make a size within the same category. For example, suppose you include a 50×50 image in the Store logo category and Windows wants a 70×70 store logo for some reason. In that case it will resize the 50×50 image you provided. Note that it will only use an image in the same category. For example, it won’t use the 70×70 image in the Square 70×70 tile category for a Store logo.