Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 103,811

HOME > Mobile > Windows Phone Dev - สอนเขียน App บนโปรแกรม Windows Phone 7 , Windows Phone 8 > การสร้าง ApplicationBar (MenuItem) บน Windows Phone



การสร้าง ApplicationBar (MenuItem) บน Windows Phone

การสร้าง ApplicationBar (Menu) บน Windows Phone สำหรับ ApplicationBar เป็นฟีเจอร์หนึ่งที่น่าสนใจบน Windows Phone เมนูนี้จะแสดงอยู่ส่วนล่างของ Page มีทั้งที่เป็น Icons และ Text Item โดย ApplicationBar เป็น Tools ที่สามารถสร้างและใช้งานได้ง่าย ๆ แต่สามารถประยุคใช้กับ Application ได้หลากหลาย และการเขียน Event เพื่อควบคุม Menu ต่าง ๆ ก็สามารถและเรียกใช้งาน Event จากในส่วนของ Code ทีเป็น VB.NET หรือ C#


Windows Phone ApplicationBar

ตัวอย่าง ApplicationBar และ Icons บน Windows Phone


การใช้งาน ApplicationBar บน Windows Phone จะเริ่มต้นด้วย

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


Example การสร้าง ApplicationBar บน Windows Phone แบบง่าย ๆ

 <!--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="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock x:Name="PageTitle" Text="page name" 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">
            <TextBlock Height="66" HorizontalAlignment="Center" Margin="-12,329,6,0" Name="txtResult" Text="Result" VerticalAlignment="Top" FontSize="32" Width="462" TextAlignment="Center" />
        </Grid>
    </Grid>

    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar>
            <shell:ApplicationBarIconButton 
                    x:Name="appbarRewindButton"
                    IconUri="Images/rew.png" 
                    Text="Rewind"
                    Click="OnAppbarRewindClick" />

            <shell:ApplicationBarIconButton 
                    x:Name="appbarPlayButton"
                    IconUri="Images/play.png" 
                    Text="Play"
                    Click="OnAppbarPlayClick" />

            <shell:ApplicationBarIconButton
                    x:Name="appbarPauseButton"
                    IconUri="Images/pause.png" 
                    Text="Pause"
                    Click="OnAppbarPauseClick" />

            <shell:ApplicationBarIconButton
                    x:Name="appbarEndButton"
                    IconUri="Images/ff.png" 
                    Text="To End"
                    Click="OnAppbarEndClick" />

            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem 
                    Text="Sub Menu 1"
                    Click="OnSubMenu1Click" />
                <shell:ApplicationBarMenuItem 
                    Text="Sub Menu 2"
                    Click="OnSubMenu2Click" />
            </shell:ApplicationBar.MenuItems>
            
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

XAML Design

Windows Phone ApplicationBar

หน้าจอ GUI บน Application Page

Windows Phone ApplicationBar

จาก Code ของ ApplicationBar จะสังเตกุว่ามี icons








Windows Phone ApplicationBar

โดย Icons เหล่านี้จัดเก็บไว้ที่โฟเดอร์ Images

Windows Phone ApplicationBar

โดยรูปภาพเหล่านี้จะต้อง Build Action เป็น Content ด้วยการคลิกที่รูปภาพ เลือก Properties

Windows Phone ApplicationBar

Build Action เลือกเป็น Content

Click="OnAppbarRewindClick"

สังเกตุว่าแต่ล่ะปุ่มของ Icons จะมี Event ซึ่ง Event เหล่านี้จะต้องสร้างไว้ในส่วนของ VB.NET หรือ C#

VB.NET
    Private Sub OnAppbarRewindClick(sender As Object, e As System.EventArgs)
        Me.txtResult.Text = "Your Click on Rewind"
    End Sub

    Private Sub OnAppbarPlayClick(sender As Object, e As System.EventArgs)
        Me.txtResult.Text = "Your Click on Play"
    End Sub

    Private Sub OnAppbarPauseClick(sender As Object, e As System.EventArgs)
        Me.txtResult.Text = "Your Click on Pause"
    End Sub

    Private Sub OnAppbarEndClick(sender As Object, e As System.EventArgs)
        Me.txtResult.Text = "Your Click on To End"
    End Sub

    Private Sub OnSubMenu1Click(sender As Object, e As System.EventArgs)
        Me.txtResult.Text = "Your Click on Sub Menu 1"
    End Sub

    Private Sub OnSubMenu2Click(sender As Object, e As System.EventArgs)
        Me.txtResult.Text = "Your Click on Sub Menu 2"
    End Sub


C#
private void OnAppbarRewindClick(object sender, System.EventArgs e)
{
	this.txtResult.Text = "Your Click on Rewind";
}

private void OnAppbarPlayClick(object sender, System.EventArgs e)
{
	this.txtResult.Text = "Your Click on Play";
}

private void OnAppbarPauseClick(object sender, System.EventArgs e)
{
	this.txtResult.Text = "Your Click on Pause";
}

private void OnAppbarEndClick(object sender, System.EventArgs e)
{
	this.txtResult.Text = "Your Click on To End";
}

private void OnSubMenu1Click(object sender, System.EventArgs e)
{
	this.txtResult.Text = "Your Click on Sub Menu 1";
}

private void OnSubMenu2Click(object sender, System.EventArgs e)
{
	this.txtResult.Text = "Your Click on Sub Menu 2";
}


กำหนด Event ของภาษา VB.NET หรือ C#

Screenshot

Windows Phone ApplicationBar

แสดง ApplicationBar บนหน้าจอ

Windows Phone ApplicationBar

เมื่อคลิกที่ ... จะแสดงรายการ Menu ขึ้นมาด้วย

Windows Phone ApplicationBar

แสดงข้อความเมื่อคลิกที่ปุ่ม Icons ต่าง ๆ







.

   
Share


ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท


ลองใช้ค้นหาข้อมูล


   


Bookmark.   
       
  By : ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
  Score Rating :  
  Create/Update Date : 2012-09-02 20:26:56 / 2017-03-25 22:13:24
  Download : No files
 Sponsored Links / Related

 
Dynamically Create Controls AddHandler (Event Handler) บน Windows Phone
Rating :

 
ตัวอย่างโปรแกรม Code Samples สำหรับ Windows Phone
Rating :

 
Windows Phone Posting Data to Web Server URL (Website)
Rating :

 
Windows Phone Show List Data from Web Server (Website)
Rating :

 
Windows Phone Search Data from Web Server
Rating :

 
Windows Phone Edit Update data to Web Server
Rating :

 
Windows Phone Delete data in Web Server
Rating :

 
Windows Phone and BackgroundWorker
Rating :


ThaiCreate.Com Forum




Comunity Forum Free Web Script
Jobs Freelance Free Uploads
Free Web Hosting Free Tools

สอน PHP ผ่าน Youtube ฟรี
สอน Android การเขียนโปรแกรม Android
สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8
สอน iOS การเขียนโปรแกรม iPhone, iPad
สอน Java การเขียนโปรแกรม ภาษา Java
สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI
สอน JSP การเขียนโปรแกรม ภาษา Java
สอน jQuery การเขียนโปรแกรม ภาษา jQuery
สอน .Net การเขียนโปรแกรม ภาษา .Net
Free Tutorial
สอน Google Maps Api
สอน Windows Service
สอน Entity Framework
สอน Android
สอน Java เขียน Java
Java GUI Swing
สอน JSP (Web App)
iOS (iPhone,iPad)
Windows Phone
Windows Azure
Windows Store
Laravel Framework
Yii PHP Framework
สอน jQuery
สอน jQuery กับ Ajax
สอน PHP OOP (Vdo)
Ajax Tutorials
SQL Tutorials
สอน SQL (Part 2)
JavaScript Tutorial
Javascript Tips
VBScript Tutorial
VBScript Validation
Microsoft Access
MySQL Tutorials
-- Stored Procedure
MariaDB Database
SQL Server Tutorial
SQL Server 2005
SQL Server 2008
SQL Server 2012
-- Stored Procedure
Oracle Database
-- Stored Procedure
SVN (Subversion)
แนวทางการทำ SEO
ปรับแต่งเว็บให้โหลดเร็ว


สุดยอด Source Code V2.0
 

แจ้งชำระเงิน/โอนเงิน
 

Hit Link
   


Acc : thaicreate@hotmail.com










Load balance : Server 00
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2017 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
for Contact Us : [Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 , 08-9968-0655 อัตราราคา คลิกที่นี่