[Windows Phone] 导览控制项(Navigation controls)

原文:[Windows Phone] 导览控制项(Navigation controls)

[前言]

如果应用程式只有单一页面,在画面呈现上可能会让使用者容易没有新鲜感,这个范例是使用导览控制项(Navigation controls)来做页面的转跳。

?

[成品]

[Windows Phone] 导览控制项(Navigation controls)? [Windows Phone] 导览控制项(Navigation controls)? [Windows Phone] 导览控制项(Navigation controls)

?

[范例]

Step1. 新增 Windows Phone 应用程式专案。

[Windows Phone] 导览控制项(Navigation controls)

?

Step2. 在专案中新增项目名为 Page1.xaml 的 Windows Phone 直向页面。

[Windows Phone] 导览控制项(Navigation controls)

[Windows Phone] 导览控制项(Navigation controls)

?

Step3. MainPage.xaml 画面设计

  1. TextBlock-->Text="请输入帐号密码:",FontSize="30",Width="258",Height="41"
  2. TextBlock-->Text="帐号:",FontSize="30",Height="44",Width="98"
  3. TextBox-->Name="AccNo",FontSize="30"
  4. TextBlock-->Text="密码:",FontSize="30"
  5. PasswordBox-->Name="PassWd",FontSize="30"
  6. Button-->Name="btnOk",Content="确定"

?

XAML程式码:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <TextBlock Text="请输入帐号密码:" FontSize="30" Width="258" Height="41" Margin="118,16,80,550" />
            <TextBlock Text="帐号:" FontSize="30" Height="44" Width="98" Margin="10,71,348,492" />
            <TextBox Name="AccNo" FontSize="30" Height="72" Width="268" Margin="108,62,80,473" />
            <TextBlock Text="密码:" FontSize="30" Height="44" Width="98" Margin="10,134,348,415" />
            <PasswordBox Name="PassWd" FontSize="30" Height="72" Width="268" Margin="108,125,80,410" />
            <Button Name="btnOk" Content="确定" Height="72" Width="108" Margin="160,197,188,338" />
        </Grid>

?

Step4. 产生 btnOk 的 Click 事件

?

// 建构函式
        public MainPage()
        {
            InitializeComponent();
            ////产生 btnOk 的 click 事件,在 += 後按 Tab 2 次
            btnOk.Click += btnOk_Click;
        }

?

Step5. btnOk 事件内容

?

void btnOk_Click(object sender, RoutedEventArgs e)
        {
            //当按下按钮btnOk的时候浏览Page1.xaml页面,用NavigationService来取得浏览页面的服务
            //Navigate()方法是转跳浏览页面的位置
            NavigationService.Navigate(new Uri("/Page1.xaml", UriKind.Relative));
        }

?

Step6. Page1.xaml 画面设计

  1. TextBlock-->Text="欢迎进入WIN PHONE 8 的世界"
  2. Button-->Name="btnBack",Content="返回"

XAML程式码:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <TextBlock Text="欢迎进入WIN PHONE 8 的世界" FontSize="28" TextWrapping="Wrap" Margin="25,55,25,516" TextAlignment="Center" />
            <Button Name="btnBack" Content="返回" Height="72" Margin="160,197,148,338" />
        </Grid>

?

Step7. 产生 btnBack 的 Click 事件

 public Page1()
        {
            InitializeComponent();
            //产生 btnBack 的 click 事件,在 += 後按 Tab 2 次
            btnBack.Click += btnBack_Click;
        }

?

Step8. btnBack 事件内容

void btnBack_Click(object sender, RoutedEventArgs e)
        {
            //当按下按钮btnBack的时候浏览MainPage.xaml页面
            NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));
            //下面是另一种返回写法
            //NavigationService.GoBack();
        }

?

[相关参考与引用]

Controls for Windows Phone - Navigation controls

?

[范例下载]

导览控制项Navigation controls.rar


[Windows Phone] 导览控制项(Navigation controls)

posted on 2013/11/24 23:07 | 阅读数 : 989 | 2 人推荐 我要推荐 | Add Comment | 文章分类 [ Windows Phone ] | 订阅

上一篇:sizzle分析记录: 自定义伪类选择器


下一篇:手把手教你使用自定义方式选择阿里云服务器ECS(超详细图文)