ApplicationBarIcon คือ แถบของเมนูที่มีลักษณะเป็นไอคอน ดังรูป
มาดูขั้นตอนการสร้าง ApplicationBarIcon กัน
1. สร้างโปรเจคขึ้นมาใหม่
2. สร้าง folder ขึ้นมาใหม่สำหรับใช้เก็บภาพ(คลิกขวาที่โปรเจค เลือก Add เลือก New Folder และตั้งชื่อ Folder ในที่นี้จะตั้งชื่อว่า Icon) ดังภาพ
3. Copy ไอคอนที่ต้องการมาไว้ใน Folder ดังรูป
4. กำหนดค่า Properties ให้ Build Action เป็น Content
5. การเพิ่ม tag เข้าไปใน file .xaml
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True">
<shell:ApplicationBar.Buttons>
<shell:ApplicationBarIconButton IconUri="/images/add.png" Text="Start" ></shell:ApplicationBarIconButton>
</shell:ApplicationBar.Buttons>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
เราสามารถเพิ่ม icon โดยเพิ่ม tag
<shell:ApplicationBarIconButton IconUri="" Text="" ></shell:ApplicationBarIconButton>
ไว้ระหว่าง tag <shell:ApplicationBar.Buttons>
โดย IconUri คือที่อยู่ของ Icon และ Text คือ คำอธิบายการทำงานของIconสั้นๆ
6. ทดสอบรันโปรแกรม
ยังไม่จบต่อไปเราจะเพิ่มเมนูบาร์เข้าไปด้วย ดังภาพ
โดยการเพิ่ม tag
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Text="MenuItem 1" ></shell:ApplicationBarMenuItem>
<shell:ApplicationBarMenuItem Text="MenuItem 2" ></shell:ApplicationBarMenuItem>
</shell:ApplicationBar.MenuItems>
ระหว่าง Tag <shell:ApplicationBar> ดังภาพ
โดยสามารถเพิ่มเมนูการเพิ่ม
<shell:ApplicationBarMenuItem Text="MenuItem 1" </shell:ApplicationBarMenuItem>
ระหว่าง tag <shell:ApplicationBar.MenuItems> โดย Text คือชื่อของเมนูที่เราตั้งขึ้น
7. ทดสอบรันโปรแกรม จะได้ดังภาพ