Application Bar | Windows Phone - 06 Des 2013

Update kali ini A-F akan shared lagi buat kalian tentang Application Bar | Windows Phone - 6 Des 2013. Application bar adalah sebuah bar dimana sebuah bar icon button dan bar menu item yang akan kita butuhkan dalam pembuatan aplikasi. Sebelumnya saya telah membuat aplikasi bar & pada button yang ada pada aplikasi tersebut berfungsi,Ne contoh tampilannya sebagai berikut :

• Buka Aplikasi windows phone – new project – name dan solution name (ApplicationBar)
• Kemudian Pilih platform Windows Phone 7.1
• Pada project (ApplicationBar)  – Add folder (Images ) – di dalam folder images tambahkan lagi folder (AppBar)  yang berisikan gambar yang terletak pada  C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.1\Icons\dark . Dan pada Properties  ganti  build action gambar dengan content.

Halaman MainPage.xaml

• Lalu ganti kode – kode pada halaman MainPage.xaml. Seperti gambar dibawah ini :

     <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton x:Name="AddBar" IconUri="/Images/AppBar/appbar.add.rest.png" Text="Tambah" Click="AddBar_Click" />
            <shell:ApplicationBarIconButton x:Name="CenBar" IconUri="/Images/AppBar/appbar.close.rest.png" Text="Keluar" Click="CenBar_Click"/>
            <shell:ApplicationBarIconButton x:Name="CheckBar" IconUri="/Images/AppBar/appbar.check.rest.png" Text="Cek" Click="CheckBar_Click"/>
            <shell:ApplicationBarIconButton x:Name="DownBar" IconUri="/Images/AppBar/appbar.download.rest.png" Text="Unduh" Click="DownBar_Click"/>

            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="TEXT" Click="ApplicationBarMenuItem_Click_1"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 2" />
                <shell:ApplicationBarMenuItem Text="MenuItem 3"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 4"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 5"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 6"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 7"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 8"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 9"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 10"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 12"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 12"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>

Halaman MainPage.xaml.cs

 using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace AplicationBar
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();
        }

        private void addAB_Click(object sender, EventArgs e)
        {
            NavigationService.Navigate(new Uri("/Views/AddPage.xaml", UriKind.Relative));

        }

        private void cancelAB_Click(object sender, EventArgs e)
        {

        }

        private void menuItem1_Click(object sender, EventArgs e)
        {

        }

        private void menuItem2_Click(object sender, EventArgs e)
        {

        }

        private void checkAB_Click(object sender, EventArgs e)
        {

        }

        private void downloadAB_Click(object sender, EventArgs e)
        {

        }
    }
}

Pada Event private void addAB_Click, kita tambahkan kode untuk membuat fungsi pada button Add, Ketika kita klik button add, maka button tersebut akan menambahkan atau berpindah kehalaman AddPage.xaml. Sebelunnya kita harus menambahkan halaman AddPage.xaml.

Pada posting sebelum nya A-F sudah posting cara pembuatan navigasi page :
>> http://angga-fian.blogspot.com/2013/11/membuat-navigasi-page-windows-phone-22.html

Terimkasih anda sudah membaca posting Application Bar | Windows Phone - 06 Des 2013 !!