I have recently been working on a very simple version of the game “Simon” in C# and XAML. The following screenshot shows the game running:
I initially had developed the application without support for orientation. As a result, when the application reflowed, it would crop components of the application off-screen (not desired!). The following screen shot shows this happening in the device simulator.
So, I added some preferences to the application manifest that would indicate the application preferred to be in landscape and also set the preferences in the application startup. To set the preference in the manifest, I clicked on the application manifest in VS11 and then set it to landscape. To set the preference in the application startup, I added the following code to my Main():
Windows.Graphics.Display.DisplayProperties.AutoRotationPreferences = Windows.Graphics.Display.DisplayOrientations.Landscape | Windows.Graphics.Display.DisplayOrientations.LandscapeFlipped;
Now that is enough to just lock the display so that the components don’t flip out when the display gets re-oriented. Additionally, the application will launch in landscape, so that’s good and well. However, what if instead, I wanted to handle the case where the device is flipped. The math for doing this is surprisingly simple: width becomes height for each square, and top becomes left and visa versa for the game board squares. First, I need to add an event handler for the OrientationChanged event:
+= new Windows.Graphics.Display.DisplayPropertiesEventHandler(DisplayProperties_OrientationChanged);
This will cause the function “DisplayProperties_OrientationChanged” to be called when the device is rotated. My handler calls a utility function in the game class which will update the width, height, left, and top values as appropriate to make the tiles reorient as shown in the following screenshot:
Make sure that you test your app in the simulator and see what happens when the orientation changes to discover orientation and reflow bugs.