Part 9: Overview of the Windows Phone 8 Emulator
We've seen the Windows Phone Emulator at work in this series. It is a crucial component to developing apps for the Windows Phone platform, so I wanted to spend a little time becoming more familiar with it and point you in the right direction for more information.
Our game plan in this lesson ...
- We'll learn about what the Windows Phone Emulator really is, and how it supplies different versions for different deployment scenarios.
- We'll learn about the function of the Emulator, including keyboard shortcuts that emulate device buttons.
- We'll learn about the controls to resize, rotate and simulate the act of handling the virtual device as if it were a physical one, with accelerometer support, GPS support, and more.
1. What is the Windows Phone Emulator?
In a nutshell, the Windows Phone Emulator is a desktop application that simulates a Windows Phone device, and actually provides similar performance to a physical Windows Phone device. It provides a virtualized environment in which you can debug and test Windows Phone apps without a physical device—in fact like I said at the outset when installing the Windows Phone 8 API, it's running Microsoft's Hyper-V. For a friendly introduction to Hyper-V on Windows 8, check out this blog post from the Windows 8 team:
Bringing Hyper-V to "Windows 8"
Now, while the Emulator is great for development and quick debugging sessions, before you publish your app to the Windows Phone Store, Microsoft recommends that you actually test your app on a real Windows Phone.
2. Choosing different versions of the Emulator for debugging
Up to now, when we clicked the Run / Debug button on Visual Studio's toolbar, we were running the Emulator in its default configuration ... something called WVGA 512MB:
What does WVGA and 512MB really mean?
The 512MB indicates that we're running in a memory constrained environment ... The default emulator image in Visual Studio is Emulator WVGA 512MB, which emulates a memory-constrained Windows Phone 8 phone. So, for example, the Lumia 610 is an inexpensive entry level Windows Phone 8 device which sports only 256MB of RAM. By contrast, the Lumia 920 has 1 GB of RAM. On lower-RAM devices, having multiple apps running at the same time or creating a memory intensive app might cause performance problems. So, to be sure that your app will run well on lower-RAM devices you can test your app using a realistic Emulator image.
There are a number of great articles about RAM usage on MSDN ... let me point out the best starting point to learn more:
App performance considerations for Windows Phone
Optimizing Apps for Lower Cost Devices
What does "WVGA" as well as those other acronyms stand for?
The Emulator allows you to test your app on a unique emulator image for each of the screen resolutions supported by Windows Phone. This default selection encourages you to target the largest possible market for your Windows Phone 8 app.
- WVGA (800 × 480)
- WXGA (1280 × 768)
- 720p (1280 × 720)
If you run the default, then go to the Settings app in the About button, you can see this confirmed:
How does this translate into the actual phones on the market?
Display size: 4.5 inch
Display resolution: WXGA (1280 x 768)
Display size: 4.3 inch
Display resolution: WVGA (800 x 480)
Display size: 3.7 ''
Display resolution - WVGA (800 x 480)
I realize by the time you watch this there may be newer phone models. The point is that you should be aware of the fact that you'll need to support different screen resolutions and memory constraints. Like I talked about in the lesson on Layout using XAML, you will want to eliminate specific pixel sizes for layout (except for margins). Choosing from the different Emulator sizes, you can make sure you're on the right track.
3. Working with the Phone Emulator's special features
I'll not spend a lot of time on the phone's basic navigation. A lot of this you'll pick up by using the Emulator throughout the series if you don't already have a physical phone in your possession. Essentially, you'll have an almost identical experience, complete with the Start and Apps page, search, web browsing, clock, battery, etc.:
You have the same hardware buttons on the bottom of the Emulator as you would have on a Windows Phone:
Note that you'll be missing the buttons on the side of the phone. For example, my Lumia 920 has three buttons on the side—a volume up and down, a power button, and a camera button. These can be access in the Emulator with keyboard function keys.
There's a list of keyboard mappings here:
- F6 - Camera button half-way
- F7 - Camera button
- F9 - F10 raise and lower the volume
- F11 - plays / pauses audio ... it simulates an in-line headphone button that pauses music and answers incoming phone calls. If you double-tap the button, it'll skip to the next audio track on your playlist or album
- F12 - Power button / lock screen
- F1 - Back button
- F2 - Windows key
- F3 - Search button
Let's work with the Emulator's keyboard ... F3 to Search:
You'll see the phone's keyboard appear. I can use my mouse to simulate tapping the keys. Most of the time during development, that's a pain. I would rather use my computer's keyboard.
PAGE DOWN button - When a textbox is the target input, PAGE DOWN disables the virtualized "hardware" keyboard down, and you can use your physical keyboard for input.
PAGE UP button - When a textbox is the target input, PAGE UP enables the virtualized "hardware" keyboard.
PAUSE/BREAK button - Toggles the keyboard, so you could just use that all the time.
As you can see, I typed in the search phrase "selfridge chicago", looking for articles or a Wikipedia article on one of Chicago's most famous sons, Harry Selfridge who founded the retail store Selfridges of London, and is the subject of a popular TV show on the BBC.
When I click the "Go" keyboard:
The Bing search works in the Emulator just as it would on a physical device, asking for permission to use your location in case it influences the search results. For example, if I were in London, Bing might show me a map of Selfridges near me. However, since I'm in the USA Bing will deliver different results. I'll show you how the Emulator determines its location in just a moment:
In addition to the "virtualized" phone on screen, there's a floating menu off to the right. A little experimentation will reveal the functions of the first six buttons, in order:
- Shuts down the emulator
- Minimizes the emulator
- Rotates the emulator 90 degrees counter clockwise
- Rotates the emulator 90 degrees clockwise
- Expands the emulator to the largest size that can fit comfortably on your computer screen
- Brings up the zoom dialog
- Opens up the additional tools dialog. There are four tabs on the Additional Tools dialog. The first is the Accelerometer which can be used to test apps that utilize the accelerometer sensor:
- You can change the center point of the phone to change its position in 3D space by clicking and dragging the orange dot in the circle.
- You can change the Orientation to one of the presets.
- You can play recorded data, like a "shake" motion.
For more information about the Emulator and the Accelerometer sensor in the Windows Phone SDK, a good starting spot would be this article:
How to test apps that use the accelerometer for Windows Phone
The next tab is the Location tab which allows you to set the current location of the phone. So, even though I'm sitting in Dallas, Texas, I can act like I'm testing my phone in Chicago or any other place in the world. To do this:
- Perform a search for a particular location, like "Chicago, IL".
- Right-click the map to create a pin.
- I'll verify the exact location in the list of pins marked by their latitude and longitude.
Now, I can go to the Windows Phone Emulator's Map app to see the map zoom to that location. We'll rely on this technique later in this series when we create our AroundMe app.
The third tab is for creating Screenshots, which can be helpful when you're creating documentation or bug reports:
And the final tab is the Network tab. There's not a lot you can do other than see the IP address of the phone on the network:
In addition to the Emulator itself, Visual Studio has some tooling that can affect how the XAML designer displays the phone (orientation, theme and color, chrome, etc.):
There's also a Simulation Dashboard that allows you to validate your Windows Phone apps in various real life conditions.
The Simulation Dashboard gives you the ability to simulate different network conditions, trigger reminders, and check how your app will perform under a locked screen:
You have so many ways to test and monitor your app during development time so you gain some confidence in how it will perform when you distribute it on the Store.
The last tip I would give about the emulator is that it's ok to just leave it up and running during development. There's no need to shut it down. When you launch and re-launch your app in debug mode from Visual Studio, part of that process is deploying the latest version of the app to the phone. It's time consuming to relaunch the Emulator each time, and Visual Studio will connect to an existing Emulator instance when it needs to.
So to recap, the Emulator is a great tool that allows you to quickly deploy your app during development to a virtualized Windows Phone. We looked at how to test different device screen sizes and memory constraints, how to manipulate the emulator to test for rotation and motion, how to make the phone think it is located geographically in a specific place, and much more. We'll use these skills extensively throughout this series.