Friday, June 27, 2014

Windows Phone Application Bar

Had a great code review from the local MSFT Dev Rep here.  Thanks Gus!

The review brought out the issue of where is best to build the application bar.  I had chosen to implement it in the code behind.  Based on conversations with Gus and some other considerations
it was decided to implement it in the XAML.

It has been a bit since I last visited the theme.  I spent some time digging around the
windows phone website.  If you have not been there yet it is well worth the time and really critical
if you are writing mobile apps for Windows.

Basic syntax for the app bar in the xaml is:

<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True" Mode="Default" Opacity="1.0" >
            <shell:ApplicationBarIconButton IconUri="/Images/save.png" Text="save" Click="Button1_Click" />
            <shell:ApplicationBarIconButton IconUri="/Images/delete.png" Text="delete" Click="Button2_Click" />
            <shell:ApplicationBarIconButton IconUri="/Images/help.png" Text="help" Click="Button3_Click" />
            <shell:ApplicationBarIconButton IconUri="/Images/settings.png" Text="settings" Click="Button4_Click" />
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="get default size value" Click="MenuItem1_Click" />
                <shell:ApplicationBarMenuItem Text="get mini size value" Click="MenuItem2_Click" />
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

This block created a series of icons across the bottom of the screen and a submenu as well.
Just remember to embed the reference inside the phone page tags!

<phone:PhoneApplicationPage>
.....
</phone:PhoneApplicationPage>

Source:
Adding AppBars XAML
AppBar Class
AppBar Sample code
AppBar Icons - C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v8.0\Icons

No comments:

Post a Comment