A Quick Tip for UI design in Windows Phone 8

by Ishai Hachlili 30. October 2012 07:45

If you’ve worked on WP7 apps, you probably came across the MetroGridHelper from Jeff Wilcox. If not, what this little helper does is add a grid of squares that helps you align controls in your app’s pages.

If you’re one of those who ignore the commented sections in newly created pages, you might miss that this feature is now included in the default WP8 project. To use it, all you have to do is uncomment the Image tag at the end of the page

<!--Uncomment to see an alignment grid to help ensure your controls are
aligned on common boundaries. The image has a top margin of -32px to
account for the System Tray. Set this to 0 (or remove the margin altogether)
if the System Tray is hidden.

Before shipping remove this XAML and the image itself.-->
<!--<Image Source="/Assets/AlignmentGrid.png" VerticalAlignment="Top" Height="800" Width="480" Margin="0,-32,0,0" Grid.Row="0" Grid.RowSpan="2" IsHitTestVisible="False" />-->

Tags: , ,

Design | Windows Phone 8

About Me

Ishai Hachlili is a web and mobile application developer.

Currently working on Play The Hunt and The Next Line


Recent Tweets

Twitter October 23, 05:22
@BenThePCGuy a standard where that doesn't matter is better. One more reason to get the #Lumia920, wireless charging, no need for microUSB

Twitter October 23, 05:21
@ManMadeMoon where they dance around the issues and don't really talk about them

Twitter October 23, 05:20
@BenThePCGuy are you a @wpdev ?

Twitter October 23, 04:17
@JonahLupton But if it's black it's usually better

Twitter October 23, 02:58
@jongalloway next time ask your 5 year old how to spell

@EShy