编程创建 Windows Phone 的全景应用 (Panorama)
jopen
12年前
在这个教程中我们将学习如何创建一个包含动态全景控件的 Windows Phone 7 应用程序。关于什么是全景控件请看本文最后的运行截图。
首先打开 Visual Studip 2010 并创建一个新的 Sliverlight for Windows Phone 7 的项目:
开始编码之前,我们通过添加引用选项来添加 Microsoft.Phone.Controls 的引用,并在 XAML 代码中包含命名空间,并删除 xaml 代码中的默认内容:
现在让我们开始编码。全景空间包含不同的标题和条目:
private ListCreatePanoramaItems(string item) { List Panoramaitems = null; switch (item) { case "Page1": Panoramaitems = new List { "Page1Item1", "Page1Item2", "Page1Item3"}; break; case "Page2": Panoramaitems = new List { "Page2Item1", "Page2Item2", "Page2Item3" }; break; case "Page3": Panoramaitems = new List { "Page3Item1", "Page3Item2", "Page3Item3" }; break; } return Panoramaitems; } private List CreatePanoramaHeaders() { return new List { "Page1", "Page2", "Page3" }; }
接下来是添加装载事件,当页面加载时我们要装载动态的全景控件,并自定义标题和列表项:
private void MainPage_Loaded(object sender, RoutedEventArgs e) { //Initializing the Panorama Control and Assigning base values Panorama panoramactrl = new Panorama(); panoramactrl.Title = "F5Debug How To"; panoramactrl.SelectionChanged += panoramaCtrl_SelectionChanged; //Initializing the Panorama Control Items PanoramaItem panoramaCtrlItem = new PanoramaItem(); panoramaCtrlItem.Header = "Dynamic Panorama"; //Initializing Textblock to display some text TextBlock textBlock = new TextBlock(); textBlock.TextWrapping = TextWrapping.Wrap; textBlock.Text = "F5debug.Net – Building and Debugging the Technology"; textBlock.FontSize = 20; panoramaCtrlItem.Content = textBlock; panoramactrl.Items.Add(panoramaCtrlItem); foreach (string Eachitems in CreatePanoramaHeaders()) { panoramaCtrlItem = new PanoramaItem(); panoramaCtrlItem.Header = Eachitems; panoramactrl.Items.Add(panoramaCtrlItem); } this.LayoutRoot.Children.Add(panoramactrl); } private void panoramaCtrl_SelectionChanged(object sender, SelectionChangedEventArgs e) { Panorama panoramactrl = (Panorama)sender; PanoramaItem panoramaItem = (PanoramaItem)(panoramactrl.SelectedItem); if (panoramaItem.Content == null) { ListBox listBox = new ListBox(); listBox.ItemsSource = CreatePanoramaItems(panoramaItem.Header.ToString()); panoramaItem.Content = listBox; } }
完整代码列表:
using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Windows; using System.Windows.Controls; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Animation; using System.Windows.Shapes; using Microsoft.Phone.Controls; namespace F5debugHowto43 { public partial class MainPage : PhoneApplicationPage { // Constructor public MainPage() { InitializeComponent(); this.Loaded += new RoutedEventHandler(MainPage_Loaded); } private ListCreatePanoramaItems(string item) { List Panoramaitems = null; switch (item) { case "Page1": Panoramaitems = new List { "Page1Item1", "Page1Item2", "Page1Item3"}; break; case "Page2": Panoramaitems = new List { "Page2Item1", "Page2Item2", "Page2Item3" }; break; case "Page3": Panoramaitems = new List { "Page3Item1", "Page3Item2", "Page3Item3" }; break; } return Panoramaitems; } private List CreatePanoramaHeaders() { return new List { "Page1", "Page2", "Page3" }; } private void MainPage_Loaded(object sender, RoutedEventArgs e) { //Initializing the Panorama Control and Assigning base values Panorama panoramactrl = new Panorama(); panoramactrl.Title = "F5Debug How To"; panoramactrl.SelectionChanged += panoramaCtrl_SelectionChanged; //Initializing the Panorama Control Items PanoramaItem panoramaCtrlItem = new PanoramaItem(); panoramaCtrlItem.Header = "Dynamic Panorama"; //Initializing Textblock to display some text TextBlock textBlock = new TextBlock(); textBlock.TextWrapping = TextWrapping.Wrap; textBlock.Text = "F5debug.Net – Building and Debugging the Technology"; textBlock.FontSize = 20; panoramaCtrlItem.Content = textBlock; panoramactrl.Items.Add(panoramaCtrlItem); foreach (string Eachitems in CreatePanoramaHeaders()) { panoramaCtrlItem = new PanoramaItem(); panoramaCtrlItem.Header = Eachitems; panoramactrl.Items.Add(panoramaCtrlItem); } this.LayoutRoot.Children.Add(panoramactrl); } private void panoramaCtrl_SelectionChanged(object sender, SelectionChangedEventArgs e) { Panorama panoramactrl = (Panorama)sender; PanoramaItem panoramaItem = (PanoramaItem)(panoramactrl.SelectedItem); if (panoramaItem.Content == null) { ListBox listBox = new ListBox(); listBox.ItemsSource = CreatePanoramaItems(panoramaItem.Header.ToString()); panoramaItem.Content = listBox; } } } }
现在我们已经完成了所有的编码工作,按 F5 直接运行看看效果,如果编译成功的话会打开 Windows Phone 模拟器,然后你可以看到如下运行结果:
Output Screen:
在这个教程中,我们学习如何编程加载动态的全景控件以及自定义标题和列表项。
Happy Programming!!!
英文原文,OSCHINA原创翻译