×
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 08:11.
155 page views in the last 30 days.