How to create app bar with menu windows 8 (Windows Store apps using C# and XAML)

Hi Guys..
These days i am interesting in windows 8 app developing because i have to create 20 windows 8 apps for Microsoft student champs .So i decided to create series of post "How to Create windows 8 app".
Actually i am not going to start this in beginner level but if you requested then i can consider about it.  Lets go to the my fist post in "How to Create windows 8 app"

When you add commands to an app bar, consider whether your command sets would work better in a command menu. Menus let you present more options in less space and include interactive controls. In this example, the Sort menu pops up a simple list that makes choosing options easy.

Step 1: Add an app bar to the app

• Add an app bar to your app.Here, we add a bottom app bar with a button to show the sort menu.

 <Page.BottomAppBar>  
   <AppBar x:Name="bottomAppBar" IsSticky="True">  
     <Grid>  
       <StackPanel x:Name="rightPanel"   
             Orientation="Horizontal" HorizontalAlignment="Right">  
         <Button Style="{StaticResource AppBarButtonStyle}"   
             Content="&#xE174;"   
             AutomationProperties.Name="Sort"  
             AutomationProperties.AutomationId="SortButton"  
             Click="SortMenuButton_Click" />  
       </StackPanel>  
     </Grid>  
   </AppBar>  
 </Page.BottomAppBar>  

Step 2: Show the menu pop up

When a user clicks the Sort command button on the AppBar, you show a Popup menu. The user picks a sort option from the menu.

1. Create a Popup to host the sort menu.

 Popup popUp = new Popup();  




2. Set the Popup.IsLightDismissEnabled property to true.
   With light dismiss enabled, the Popup hides automatically when the user interacts with another part of the app.

 popUp.IsLightDismissEnabled = true;  




3. Create a panel as the root of the menu UI.

 StackPanel panel = new StackPanel();  
 panel.Background = bottomAppBar.Background;  
 panel.Height = 140;  
 panel.Width = 180;  




4. Add command buttons to the menu UI.

 Button byRatingButton = new Button();  
 byRatingButton.Content = "By rating";  
 byRatingButton.Style = (Style)App.Current.Resources["TextButtonStyle"];  
 byRatingButton.Margin = new Thickness(20, 5, 20, 5);  
 byRatingButton.Click += SortButton_Click;  
 panel.Children.Add(byRatingButton);  




5. Add the menu root panel as the Popup content.

 popUp.Child = panel;  




6. Calculate the placement of the Popup menu.
   Here, we place the Popup in the bottom right corner of the screen, above the AppBar, with a padding of 4.

 popUp.HorizontalOffset = Window.Current.CoreWindow.Bounds.Right - panel.Width - 4;  
 popUp.VerticalOffset = Window.Current.CoreWindow.Bounds.Bottom - bottomAppBar.ActualHeight - panel.Height - 4;  




7. Open the Popup.

 popUp.IsOpen = true;  



Thank You Guys :)