The theme with developing content for the small screens seems to be "whatever sucked on the desktop, sucks even more." The screen size of the Pocket PC is less than 25% of the average desktop and has lower quality, so every pixel you can squeeze out of your interface is precious.
But it's not all bad news; one of the benefits of Flash for any device, particularly the Pocket PC, is that it can be scaled to new screen sizes without any re-authoring of content. This allows developers to create applications with a large number of the applications scaling to larger or smaller screen sizes, as more devices are available.
Whenever possible, the applications you create should be screen-size agnostic and not require specific screen sizes to function and still be usable. If an application relies solely on the characteristics of the display area and screen size, then the user interface has not been clearly separated from the application.
Not only are there fewer pixels on the Pocket PC, but the legibility of the screens isn't as good as their desktop companions. A scaled down 800x600 web site will be unusable and unreadable in most cases, so proper planning is required, as well as a detailed assessment of the screen elements that you have control over and what you don't. When possible consider using fewer elements on the screen, but with higher informational value. For example, universal icons such as home, mail, and so on not only take up less screen size but also are language independent. Also see Chapter 4 and sections in this book to get the most legible and smallest fonts in your Pocket PC applications.
Fit to Screen
By default, Pocket Internet Explorer has Fit to Screen selected by default; if it is not, be sure it is set.
When Fit to Screen is unselected the Flash content will not scale to a different size, but will produce unpredictable results such as scroll bars appearing and the Flash movie moving off screen (see Figure 2.36).
Figure 2.36. Fit to Screen checked and unchecked.
Pocket PC Screen Dissection
The Pocket PC has a screen resolution of 240x320 pixels. Unless you're using a full screen Flash Player (See the "Playing Flash Full Screen on the Pocket PC" section in this chapter for more information) you cannot take advantage of the entire screen.
The resolution of Internet Explorer for Pocket PC 2002 is 240x320 pixels. The user interface of Pocket Internet Explorer defines two areas that cannot be used for content, as shown in Figure 2.37:
Figure 2.37. Top and bottom Pocket Internet Explorer GUI elements.
Both the menu and caption bars take 26 pixels each off the vertical resolution. Therefore, if designing content for a Pocket PC 2002 that fits on one page, the page must not exceed 240x268, which assumes the address bar has not been activated. Once the page exceeds 268 vertical pixels, the vertical scroll bar will appear and reduce the screen width to 229 pixels, or 252 if the address bar is not activated.
The user can decide to switch off the address bar, allowing for an additional 23 pixels at any time, but you cannot detect if the address bar is activated. Even after the user turns off the address bar he will need to refresh the page if the scroll bars were activated. Because this is a fairly lengthy and complicated process for most users, it should be avoided. There are utilities that get rid of the caption or menu bars, see the "Playing Flash Full Screen on the Pocket PC" section later in this chapter for more information. Generally, end users do not enjoy having to do so much work for a Flash application, and this process should only be considered for power users or standalone kiosks-like applications.
When utilizing the full 240 pixel width, the horizontal scroll bars will also appear because Internet Explorer for Pocket PC 2002 needs to provide a way to reveal the remaining 11 pixels with the vertical scroll bar. You can avoid the horizontal scroll bars by setting the margins of the HTML container page to zero. For example in the HTML used to load the Flash Movie:
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
This also applies to the vertical scroll bars. In the Flash Player 5 for Pocket PC template located on Flashenabled.com/book, these parameters are already set. See "Using the Flash Player 5 for Pocket PC Template" section in this chapter for more information.
Of course, be sure to properly test your application to cover all the possible viewable content areas. Generally, deploying content with the application size of 240x240 will display without scroll bars, provided all the margins are set to zero. In an informal poll on Flashenabled.com, 97% of 500 Pocket PC users had the address bar active, so keep that in mind or provide instructions if deploying content in another manner.