Logo
HOW TO
Windows XP
Windows Vista
Windows 7
Windows Azure
Windows Server
Windows Phone
 
 
Windows Phone

Windows Phone 7 : Running XNA Projects in Windows (part 2) - Display Differences

6/24/2013 11:22:14 AM

4. Display Differences

There are several adjustments that need to be made in terms of the display when moving a project from Windows Phone 7 to Windows. Clearly, the two platforms have very different display devices and capabilities and you will need to make provision for these in order for your game to integrate nicely into both environments.

4.1. Setting the Window Size

The Windows version of the project runs in a tall, thin window; a window whose client area has a width of 480 pixels and a height of 800 pixels—exactly the size of the Windows Phone 7 screen.

The window is sized in this way because these are the dimensions specified for the graphics.PreferredBackBufferWidth and graphics.PreferredBackBufferHeight properties in the Game1 class constructor. By setting these dimensions to different values for the Windows version of the game, we can get a more appropriate window size. Listing 3 includes code for both Windows Phone 7 and Windows, using a 1024 × 768 pixel window for the latter. 

Example 3. Setting up different window sizes for each platform
// Set backbuffer size and orientation
#if WINDOWS_PHONE
        _graphics.PreferredBackBufferWidth = 480;
        _graphics.PreferredBackBufferHeight = 800;
#else
        _graphics.PreferredBackBufferWidth = 1024;
        _graphics.PreferredBackBufferHeight = 768;
#endif

This size feels much more comfortable in Windows now, but has resulted in a differently sized window, which is therefore able to display fractionally less content on the y axis, and considerably more on the x axis than the original portrait-oriented Windows Phone 7 display.

You will almost certainly have to make adjustments to your game to compensate for these differences if you use this phone orientation. If nothing else, you will want to center the graphics horizontally to stop them from appearing along the left edge of the window.

In games using matrix rendering rather than sprites, the impact of this change might not be as great because the abstract coordinate system will adjust to match the new window size. There will still be considerably more space available at each side of the window, though, which might result in unexpected graphics appearing.

If your Windows Phone 7 game uses landscape orientation, the effect of the new window size will be much less significant as the Windows monitor is very likely to be using the same orientation. A window that is 800 × 480 pixels feels much more comfortable in Windows than one that is 480 × 800 pixels.

4.2. Using Full Screen Mode

A very common feature of Windows games is the ability to run in full screen mode, where the game takes over the entire display rather than running inside a floating window. Full screen mode is handled in Windows in the same way as the phone—by setting the graphics.IsFullScreen property to true in the class constructor.

You can uncomment it to see its effects, but before you do, note that when the game is running in full screen mode, there is no Close Window button to use to leave the game and return to Windows. The keyboard shortcut Alt+F4 is the answer here because it closes the active window; use it when the game is running to close its window down.

Be very careful when using breakpoints in a game running in full screen mode. The breakpoint will fire, but the game window will continue to display over the whole screen, making it difficult to proceed. It is strongly advisable to run the game in windowed mode when you are debugging it.


Once your game is running, if you decide to switch between full screen and windowed mode, you can just call the graphics.ToggleFullScreen method and XNA will take care of everything for you.

When the game runs in full screen mode, Windows will automatically stretch it to fill the whole monitor. This can be very useful, but can also result in the graphics being stretched if the aspect ratio of the monitor doesn't match that of the window.

Something you might want to do is to run the game at the native screen resolution being used by Windows. At the time the game class constructor is running, nothing is available to provide this information, but we can defer the setting of the resolution until a moment later, by which time the desktop width and height can be retrieved.

This is achieved instead by setting up an event handler for the _graphics object's PreparingDeviceSettings event. When that event fires, the back buffer size can be set to match the size of the current display mode, as shown in Listing 4.

Example 4. Setting the window size to match the size of the desktop
public Game1()
  {
      _graphics = new GraphicsDeviceManager(this);
      Content.RootDirectory = "Content";

      // Frame rate is 30 fps by default for Windows Phone.
      TargetElapsedTime = TimeSpan.FromSeconds(1.0f / 30);

      // Set backbuffer size and orientation
#if WINDOWS_PHONE
      _graphics.PreferredBackBufferWidth = 480;
      _graphics.PreferredBackBufferHeight = 800;
#else
      // Instead of setting a fixed size, use the size of the Windows desktop
      _graphics.PreparingDeviceSettings += new
          EventHandler<PreparingDeviceSettingsEventArgs>(_graphics_PreparingDeviceSettings);
#endif

      // Switch to full screen mode
      _graphics.IsFullScreen = true;
  }

  // Set the window size to match the desktop resolution
  void _graphics_PreparingDeviceSettings(object sender, PreparingDeviceSettingsEventArgs e)
  {
      e.GraphicsDeviceInformation.PresentationParameters.BackBufferHeight =
                        e.GraphicsDeviceInformation.Adapter.CurrentDisplayMode.Height;
      e.GraphicsDeviceInformation.PresentationParameters.BackBufferWidth =
                        e.GraphicsDeviceInformation.Adapter.CurrentDisplayMode.Width;
  }

					  

Be aware when setting the resolution in this way that you have no idea what size your window will actually end up being. You will need to ensure that your rendering code is resolution-independent to ensure that the game continues to be playable on all different screen modes.

In a finished game, it is worth considering providing options to give the user a choice of window sizes and control over whether the game will display in full screen mode or not.

4.3. Showing and Hiding the Mouse Cursor

XNA's default behavior in Windows is to hide the mouse cursor when it is over the game window. This might be what you want in full screen mode (though it also might not), but in windowed mode it can be quite distracting—when the user moves the cursor across the window to click the window's Close button, the cursor suddenly vanishes!

Its behavior is easy controlled using the IsMouseVisible property provided by the XNA Game class. You can therefore simply change this property in your constructor or elsewhere in your game to control the cursor visibility, as shown in Listing 5.

Example 5. Showing the mouse cursor
this.IsMouseVisible = true;
Other -----------------
- Windows Phone 8 : Developing for the Phone - The Phone Experience (part 4) - Understanding Idle Detection, The Tilt Effect
- Windows Phone 8 : Developing for the Phone - The Phone Experience (part 3) - Application Client Area, Application Bar
- Windows Phone 8 : Developing for the Phone - The Phone Experience (part 2) - Designing for Touch
- Windows Phone 8 : Developing for the Phone - The Phone Experience (part 1) - Orientation
- Windows Phone 8 : Developing for the Phone - Application Lifecycle (part 3) - Tombstoning
- Windows Phone 8 : Developing for the Phone - Application Lifecycle (part 2) - Navigation
- Windows Phone 8 : Developing for the Phone - Application Lifecycle (part 1)
- Windows Phone 8 : Designing for the Phone - Implementing the Look and Feel of the Phone
- Windows Phone 8 : Designing for the Phone - Designing with Visual Studio
- Windows Phone 7 : 3D Game Development (part 4) - Rendering 3D Models
 
 
REVIEW
- First look: Apple Watch

- 10 Amazing Tools You Should Be Using with Dropbox
 
VIDEO TUTORIAL
- How to create your first Swimlane Diagram or Cross-Functional Flowchart Diagram by using Microsoft Visio 2010 (Part 1)

- How to create your first Swimlane Diagram or Cross-Functional Flowchart Diagram by using Microsoft Visio 2010 (Part 2)

- How to create your first Swimlane Diagram or Cross-Functional Flowchart Diagram by using Microsoft Visio 2010 (Part 3)
 
Popular tags
Microsoft Access Microsoft Excel Microsoft OneNote Microsoft PowerPoint Microsoft Project Microsoft Visio Microsoft Word Active Directory Biztalk Exchange Server Microsoft LynC Server Microsoft Dynamic Sharepoint Sql Server Windows Server 2008 Windows Server 2012 Windows 7 Windows 8 Adobe Indesign Adobe Flash Professional Dreamweaver Adobe Illustrator Adobe After Effects Adobe Photoshop Adobe Fireworks Adobe Flash Catalyst Corel Painter X CorelDRAW X5 CorelDraw 10 QuarkXPress 8 windows Phone 7 windows Phone 8 BlackBerry Android Ipad Iphone iOS
Popular keywords
HOW TO Swimlane in Visio Visio sort key Pen and Touch Creating groups in Windows Server Raid in Windows Server Exchange 2010 maintenance Exchange server mail enabled groups Debugging Tools Collaborating
Top 10
- Microsoft Excel : How to Use the VLookUp Function
- Fix and Tweak Graphics and Video (part 3) : How to Fix : My Screen Is Sluggish - Adjust Hardware Acceleration
- Fix and Tweak Graphics and Video (part 2) : How to Fix : Text on My Screen Is Too Small
- Fix and Tweak Graphics and Video (part 1) : How to Fix : Adjust the Resolution
- Windows Phone 8 Apps : Camera (part 4) - Adjusting Video Settings, Using the Video Light
- Windows Phone 8 Apps : Camera (part 3) - Using the Front Camera, Activating Video Mode
- Windows Phone 8 Apps : Camera (part 2) - Controlling the Camera’s Flash, Changing the Camera’s Behavior with Lenses
- Windows Phone 8 Apps : Camera (part 1) - Adjusting Photo Settings
- MDT's Client Wizard : Package Properties
- MDT's Client Wizard : Driver Properties
 
Windows XP
Windows Vista
Windows 7
Windows Azure
Windows Server
Windows Phone
2015 Camaro