SlideShare a Scribd company logo
1 of 21
Windows Phone 7 Li Jingnan / Wang Tao 2011-7-15 1
2 days 2
about anytao| Ethos <ethos:Member    id = “Wang Tao”    msn = anytao@live.com weibo = http://weibo.com/anytao runat = “Senior System Architect” /> Jason | Ethos <ethos:Member    id = “Li Jingnan”    msn = zengnami@hotmail.com weibo= http://weibo.com/jn1981 runat = “SE” />
about http://book.anytao.net
03 application bar Wang Tao / 2011-07-15
session outline application bar navigation overview frame & page application bar overview page navigation methods query string goback
navigations 7
frame & page PhoneApplicationFrame Top Container: PhoneApplicationFrame Including: Page control System Tray Application Bar PhoneApplicationPage Fill content of Frame Page inherit from PhoneApplicationPage Including: Title Application Bar 8
ApplicationBar use ApplicationBar instead of creating you own menu system ApplicationBarIconButton up to 4buttons don’t fill all 4 slots if not need size: 48×48 ApplicationBarMenuItem up to 5 menus avoid long text 9
Application Bar in xaml 10
ApplicationBar and Landscope 11
Application Bar opacity 12
page navigation 13 Silverlight on Windows Phone Similar like web page Navigate by URI Stateless private void hyperlinkButton1_Click (object sender, RoutedEventArgs e) {  NavigationService.Navigate(               new Uri("/SecondPage.xaml",        UriKind.RelativeOrAbsolute));  }
navigation method OnNavigatingFrom OnNavigatedFrom OnNavigatedTo 14
query string send query string private void passParam_Click(object sender, RoutedEventArgs e) { NavigationService.Navigate(new Uri("/SecondPage.xaml?msg=" + 				    textBox1.Text, UriKind.Relative)); } get query string protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e) { base.OnNavigatedTo(e);   string msg = string.Empty;         if (NavigationContext.QueryString.TryGetValue("msg", out msg)) 	textBlock1.Text = msg;            } 15
go back private void button1_Click (object sender, RoutedEventArgs e) {  NavigationService.GoBack();  } 16
navigate in UserControl 17
demo 18 / app bar / app bar menu / landscape  / navigation service 02 application bar
practice 19 build your context menu
20 thank youwww.anytao.com
21

More Related Content

Similar to 03 wp7 application bar

01 wp7 introduction
01 wp7   introduction01 wp7   introduction
01 wp7 introductionTao Wang
 
Making mobile apps with web technology
Making mobile apps with web technologyMaking mobile apps with web technology
Making mobile apps with web technologyManyoung Cho
 
Making mobile apps with web technology (revised)
Making mobile apps with web technology (revised)Making mobile apps with web technology (revised)
Making mobile apps with web technology (revised)Manyoung Cho
 
Seam Introduction
Seam IntroductionSeam Introduction
Seam Introductionihamo
 
Creating Yahoo Mobile Widgets
Creating Yahoo Mobile WidgetsCreating Yahoo Mobile Widgets
Creating Yahoo Mobile WidgetsRicardo Varela
 
Developing Application in WP7
Developing Application in WP7Developing Application in WP7
Developing Application in WP7Kunal Chowdhury
 
Component and Event-Driven Architectures in PHP
Component and Event-Driven Architectures in PHPComponent and Event-Driven Architectures in PHP
Component and Event-Driven Architectures in PHPStephan Schmidt
 
USC Yahoo! BOSS, YAP and YQL Overview
USC Yahoo! BOSS, YAP and YQL OverviewUSC Yahoo! BOSS, YAP and YQL Overview
USC Yahoo! BOSS, YAP and YQL OverviewJonathan LeBlanc
 

Similar to 03 wp7 application bar (8)

01 wp7 introduction
01 wp7   introduction01 wp7   introduction
01 wp7 introduction
 
Making mobile apps with web technology
Making mobile apps with web technologyMaking mobile apps with web technology
Making mobile apps with web technology
 
Making mobile apps with web technology (revised)
Making mobile apps with web technology (revised)Making mobile apps with web technology (revised)
Making mobile apps with web technology (revised)
 
Seam Introduction
Seam IntroductionSeam Introduction
Seam Introduction
 
Creating Yahoo Mobile Widgets
Creating Yahoo Mobile WidgetsCreating Yahoo Mobile Widgets
Creating Yahoo Mobile Widgets
 
Developing Application in WP7
Developing Application in WP7Developing Application in WP7
Developing Application in WP7
 
Component and Event-Driven Architectures in PHP
Component and Event-Driven Architectures in PHPComponent and Event-Driven Architectures in PHP
Component and Event-Driven Architectures in PHP
 
USC Yahoo! BOSS, YAP and YQL Overview
USC Yahoo! BOSS, YAP and YQL OverviewUSC Yahoo! BOSS, YAP and YQL Overview
USC Yahoo! BOSS, YAP and YQL Overview
 

More from Tao Wang

团队高效沟通的秘密
团队高效沟通的秘密团队高效沟通的秘密
团队高效沟通的秘密Tao Wang
 
高效团队的秘密
高效团队的秘密高效团队的秘密
高效团队的秘密Tao Wang
 
Worktile 更好用的企业协作平台
Worktile   更好用的企业协作平台Worktile   更好用的企业协作平台
Worktile 更好用的企业协作平台Tao Wang
 
09 wp7 multitasking
09 wp7   multitasking09 wp7   multitasking
09 wp7 multitaskingTao Wang
 
08 wp7 push notification
08 wp7   push notification08 wp7   push notification
08 wp7 push notificationTao Wang
 
08 wp7 push notification
08 wp7   push notification08 wp7   push notification
08 wp7 push notificationTao Wang
 
07 wp7 application lifecycle
07 wp7   application lifecycle07 wp7   application lifecycle
07 wp7 application lifecycleTao Wang
 
06 wp7 isolation storage
06 wp7   isolation storage06 wp7   isolation storage
06 wp7 isolation storageTao Wang
 
03 wp7 application bar
03 wp7   application bar03 wp7   application bar
03 wp7 application barTao Wang
 
05 wp7 launchers and choosers
05 wp7   launchers and choosers05 wp7   launchers and choosers
05 wp7 launchers and choosersTao Wang
 
04 wp7 pivot and panorama
04 wp7   pivot and panorama04 wp7   pivot and panorama
04 wp7 pivot and panoramaTao Wang
 
02 wp7 building silverlight applications
02 wp7   building silverlight applications02 wp7   building silverlight applications
02 wp7 building silverlight applicationsTao Wang
 
Azure 迁移之道
Azure 迁移之道Azure 迁移之道
Azure 迁移之道Tao Wang
 
01 windows azure platform overview
01 windows azure platform overview01 windows azure platform overview
01 windows azure platform overviewTao Wang
 
Facebook and its development
Facebook and its developmentFacebook and its development
Facebook and its developmentTao Wang
 
What is silverlight?
What is silverlight?What is silverlight?
What is silverlight?Tao Wang
 

More from Tao Wang (16)

团队高效沟通的秘密
团队高效沟通的秘密团队高效沟通的秘密
团队高效沟通的秘密
 
高效团队的秘密
高效团队的秘密高效团队的秘密
高效团队的秘密
 
Worktile 更好用的企业协作平台
Worktile   更好用的企业协作平台Worktile   更好用的企业协作平台
Worktile 更好用的企业协作平台
 
09 wp7 multitasking
09 wp7   multitasking09 wp7   multitasking
09 wp7 multitasking
 
08 wp7 push notification
08 wp7   push notification08 wp7   push notification
08 wp7 push notification
 
08 wp7 push notification
08 wp7   push notification08 wp7   push notification
08 wp7 push notification
 
07 wp7 application lifecycle
07 wp7   application lifecycle07 wp7   application lifecycle
07 wp7 application lifecycle
 
06 wp7 isolation storage
06 wp7   isolation storage06 wp7   isolation storage
06 wp7 isolation storage
 
03 wp7 application bar
03 wp7   application bar03 wp7   application bar
03 wp7 application bar
 
05 wp7 launchers and choosers
05 wp7   launchers and choosers05 wp7   launchers and choosers
05 wp7 launchers and choosers
 
04 wp7 pivot and panorama
04 wp7   pivot and panorama04 wp7   pivot and panorama
04 wp7 pivot and panorama
 
02 wp7 building silverlight applications
02 wp7   building silverlight applications02 wp7   building silverlight applications
02 wp7 building silverlight applications
 
Azure 迁移之道
Azure 迁移之道Azure 迁移之道
Azure 迁移之道
 
01 windows azure platform overview
01 windows azure platform overview01 windows azure platform overview
01 windows azure platform overview
 
Facebook and its development
Facebook and its developmentFacebook and its development
Facebook and its development
 
What is silverlight?
What is silverlight?What is silverlight?
What is silverlight?
 

Recently uploaded

This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.christianmathematics
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introductionMaksud Ahmed
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhikauryashika82
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...Poonam Aher Patil
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsTechSoup
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxDenish Jangid
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxheathfieldcps1
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxAreebaZafar22
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17Celine George
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.MaryamAhmad92
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin ClassesCeline George
 
Role Of Transgenic Animal In Target Validation-1.pptx
Role Of Transgenic Animal In Target Validation-1.pptxRole Of Transgenic Animal In Target Validation-1.pptx
Role Of Transgenic Animal In Target Validation-1.pptxNikitaBankoti2
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxVishalSingh1417
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactPECB
 
Class 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdfClass 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdfAyushMahapatra5
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...Nguyen Thanh Tu Collection
 
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-IIFood Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-IIShubhangi Sonawane
 

Recently uploaded (20)

This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introduction
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The Basics
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
The basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptxThe basics of sentences session 2pptx copy.pptx
The basics of sentences session 2pptx copy.pptx
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
 
Role Of Transgenic Animal In Target Validation-1.pptx
Role Of Transgenic Animal In Target Validation-1.pptxRole Of Transgenic Animal In Target Validation-1.pptx
Role Of Transgenic Animal In Target Validation-1.pptx
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptx
 
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global ImpactBeyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
 
Asian American Pacific Islander Month DDSD 2024.pptx
Asian American Pacific Islander Month DDSD 2024.pptxAsian American Pacific Islander Month DDSD 2024.pptx
Asian American Pacific Islander Month DDSD 2024.pptx
 
Class 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdfClass 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdf
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-IIFood Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
Food Chain and Food Web (Ecosystem) EVS, B. Pharmacy 1st Year, Sem-II
 

03 wp7 application bar

  • 1. Windows Phone 7 Li Jingnan / Wang Tao 2011-7-15 1
  • 3. about anytao| Ethos <ethos:Member id = “Wang Tao” msn = anytao@live.com weibo = http://weibo.com/anytao runat = “Senior System Architect” /> Jason | Ethos <ethos:Member id = “Li Jingnan” msn = zengnami@hotmail.com weibo= http://weibo.com/jn1981 runat = “SE” />
  • 5. 03 application bar Wang Tao / 2011-07-15
  • 6. session outline application bar navigation overview frame & page application bar overview page navigation methods query string goback
  • 8. frame & page PhoneApplicationFrame Top Container: PhoneApplicationFrame Including: Page control System Tray Application Bar PhoneApplicationPage Fill content of Frame Page inherit from PhoneApplicationPage Including: Title Application Bar 8
  • 9. ApplicationBar use ApplicationBar instead of creating you own menu system ApplicationBarIconButton up to 4buttons don’t fill all 4 slots if not need size: 48×48 ApplicationBarMenuItem up to 5 menus avoid long text 9
  • 13. page navigation 13 Silverlight on Windows Phone Similar like web page Navigate by URI Stateless private void hyperlinkButton1_Click (object sender, RoutedEventArgs e) { NavigationService.Navigate( new Uri("/SecondPage.xaml", UriKind.RelativeOrAbsolute)); }
  • 14. navigation method OnNavigatingFrom OnNavigatedFrom OnNavigatedTo 14
  • 15. query string send query string private void passParam_Click(object sender, RoutedEventArgs e) { NavigationService.Navigate(new Uri("/SecondPage.xaml?msg=" + textBox1.Text, UriKind.Relative)); } get query string protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e) { base.OnNavigatedTo(e); string msg = string.Empty; if (NavigationContext.QueryString.TryGetValue("msg", out msg)) textBlock1.Text = msg; } 15
  • 16. go back private void button1_Click (object sender, RoutedEventArgs e) { NavigationService.GoBack(); } 16
  • 18. demo 18 / app bar / app bar menu / landscape / navigation service 02 application bar
  • 19. practice 19 build your context menu
  • 21. 21

Editor's Notes

  1. 所有应用程序必须要有一个根Phone Frame可以从它继承自定义
  2. 在创建之前一定要先在Reference里加入Microsoft.Phone.shell,并且在xaml页面加上xmlns:shell=”clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone.Shell”.菜单栏设计最佳实践在设计菜单栏时要考虑的有以下几点:* 利用系统提供的菜单栏而非自己创建的菜单系统。这样能够使设备上所有应用程序保持统一的用户体验。而且系统提供的菜单栏支持动画和屏幕变换。* 用系统默认的主题而非自定义的颜色。使用自定义颜色会影响图标按钮和菜单动画的效果,而且在某些显示设置下会更耗电。* 菜单栏的透明度可以任意调整,但这里推荐只使用0,0.5和1。* 如果菜单栏的透明度小于1,当前显示页面大小会和屏幕大小一样,菜单栏会遮在它上面。如果透明度为1,显示页面会自动改变大小以适应未被菜单栏遮住的区域。图标按钮设计最佳实践* 用作图标的图片应该是使用了a通道的图片,其背景色为透明,前景色为白色。菜单栏会根据系统主题样式来改变图标的颜色。如果使用了带有背景色的图片,会导致不可预知的问题。* 图标按钮上的圆圈是在运行时由菜单栏加上去的,不需要在源图片里添加圆圈。* 用作图标的图片大小应该是48x48像素。图片内容的大小应该不超出26x26像素的范围,这样才不会被菜单栏加上的圆圈遮住。* 不要设置后退按钮。因为设备上的后退按钮就是专门指定用于页面后退的。* 把最常用的功能设置在图标按钮上。如果某些功能用图标不容易理解,就考虑用菜单项。* 图标按钮上的图片退便在转屏时不要有歧义。* 可以直接用于你的程序中的图标可以从这里下载。 菜单项设计最佳实践* 避免使用超过5个的菜单项,否则用户必须滚动屏幕才能看到。* 在单个菜单项中避免使用过长的文字,否则会引起截断。推荐菜单项内容长度为14到20个英文字符之间。* 为保证良好的用户体验,所有的菜单项和图标按钮的文字都会被变成小写字符。
  3. Silverlight on Windows Phone基于页面导航模型与Web页面模型相似通过URI标识每个页面每个页面是无状态的
  4. 当Page1切换到Page21.Page1执行OnNavigatingFrom2.Page1执行OnNavigatedFrom3.Page2执行OnNavigateToOnNavigatingFrom当Page不再是活动页面前OnNavigatedFrom当Page不再是活动页面时OnNavigatedTo当Page被激活时