Reduce, Reuse and Recycle: Listing 1.

Windows Phone navigation page.

<phone:PhoneApplicationPage x:Class="WindowsPhoneTestApp.MainPage"
                            ...>
 
  <!--LayoutRoot is the root grid where all page content is placed-->
  <Grid x:Name="LayoutRoot"
         Background="Transparent">
    <Grid.RowDefinitions>
      <RowDefinition Height="Auto" />
      <RowDefinition Height="*" />
    </Grid.RowDefinitions>
 
    <!--TitlePanel contains the name of the application and page title-->
    <StackPanel x:Name="TitlePanel"
                  Grid.Row="0"
                  Margin="12,17,0,28">
      <TextBlock x:Name="ApplicationTitle"
                   Text="WP7 EXPRESS"
                   Style="{StaticResource PhoneTextNormalStyle}" />
      <TextBlock x:Name="PageTitle"
                   Text="item picker"
                   Margin="9,-7,0,0"
                   Style="{StaticResource PhoneTextTitle1Style}" />
    </StackPanel>
 
    <!--ContentPanel - place additional content here-->
    <Grid x:Name="ContentPanel"
           Grid.Row="1"
           Margin="12,0,12,0">
      <ListBox x:Name="xItemListBox" 
                 SelectionChanged="xItemListBox_SelectionChanged">
        <ListBox.ItemTemplate>
          <DataTemplate>
            <StackPanel>
              <TextBlock Text="{Binding Title}"
                           Style="{StaticResource PhoneTextLargeStyle}" />
              <TextBlock Text="{Binding SubTitle}"
                           Style="{StaticResource PhoneTextAccentStyle}" />
            </StackPanel>
          </DataTemplate>
        </ListBox.ItemTemplate>
      </ListBox>                    
    </Grid>
  </Grid>

  <phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
      <shell:ApplicationBarIconButton IconUri="/Images/SaveImage.png" Text="Save"/>
      <shell:ApplicationBarIconButton IconUri="/Images/EditImage.png" Text="Edit"/>
      <shell:ApplicationBar.MenuItems>
        <shell:ApplicationBarMenuItem Text="About"/>
        <shell:ApplicationBarMenuItem Text="Settings"/>
      </shell:ApplicationBar.MenuItems>
    </shell:ApplicationBar>
  </phone:PhoneApplicationPage.ApplicationBar>
</phone:PhoneApplicationPage>

About the Author

Todd Anglin is Executive Vice President of Cross-Platform Tools & Services for Telerik, a provider of tools and solutions for web, desktop and mobile application development. In his role Todd is responsible for teams focused on cross-platform solutions, which include the company’s popular HTML/JavaScript framework, Kendo UI, as well as Icenium, the easiest way to build hybrid mobile apps. Todd is an author and frequent speaker on HTML5 and web standards development. Follow Todd @toddanglin for his latest writings and industry insights.

comments powered by Disqus

Featured

  • Kubernetes for Developers

    Microsoft's Dan Wahlin previews his introductory "Kubernetes for Developers" session at Visual Studio Live! San Diego 2026, explaining how developers can get past the Kubernetes learning curve by starting locally, mastering Pods first, and using Services to make containerized applications reliably accessible.

  • VS Code Keeps Eye on Costs in v1.126 Update

    Visual Studio Code 1.126 adds session-level Copilot cost information, continuing Microsoft's recent focus on helping developers monitor and manage usage-based GitHub Copilot billing.

  • Open VSX 1.0.0 Puts Focus on Open Extension Registry for VS Code Ecosystem

    Eclipse Open VSX has reached 1.0.0, highlighting its role as a vendor-neutral registry for VS Code-compatible extensions.

  • Infragistics Puts MCP Toolchain at Center of Ultimate 26.1

    Infragistics Ultimate 26.1 introduces the Ignite UI Enterprise MCP toolchain for AI-assisted app development across Angular, React, Web Components and Blazor.

Subscribe on YouTube