|
1.只有切換頁(yè)面
2.加上頁(yè)面?zhèn)髦档墓δ?/span> 第一部份：切換頁(yè)面 同樣的先建立一個(gè)新的Silverlight專案
分別建立兩個(gè)User Control,，並且名命為PageSwitcher,、Page2
建立完成的結(jié)果
接著修改PageSwitcher.xaml.cs
然後現(xiàn)在要做第一頁(yè)設(shè)計(jì)頁(yè)的部分(Page.xaml)
<UserControl x:Class="SilverlightApplication2.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300"> <Grid x:Name="LayoutRoot" Background="White"> <StackPanel VerticalAlignment="Center"> <TextBlock FontSize="50" Text="這是第一頁(yè)" HorizontalAlignment="Center" /> <Button x:Name="GotoPage2" FontSize="30" Width="300" Content="我想去第二頁(yè)"></Button> </StackPanel> </Grid> </UserControl> 而Page.xaml.cs程式碼如下  public partial class Page : UserControl { public Page() { InitializeComponent(); GotoPage2.Click += new RoutedEventHandler(GotoPage2_Click); } //當(dāng)按下"我想去第二頁(yè)" void GotoPage2_Click(object sender, RoutedEventArgs e) { //建立樹(shù)狀結(jié)構(gòu)中的父物件 PageSwitcher ps = this.Parent as PageSwitcher; //將UI置換成Page2 ps.Navigate(new Page2()); } }然後是第二頁(yè)P(yáng)age2的部份,，基本上跟第一頁(yè)是一樣的
Page2.xaml <UserControl x:Class="SilverlightApplication2.Page2"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300"> <Grid x:Name="LayoutRoot" Background="White"> <StackPanel VerticalAlignment="Center"> <TextBlock FontSize="50" Text="這是第二頁(yè)" HorizontalAlignment="Center" /> <Button x:Name="GotoPage1" FontSize="30" Width="300" Content="我要回第一頁(yè)"></Button> </StackPanel> </Grid> </UserControl> Page2.xaml.cs public partial class Page2 : UserControl { public Page2() { InitializeComponent(); GotoPage1.Click += new RoutedEventHandler(GotoPage1_Click); } //按下按鈕回第一頁(yè) void GotoPage1_Click(object sender, RoutedEventArgs e) { PageSwitcher ps = this.Parent as PageSwitcher; ps.Navigate(new Page()); } }最後把App.xaml.cs修改一下 public App() { this.Startup += this.Application_Startup; this.Exit += this.Application_Exit; this.UnhandledException += this.Application_UnhandledException;InitializeComponent(); }private void Application_Startup(object sender, StartupEventArgs e) { //只有修改這一段,，主要應(yīng)用程式UI改為PageSwitcher this.RootVisual = new PageSwitcher(); }private void Application_Exit(object sender, EventArgs e) { }這樣第一階段就完成了 第二部份：加入頁(yè)面?zhèn)髦倒δ?/strong> 雖然上面已做完換頁(yè)動(dòng)作,，但很多情況必須傳遞參數(shù)才能達(dá)到你要的目的，但是相對(duì)來(lái)說(shuō)就比較麻煩一點(diǎn)了 建立一個(gè)新的Class,，命名為Switcher.cs,、ISwitchable.cs
Switcher.cs public static class Switcher { public static PageSwitcher pageSwitcher;//只要切換頁(yè)面但不傳值 public static void Switch(UserControl newPage) { pageSwitcher.Navigate(newPage); } //切換頁(yè)面並且傳值 public static void Switch(UserControl newPage, object state) { pageSwitcher.Navigate(newPage, state); } }ISwitchable.cs ：這主要是要建立一個(gè)interface來(lái)共用並且傳值 在 namespace 裡有這段code就可以 public interface ISwitchable { void UtilizeState(object state); }再修改PageSwitcher.xml.cs public partial class PageSwitcher : UserControl { public PageSwitcher() { InitializeComponent(); } //這裡是處理切換到下一頁(yè)的方法 public void Navigate(UserControl nextPage) { this.Content = nextPage; } //這是有傳值的 public void Navigate(UserControl nextPage, object state) { this.Content = nextPage; //借由ISwitchable傳值 ISwitchable s = nextPage as ISwitchable; s.UtilizeState(state); } }回去改第一頁(yè)的版面Page.xaml
<UserControl x:Class="SilverlightApplication2.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300"> <Grid x:Name="LayoutRoot" Background="White"> <StackPanel VerticalAlignment="Center"> <TextBlock FontSize="50" Text="這是第一頁(yè)" HorizontalAlignment="Center" /> <TextBlock FontSize="30" Text="你的名字：" Foreground="Blue"HorizontalAlignment="Center" /> <TextBox FontSize="30" Width="300" x:Name="YourName"></TextBox> <Button x:Name="GotoPage2" Margin="20" FontSize="30" Width="300"Content="我想去第二頁(yè)"></Button> </StackPanel> </Grid> </UserControl> Page.xaml.cs public partial class Page : UserControl { public Page() { InitializeComponent(); GotoPage2.Click += new RoutedEventHandler(GotoPage2_Click); } //當(dāng)按下"我想去第二頁(yè)" void GotoPage2_Click(object sender, RoutedEventArgs e) { Switcher.Switch(new Page2(), YourName.Text);//這裡會(huì)加上要傳的值 } }第二頁(yè)的版面Page2.xaml
<UserControl x:Class="SilverlightApplication2.Page2"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300"> <Grid x:Name="LayoutRoot" Background="White"> <StackPanel VerticalAlignment="Center"> <TextBlock FontSize="50" Text="這是第二頁(yè)" HorizontalAlignment="Center" /> <TextBlock FontSize="30" Text="我的名字是：" Foreground="Red"HorizontalAlignment="Center" /> <TextBlock FontSize="30" x:Name="MyName" Foreground="Blue" HorizontalAlignment="Center" /> <Button x:Name="GotoPage1" Margin="20" FontSize="30" Width="300"Content="我要回第一頁(yè)"></Button> </StackPanel> </Grid> </UserControl>
Page2.xaml.cs public partial class Page2 : UserControl, ISwitchable //要記得加上interface 才能繼承 { public Page2() { InitializeComponent(); GotoPage1.Click += new RoutedEventHandler(GotoPage1_Click); } //按下按鈕回第一頁(yè) void GotoPage1_Click(object sender, RoutedEventArgs e) { Switcher.Switch(new Page()); } //這一段很重要,，在繼承interface時(shí)要再實(shí)做出來(lái) public void UtilizeState(object state) { MyName.Text = state as string; } }最後也是去修改 App.xaml.cs public App() { this.Startup += this.Application_Startup; this.Exit += this.Application_Exit; this.UnhandledException += this.Application_UnhandledException;InitializeComponent(); }private void Application_Startup(object sender, StartupEventArgs e) { PageSwitcher pageSwitcher = new PageSwitcher(); //主要應(yīng)用程式UI為PageSwitcher this.RootVisual = pageSwitcher; //把PageSwitcher傳給Switcher,，並交由它切換頁(yè)面 Switcher.pageSwitcher = pageSwitcher; Switcher.Switch(new Page()); }private void Application_Exit(object sender, EventArgs e) { }
可以把PageSwitcher.xaml.cs再修改以方便除錯(cuò) public void Navigate(UserControl nextPage, object state) { this.Content = nextPage; //借由ISwitchable傳值 ISwitchable s = nextPage as ISwitchable; if (s != null) { s.UtilizeState(state); } else { throw new ArgumentException("不具有傳遞值的頁(yè)面" + nextPage.Name.ToString()); } }分類: Silverlight
|
|
|
