×
Namespaces

Variants
Actions

Windows phone7上的URI映射

From Nokia Developer Wiki
Jump to: navigation, search
SignpostIcon XAML 40.png
SignpostIcon WP7 70px.png
Article Metadata

代码示例
兼容于
文章
翻译:
最后由 hamishwillee 在 18 Jul 2013 编辑


Contents

简介

UriMapping用于在一个较短的URI和你项目中的xaml页的完整路径定义一个映射(别名)。通过使用别名URI,开发者可以在不改变导航代码的情况下来改变一个项目的内部结构,或者打破UI部件的任何外部链接(例如toast notifications)。该机制还提供了一个简单的方法以参数在页面之间传递数据,并导航到使用参数动态创建的页面。

此代码示例演示如何在URI映射的页面之间导航,以及如何传递参数到一个新打开的页面。

Code example main view

在代码中URI映射

在这个代码示例中我们创建了3个xaml页:Facebook.xaml, PramValues.xaml, Twitter.xaml, 它们都存储在一个单一的“UI” 如下所示的目录中:

1.png

下列步骤展示如何在URI和这些当按钮被点击时加载的网页之间创建映射。

步骤1:在App.xaml.cs中创建UriMapper类的一个实例,并在Application对象的构造函数中添加URI映射项目。现在,添加UriMapper对象到PhoneApplicationFrame对象的RootFrame的属性UriMapper。看到下面的代码片段。

代码片断:

public App()
{
// Global handler for uncaught exceptions.
UnhandledException += Application_UnhandledException;
// Standard Silverlight initialization
InitializeComponent();
// Phone-specific initialization
InitializePhoneApplication();
 
// URI Mapping
var appNavigationMapper = new UriMapper();
appNavigationMapper.UriMappings.Add(CreateUriMapping("Facebook", "/UIs/Facebook.xaml"));
appNavigationMapper.UriMappings.Add(CreateUriMapping("Twitter", "/UIs/Twitter.xaml"));
appNavigationMapper.UriMappings.Add(CreateUriMapping("About/{value}/{value1}", "/UIs/PramValues.xaml?id={value}&name={value1}"));
 
RootFrame.UriMapper = appNavigationMapper;
 
// Show graphics profiling information while debugging.
if (System.Diagnostics.Debugger.IsAttached)
{
// Display the current frame rate counters.
Application.Current.Host.Settings.EnableFrameRateCounter = true;
 
// Show the areas of the app that are being redrawn in each frame.
//Application.Current.Host.Settings.EnableRedrawRegions = true;
 
// Enable non-production analysis visualization mode,
// which shows areas of a page that are handed off to GPU with a colored overlay.
//Application.Current.Host.Settings.EnableCacheVisualization = true;
 
// Disable the application idle detection by setting the UserIdleDetectionMode property of the
// application's PhoneApplicationService object to Disabled.
// Caution:- Use this under debug mode only. Application that disables user idle detection will continue to run
// and consume battery power when the user is not using the phone.
PhoneApplicationService.Current.UserIdleDetectionMode = IdleDetectionMode.Disabled;
}
}

步骤2:现在,为了特定访问的UI我们正在使用UriMapping机制开发UI(用户界面)。在这个示例中,我们添加三个按钮,对于Twitter,Facebook和Param(s)对应的命令按钮,它们调用具体的UI。这里是用户界面设计的XAML代码。

    <Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
 
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="Uri Mapper" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
 
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Button Content="Twitter" Height="72" HorizontalAlignment="Left" Margin="40,68,0,0" Name="button1" VerticalAlignment="Top" Width="160" Click="button1_Click" Background="#FFEB3636"></Button>
<Button Content="Facebook" Height="72" HorizontalAlignment="Left" Margin="240,209,0,0" Name="button2" VerticalAlignment="Top" Width="160" Click="button2_Click" Background="#FFEB3636"></Button>
<Button Content="Param(s)" Height="72" HorizontalAlignment="Left" Margin="42,365,0,0" Name="button3" VerticalAlignment="Top" Width="160" Click="button3_Click" Background="#FFEB3636" />
</Grid>
</Grid>


步骤3:最后,我们将使用NavigationService.Navigate()方法调用URI映射。在这个例子中,我们创建了一个泛型方法用于像在在App类构造时提到的那样,通过UriMapping特定的别名调用调用特定的UI。见下面的代码片段。

        private void button1_Click(object sender, RoutedEventArgs e)
{
DoNavigate("Twitter");
}
 
private void button2_Click(object sender, RoutedEventArgs e)
{
DoNavigate("Facebook");
}
 
private void button3_Click(object sender, RoutedEventArgs e)
{
DoNavigate("About/2/pavan"); // With two parameters
}
 
private void DoNavigate(string NavigatePageName)
{
this.NavigationService.Navigate(new Uri(NavigatePageName, UriKind.Relative));
}


步骤4:按F5执行应用程序。

如何在导航页得到查询字符串值

有时你想将参数传递给页面本身(而不只是基于参数的选择页面)。这时可以使用NavigationContext检索特定值作为参数传递。

        void PramValues_Loaded(object sender, RoutedEventArgs e)
{
// Method 1: Get individual parameters
textBlock1.Text = string.Format("Id= {0}", NavigationContext.QueryString["id"]);
textBlock2.Text = string.Format("Name= {0}", NavigationContext.QueryString["name"]);
 
// Method 2: Write all parameters to an array
var values = NavigationContext.QueryString.ToArray();
 
foreach (var item in values)
{
System.Diagnostics.Debug.WriteLine("Key : " + item.Key + " " + "Value : " + item.Value);
}
}

使用XAML来映射URI

这部分展示如何通过xaml而不是代码来创建URI映射。

步骤1:到App.xaml文件中添加以下命名空间。xmlns:appnavigation="clr-namespace:System.Windows.Navigation;assembly=Microsoft.Phone"

步骤2:添加xaml代码到<Application.Resources>标签。在xaml代码中你可以看到如何用页面传参实现映射。

<Application.Resources> 
<appnavigation:UriMapper x:Key="UriMapper">
<appnavigation:UriMapper.UriMappings>
<appnavigation:UriMapping Uri="/Facebook" MappedUri="/Uis/Page1.xaml" />
<appnavigation:UriMapping Uri="/Twitter/" MappedUri="/Uis/Twitter.xaml" />
<appnavigation:UriMapping Uri="/About/{value1}/{value2}" MappedUri="/Uis/About.xaml?id={id}&name={value1}" />
</appnavigation:UriMapper.UriMappings>
</appnavigation:UriMapper>
</Application.Resources>

如果你想链接一堆页面,而无需单独引用它们(他们可以是动态创建的),你可以通过指定在XAML的URI定义的参数。例如,我们可以通过参数“{number}”链接到Page1.xaml,Page2.xaml中和page3.xaml,如下所示:

<Application.Resources>
<appnavigation:UriMapper x:Key="UriMapper">
<appnavigation:UriMapper.UriMappings>
<appnavigation:UriMapping Uri="/AppPage/{number}" MappedUri="/Page{number}.xaml" />
</appnavigation:UriMapper.UriMappings>
</appnavigation:UriMapper>
</Application.Resources>

步骤3:最后在InitializePhoneApplication()后立即添加UriMapper资源到应用程序RootFrame.UriMapper后台的App.xaml文件。

RootFrame.UriMapper = Resources["UriMapper"] as UriMapper;

下载示例源代码:

File:WP UriMapping.zip

总结

Urimapping在windows phone7(mango)中是一个非常新的机制。它帮助开发人员无需更改代码来重构。

This page was last modified on 18 July 2013, at 05:11.
119 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×