Metro Nuggets

Bitesized tidbits for building Modern (Metro) apps.

Tag Archives: UWP

Using Unplated “Tile” Images In UWP Apps

I realise the first question you have: “Unplated?” Well, give me a chance. In your app’s package manifest, you have a section for Square44x44Logo, this logo is used in the task bar and in the application list in the start menu. What you will notice is that, by default, your image will have a border around it, like so:
image

Notice the grey all around the icon (note: that grey is defined in the package manifest too, so doesn’t have to be that colour)? Now, for your app’s branding, maybe you don’t want that border as that goes against how your actual tile looks, and consistency is key, right!

Read more of this post

Advertisements

Use Triggers To Change Grid Column/Row Values in Universal Windows Apps

When creating your awesome layout to your awesome new app, you’ll often use Grids as a way of ensuring things are placed where you want them to be and you’d most likely use the ColumnDefinitions and RowDefinitions. Using these has a number of benefits, not least letting you specify exact heights/widths for your columns/rows, but you can also use Auto and the * values to set screen percentages. What this means is you can have a very exact UI or one that adapts as the size of the window changes.

Adapting to the size of the window is something that’s more relevant to UWPs than ever before with you bringing one UI to all possible screens the user can use your app on. But what if you still want to keep some rows at a certain screen percentage until the user hits a trigger point? Well, a small, but subtle change to xaml now allows you to do more with your Column/RowDefinitions.

Read more of this post

Introducing MDL2 Helpers

Another new thing that’s being introduced in Windows 10 is something that’s being seen as the next evolution of Metro: MDL2 (Microsoft Design Language 2). This brings about a whole new set of iconography for Windows 10, some of which can be seen in the settings app (on both phone and desktop).

If you want to read more about MDL2, whilst not technical, this would be a good place to start.

The icons that are available can be used by using the Font Segoe MDL2 then using the relevant code to get the icon. But where do you get those codes from? Well, Austin Andrews (@templarian) has put together a great online resource that lists the icons and their representations. But this can be a pain to copy and paste, look up what a code is, etc. So is there an easier way?

Read more of this post

Introducing AdaptiveTileExtensions for Windows 10

One of the things shown off at Build recently was this new thing for updating tiles, called Adaptive Tiles. The notion is, that like your Universal Windows Apps can adapt to different sizes on different platforms, so, too, should your tiles. So Adaptive tiles allows you, with one bit of XML tell your tile how to behave at different sizes. For more information, you should definitely watch the Build session on all this

The problem is, it means crafting the XML. And who likes XML?

Read more of this post