如何 link 外部 Xaml 页面到通用 Windows 平台中的网格？
How to link external Xaml page to a Grid in Universal Windows Platform?
我想 link 一个外部 .xaml 文件到我的通用 Windows 平台应用程序的网格中。
这是文件夹结构：
我想 link ListView.xaml 进入在 MainPage.xaml
内声明的网格
两个文件的代码：
MainPage.xaml:
<Page
x:Class="TodoGrocery.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TodoGrocery"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid x:Name="gridView" Grid.Row="0" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Top" Height="40" Background="#3A5194">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" BorderThickness="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="Back" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
<TextBlock x:Name="title" Grid.Column="1" HorizontalAlignment="Center" FontSize="20" VerticalAlignment="Center" Foreground="White" Text="Todo Grocery"></TextBlock>
<Button x:Name="moreButton" BorderThickness="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="More" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
</Grid>
<Grid Grid.Row="1">
<Page><!-- Link ListView.xaml Here--></Page>
</Grid>
</Grid>
</Page>
ListView.xaml
<Page
x:Class="TodoGrocery.ListView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TodoGrocery"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid Background="White" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
<RowDefinition Height="40"/>
</Grid.RowDefinitions>
<Grid x:Name="listHeader" Grid.Row="0" BorderBrush="#d0d0d0" BorderThickness="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="40"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="40"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<CheckBox Grid.Column="0" IsChecked="True"></CheckBox>
<TextBlock Grid.Column="1" Text="Name" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10,9,0,9"></TextBlock>
</Grid>
<Button Grid.Column="1">
<SymbolIcon Symbol="Sort"/>
</Button>
<TextBlock Grid.Column="2" Text="Quantity" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,20,0"></TextBlock>
</Grid>
<Grid x:Name="ListPanel" Grid.Row="1"></Grid>
<Grid x:Name="ButtonPanel" Grid.Row="2" Background="#3A5194">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<Button x:Name="deleteAllButton" BorderThickness="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Foreground="White" Background="Transparent">
<!--<SymbolIcon Symbol="Delete" Foreground="White"/>-->
<StackPanel Orientation="Horizontal" Height="30">
<SymbolIcon Symbol="Delete" Foreground="White"/>
<TextBlock VerticalAlignment="Center" Foreground="White" Margin="10,0,0,0">Delete All</TextBlock>
</StackPanel>
</Button>
<Button x:Name="addButton" Grid.Column="1" BorderThickness="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Foreground="White" Background="Transparent">
<!--<SymbolIcon Symbol="Delete" Foreground="White"/>-->
<StackPanel Orientation="Horizontal" Height="30" Width="100">
<SymbolIcon Symbol="Add" Foreground="white"/>
<TextBlock VerticalAlignment="Top" Foreground="White" HorizontalAlignment="Right" Margin="15,5,0,0">Add</TextBlock>
</StackPanel>
</Button>
</Grid>
</Grid>
</Page>
这就是我打算用我的应用程序做的事情：
我将拥有不同的外部页面，如 ListView.xaml，每当用户单击 link 或选项卡时，页面 linked 的部分应随页面一起更改已被要求。
谢谢。任何其他想法也表示赞赏。
要将一个页面包含在另一个页面中，请使用 Frame 对象：
<Grid Grid.Row="1">
<Frame x:Name="MainFrame"></Frame>
</Grid>
然后，要在框架内加载页面，只需调用 Navigate 方法：
this.MainFrame.Navigate(typeof(TodoGrocery.ListView));
正如 Kory 所说，您可以阅读 Windows 10 个应用程序的操作指南中的 Navigation 章节，了解如何在 UWP 中做您想做的事。
这里的重点是使用Frame and Frame.Navigate方法。该框架托管页面并保留导航历史记录。
You create as many different page types as needed to present the content in your app, and then navigate to those pages by calling the Navigate method and passing in the type of the page to navigate to. You can also pass in a parameter object to initialize the page to a particular state.
因此您可以将 MainPage.xaml 更改为 link ListView.xaml:
<Page x:Class="TodoGrocery.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:TodoGrocery"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid x:Name="gridView" Grid.Row="0" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Top" Height="40" Background="#3A5194">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" BorderThickness="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="Back" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
<TextBlock x:Name="title" Grid.Column="1" HorizontalAlignment="Center" FontSize="20" VerticalAlignment="Center" Foreground="White" Text="Todo Grocery"></TextBlock>
<Button x:Name="moreButton" BorderThickness="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="More" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
</Grid>
<Grid Grid.Row="1">
<Frame x:Name="MyFrame">
<local:ListView />
</Frame>
</Grid>
</Grid>
</Page>
或者在网格中添加一个Frame：
<Grid Grid.Row="1">
<Frame x:Name="MyFrame" />
</Grid>
并且在代码隐藏中，使用
MyFrame.Navigate(typeof(TodoGrocery.ListView));
我想 link 一个外部 .xaml 文件到我的通用 Windows 平台应用程序的网格中。
这是文件夹结构：
我想 link ListView.xaml 进入在 MainPage.xaml
内声明的网格两个文件的代码：
MainPage.xaml:
<Page
x:Class="TodoGrocery.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TodoGrocery"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid x:Name="gridView" Grid.Row="0" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Top" Height="40" Background="#3A5194">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" BorderThickness="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="Back" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
<TextBlock x:Name="title" Grid.Column="1" HorizontalAlignment="Center" FontSize="20" VerticalAlignment="Center" Foreground="White" Text="Todo Grocery"></TextBlock>
<Button x:Name="moreButton" BorderThickness="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="More" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
</Grid>
<Grid Grid.Row="1">
<Page><!-- Link ListView.xaml Here--></Page>
</Grid>
</Grid>
</Page>
ListView.xaml
<Page
x:Class="TodoGrocery.ListView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TodoGrocery"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid Background="White" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
<RowDefinition Height="40"/>
</Grid.RowDefinitions>
<Grid x:Name="listHeader" Grid.Row="0" BorderBrush="#d0d0d0" BorderThickness="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="40"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="40"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<CheckBox Grid.Column="0" IsChecked="True"></CheckBox>
<TextBlock Grid.Column="1" Text="Name" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10,9,0,9"></TextBlock>
</Grid>
<Button Grid.Column="1">
<SymbolIcon Symbol="Sort"/>
</Button>
<TextBlock Grid.Column="2" Text="Quantity" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="0,0,20,0"></TextBlock>
</Grid>
<Grid x:Name="ListPanel" Grid.Row="1"></Grid>
<Grid x:Name="ButtonPanel" Grid.Row="2" Background="#3A5194">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<Button x:Name="deleteAllButton" BorderThickness="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Foreground="White" Background="Transparent">
<!--<SymbolIcon Symbol="Delete" Foreground="White"/>-->
<StackPanel Orientation="Horizontal" Height="30">
<SymbolIcon Symbol="Delete" Foreground="White"/>
<TextBlock VerticalAlignment="Center" Foreground="White" Margin="10,0,0,0">Delete All</TextBlock>
</StackPanel>
</Button>
<Button x:Name="addButton" Grid.Column="1" BorderThickness="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Foreground="White" Background="Transparent">
<!--<SymbolIcon Symbol="Delete" Foreground="White"/>-->
<StackPanel Orientation="Horizontal" Height="30" Width="100">
<SymbolIcon Symbol="Add" Foreground="white"/>
<TextBlock VerticalAlignment="Top" Foreground="White" HorizontalAlignment="Right" Margin="15,5,0,0">Add</TextBlock>
</StackPanel>
</Button>
</Grid>
</Grid>
</Page>
这就是我打算用我的应用程序做的事情：
我将拥有不同的外部页面，如 ListView.xaml，每当用户单击 link 或选项卡时，页面 linked 的部分应随页面一起更改已被要求。
谢谢。任何其他想法也表示赞赏。
要将一个页面包含在另一个页面中，请使用 Frame 对象：
<Grid Grid.Row="1">
<Frame x:Name="MainFrame"></Frame>
</Grid>
然后，要在框架内加载页面，只需调用 Navigate 方法：
this.MainFrame.Navigate(typeof(TodoGrocery.ListView));
正如 Kory 所说，您可以阅读 Windows 10 个应用程序的操作指南中的 Navigation 章节，了解如何在 UWP 中做您想做的事。
这里的重点是使用Frame and Frame.Navigate方法。该框架托管页面并保留导航历史记录。
You create as many different page types as needed to present the content in your app, and then navigate to those pages by calling the Navigate method and passing in the type of the page to navigate to. You can also pass in a parameter object to initialize the page to a particular state.
因此您可以将 MainPage.xaml 更改为 link ListView.xaml:
<Page x:Class="TodoGrocery.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:TodoGrocery"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid x:Name="gridView" Grid.Row="0" HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Top" Height="40" Background="#3A5194">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="50"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" BorderThickness="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="Back" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
<TextBlock x:Name="title" Grid.Column="1" HorizontalAlignment="Center" FontSize="20" VerticalAlignment="Center" Foreground="White" Text="Todo Grocery"></TextBlock>
<Button x:Name="moreButton" BorderThickness="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
<SymbolIcon Symbol="More" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
</Button>
</Grid>
<Grid Grid.Row="1">
<Frame x:Name="MyFrame">
<local:ListView />
</Frame>
</Grid>
</Grid>
</Page>
或者在网格中添加一个Frame：
<Grid Grid.Row="1">
<Frame x:Name="MyFrame" />
</Grid>
并且在代码隐藏中，使用
MyFrame.Navigate(typeof(TodoGrocery.ListView));