Listing 2.1 contains the very simple user interface for Flashlight, which uses the application bar shown previously and places only a grid inside the page. The result is shown in Figure 2.6, with the menu visible.
LISTING 2.1 MainPage.xaml—The User Interface for Flashlight
[code]
<phone:PhoneApplicationPage
x:Class=”WindowsPhoneApp.MainPage”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”
xmlns:phone=”clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone”
xmlns:shell=”clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone”
SupportedOrientations=”PortraitOrLandscape”>
<phone:PhoneApplicationPage.ApplicationBar>
<!– The ApplicationBar object: –>
<shell:ApplicationBar Opacity=”.5”>
<!– Two buttons: –>
<shell:ApplicationBarIconButton Text=”sos” IconUri=”Images/sos.png”
Click=”SosButton_Click”/>
<shell:ApplicationBarIconButton Text=”strobe” IconUri=”Images/strobe.png”
Click=”StrobeButton_Click”/>
<!– Eight menu items: –>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Text=”red”/>
<shell:ApplicationBarMenuItem Text=”orange”/>
<shell:ApplicationBarMenuItem Text=”yellow”/>
<shell:ApplicationBarMenuItem Text=”green”/>
<shell:ApplicationBarMenuItem Text=”cyan”/>
<shell:ApplicationBarMenuItem Text=”purple”/>
<shell:ApplicationBarMenuItem Text=”gray”/>
<shell:ApplicationBarMenuItem Text=”white”/>
</shell:ApplicationBar.MenuItems>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
<!– No content other than a solid background: –>
<Grid x:Name=”BackgroundGrid” Background=”White”/>
</phone:PhoneApplicationPage>
[/code]
Notes:
- This app—and the remaining apps in this book—all use a .NET namespace of simply WindowsPhoneApp. This is done for easy code sharing. Several controls, pages, and other classes are shared among apps in this book series simply by linking the common source files into the relevant projects.
- The page supports all orientations because there is no reason not to; the application bar and its menu handle every orientation as expected.
- A grid is placed inside the page with the hard-coded white background because setting the page’s background has no effect.
- The application bar is given an opacity of .5 rather than 0 so the icons and text appear in all conditions, avoiding white-on-white and black-on-black. The application bar foreground is either black or white based on the user’s
theme, and the app background periodically becomes black when SOS or strobe modes are used. - Although the two buttons have handlers for their Click event assigned in XAML, the handler for the Click event on each menu item is assigned in the codebehind seen in the next section.