语义缩放 - 点击项目导航到特定页面
Semantic zoom - tap item to navigate to specific page
如何让我的应用程序根据语义缩放中被点击的项目导航到特定页面？每个项目都有一个 link 到它自己的页面，我想使用 'item.Link' 元素，以便应用程序读取 link 并使用它导航到指定页面。
MetropolitanDataSource.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Exits_Expert_London_Lite
{
using System;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Media;
// To significantly reduce the sample data footprint in your production application, you can set
// the DISABLE_SAMPLE_DATA conditional compilation constant and disable sample data at runtime.
#if DISABLE_SAMPLE_DATA
internal class SampleDataSource { }
#else
public class Item : System.ComponentModel.INotifyPropertyChanged
{
public event System.ComponentModel.PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs(propertyName));
}
}
private string _Station = string.Empty;
public string Station
{
get
{
return this._Station;
}
set
{
if (this._Station != value)
{
this._Station = value;
this.OnPropertyChanged("Station");
}
}
}
private string _Zone = string.Empty;
public string Zone
{
get
{
return this._Zone;
}
set
{
if (this._Zone != value)
{
this._Zone = value;
this.OnPropertyChanged("Zone");
}
}
}
private string _Link = string.Empty;
public string Link
{
get
{
return this._Link;
}
set
{
if (this._Link != value)
{
this._Link = value;
this.OnPropertyChanged("Link");
}
}
}
}
public class GroupInfoList<T> : List<object>
{
public object Key { get; set; }
public new IEnumerator<object> GetEnumerator()
{
return (System.Collections.Generic.IEnumerator<object>)base.GetEnumerator();
}
}
public class StoreData
{
public StoreData()
{
Item item;
item = new Item();
item.Station = "Amersham";
item.Zone = "Fare zone 9";
item.Link = "/Lines and Stations/Metropolitan/AMR_(Metropolitan).xaml";
Collection.Add(item);
item = new Item();
item.Station = "Chalfont & Latimer";
item.Zone = "Fare zone 8";
item.Link = "/Lines and Stations/Metropolitan/CFO_(Metropolitan).xaml";
Collection.Add(item);
item = new Item();
item.Station = "Chesham";
item.Zone = "Fare zone 9";
item.Link = "/Lines and Stations/Metropolitan/Chesham.xaml";
Collection.Add(item);
}
private ItemCollection _Collection = new ItemCollection();
public ItemCollection Collection
{
get
{
return this._Collection;
}
}
internal List<GroupInfoList<object>> GetGroupsByCategory()
{
List<GroupInfoList<object>> groups = new List<GroupInfoList<object>>();
var query = from item in Collection
orderby ((Item)item).Zone
group item by ((Item)item).Zone into g
select new { GroupName = g.Key, Items = g };
foreach (var g in query)
{
GroupInfoList<object> info = new GroupInfoList<object>();
info.Key = g.GroupName;
foreach (var item in g.Items)
{
info.Add(item);
}
groups.Add(info);
}
return groups;
}
internal List<GroupInfoList<object>> GetGroupsByLetter()
{
List<GroupInfoList<object>> groups = new List<GroupInfoList<object>>();
var query = from item in Collection
orderby ((Item)item).Station
group item by ((Item)item).Station[0] into g
select new { GroupName = g.Key, Items = g };
foreach (var g in query)
{
GroupInfoList<object> info = new GroupInfoList<object>();
info.Key = g.GroupName;
foreach (var item in g.Items)
{
info.Add(item);
}
groups.Add(info);
}
return groups;
}
}
// Workaround: data binding works best with an enumeration of objects that does not implement IList
public class ItemCollection : IEnumerable<Object>
{
private System.Collections.ObjectModel.ObservableCollection<Item> itemCollection = new System.Collections.ObjectModel.ObservableCollection<Item>();
public IEnumerator<Object> GetEnumerator()
{
return itemCollection.GetEnumerator();
}
System.Collections.IEnumerator System.Collections.IEnumerable.GetEnumerator()
{
return GetEnumerator();
}
public void Add(Item item)
{
itemCollection.Add(item);
}
}
#endif
}
Metropolitan_line.xaml.cs
using Exits_Expert_London_Lite.Common;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
// The Basic Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234237
namespace Exits_Expert_London_Lite.Lines_and_Stations.Metropolitan
{
public sealed partial class Metropolitan_line : Page
{
public Metropolitan_line()
{
this.InitializeComponent();
StoreData _storeData = null;
// creates a new instance of the sample data
_storeData = new StoreData();
// sets the list of categories to the groups from the sample data
List<GroupInfoList<object>> dataLetter = _storeData.GetGroupsByLetter();
// sets the CollectionViewSource in the XAML page resources to the data groups
cvsMetropolitan.Source = dataLetter;
// sets the items source for the zoomed out view to the group data as well
(semanticZoom.ZoomedOutView as ListViewBase).ItemsSource = cvsMetropolitan.View.CollectionGroups;
(semanticZoom.ZoomedInView as ListViewBase).SelectedIndex = -1;
}
#region Data Visualization
void ItemsGridView_ContainerContentChanging(ListViewBase sender, ContainerContentChangingEventArgs args)
{
ItemViewer iv = args.ItemContainer.ContentTemplateRoot as ItemViewer;
if (args.InRecycleQueue == true)
{
iv.ClearData();
}
else if (args.Phase == 0)
{
iv.ShowPlaceholder(args.Item as Item);
args.RegisterUpdateCallback(ContainerContentChangingDelegate);
}
else if (args.Phase == 1)
{
iv.ShowStation();
args.RegisterUpdateCallback(ContainerContentChangingDelegate);
}
else if (args.Phase == 2)
{
iv.ShowZone();
}
args.Handled = true;
}
private TypedEventHandler<ListViewBase, ContainerContentChangingEventArgs> ContainerContentChangingDelegate
{
get
{
if (_delegate == null)
{
_delegate = new TypedEventHandler<ListViewBase, ContainerContentChangingEventArgs>(ItemsGridView_ContainerContentChanging);
}
return _delegate;
}
}
private TypedEventHandler<ListViewBase, ContainerContentChangingEventArgs> _delegate;
#endregion //Data Visualization
private void backButton_Tapped(object sender, TappedRoutedEventArgs e)
{
this.Frame.Navigate(typeof(Station_Chooser));
}
void GridView_ItemClicked(object sender, ItemClickEventArgs args)
{
var item = (Item)args.ClickedItem;
if (item.Link == "/Lines and Stations/Metropolitan/AMR_(Metropolitan).xaml")
((Frame)Window.Current.Content).Navigate(typeof(AMR__Metropolitan_));
else if (item.Link == "/Lines and Stations/Metropolitan/CFO_(Metropolitan).xaml")
((Frame)Window.Current.Content).Navigate(typeof(CFO__Metropolitan_));
else if (item.Link == "/Lines and Stations/Metropolitan/Chesham.xaml")
((Frame)Window.Current.Content).Navigate(typeof(Chesham));
}
}
}
ItemViewer.xaml
<UserControl
x:Class="Exits_Expert_London_Lite.ItemViewer"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Exits_Expert_London_Lite"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Margin="0,0,0,20" HorizontalAlignment="Left">
<StackPanel>
<StackPanel Margin="10,0,0,0" Width="420">
<TextBlock x:Name="stationTextBlock" Foreground="{StaticResource ApplicationForegroundThemeBrush}" VerticalAlignment="Center" HorizontalAlignment="Left" FontFamily="Segoe UI" FontSize="32" FontWeight="Light" />
<TextBlock x:Name="zoneTextBlock" TextWrapping="Wrap" Foreground="White" FontSize="20" FontWeight="Light" VerticalAlignment="Center" HorizontalAlignment="Left"/>
</StackPanel>
</StackPanel>
</Grid>
</UserControl>
Metropolitan_line.xaml
<Page
x:Class="Exits_Expert_London_Lite.Lines_and_Stations.Metropolitan.Metropolitan_line"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Exits_Expert_London_Lite"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Page.Resources>
<CollectionViewSource x:Name="cvsMetropolitan" IsSourceGrouped="true" />
</Page.Resources>
<Grid Background="Black">
<Grid.ChildrenTransitions>
<TransitionCollection>
<EntranceThemeTransition/>
</TransitionCollection>
</Grid.ChildrenTransitions>
<Grid.RowDefinitions>
<RowDefinition Height="140"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" Margin="39,59,39,0"
Style="{StaticResource NavigationBackButtonNormalStyle}"
VerticalAlignment="Top"
AutomationProperties.Name="Back"
AutomationProperties.AutomationId="BackButton"
AutomationProperties.ItemType="Navigation Button" Tapped="backButton_Tapped"/>
<TextBlock x:Name="pageTitle" Text="Metropolitan line" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1"
IsHitTestVisible="false" TextWrapping="NoWrap" VerticalAlignment="Bottom" Margin="0,0,30,40" Foreground="#FF9B0056"/>
</Grid>
<Grid x:Name="Output" Grid.Row="1">
<!-- This shows a hard-coded width to show within the SDK Sample framework. In a real application you likely wouldn't set a width on the SemanticZoom -->
<SemanticZoom x:Name="semanticZoom" Margin="0,0,0,0">
<SemanticZoom.ZoomedOutView>
<GridView ScrollViewer.IsHorizontalScrollChainingEnabled="False" >
<GridView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Group.Key}" HorizontalAlignment="Center" FontFamily="Segoe UI" FontWeight="Light" FontSize="56" Foreground="White"/>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid ItemWidth="200" ItemHeight="200" MaximumRowsOrColumns="4" VerticalAlignment="Center"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="Margin" Value="4" />
<Setter Property="Padding" Value="10" />
<Setter Property="Background" Value="#9B0056" />
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="VerticalContentAlignment" Value="Center" />
</Style>
</GridView.ItemContainerStyle>
</GridView>
</SemanticZoom.ZoomedOutView>
<SemanticZoom.ZoomedInView>
<GridView x:Name="ItemsGridView"
ItemsSource="{Binding Source={StaticResource cvsMetropolitan}}"
ShowsScrollingPlaceholders="False"
ContainerContentChanging="ItemsGridView_ContainerContentChanging"
IsSwipeEnabled="True" ScrollViewer.IsHorizontalScrollChainingEnabled="False" ItemClick="GridView_ItemClicked">
<GridView.ItemTemplate>
<DataTemplate>
<local:ItemViewer/>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock Text='{Binding Key}' Foreground="#FF9B0056" Margin="5" FontSize="50" FontFamily="Segoe UI" FontWeight="Light" />
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</GridView.GroupStyle>
</GridView>
</SemanticZoom.ZoomedInView>
</SemanticZoom>
</Grid>
</Grid>
</Page>
给你。在您的代码隐藏中...
void GridView_ItemClicked(object sender, ItemClickEventArgs args)
{
var item = (Item)args.ClickedItem;
if (item.Link == "/Page_1.xaml")
((Frame)Window.Current.Content).Navigate(typeof (Page_1));
else if (item.Link == "/Page_2.xaml")
((Frame)Window.Current.Content).Navigate(typeof (Page_2));
else if (item.Link == "/Page_3.xaml")
((Frame)Window.Current.Content).Navigate(typeof (Page_3));
}
祝你好运！
如何让我的应用程序根据语义缩放中被点击的项目导航到特定页面？每个项目都有一个 link 到它自己的页面，我想使用 'item.Link' 元素，以便应用程序读取 link 并使用它导航到指定页面。
MetropolitanDataSource.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Exits_Expert_London_Lite
{
using System;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Media;
// To significantly reduce the sample data footprint in your production application, you can set
// the DISABLE_SAMPLE_DATA conditional compilation constant and disable sample data at runtime.
#if DISABLE_SAMPLE_DATA
internal class SampleDataSource { }
#else
public class Item : System.ComponentModel.INotifyPropertyChanged
{
public event System.ComponentModel.PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs(propertyName));
}
}
private string _Station = string.Empty;
public string Station
{
get
{
return this._Station;
}
set
{
if (this._Station != value)
{
this._Station = value;
this.OnPropertyChanged("Station");
}
}
}
private string _Zone = string.Empty;
public string Zone
{
get
{
return this._Zone;
}
set
{
if (this._Zone != value)
{
this._Zone = value;
this.OnPropertyChanged("Zone");
}
}
}
private string _Link = string.Empty;
public string Link
{
get
{
return this._Link;
}
set
{
if (this._Link != value)
{
this._Link = value;
this.OnPropertyChanged("Link");
}
}
}
}
public class GroupInfoList<T> : List<object>
{
public object Key { get; set; }
public new IEnumerator<object> GetEnumerator()
{
return (System.Collections.Generic.IEnumerator<object>)base.GetEnumerator();
}
}
public class StoreData
{
public StoreData()
{
Item item;
item = new Item();
item.Station = "Amersham";
item.Zone = "Fare zone 9";
item.Link = "/Lines and Stations/Metropolitan/AMR_(Metropolitan).xaml";
Collection.Add(item);
item = new Item();
item.Station = "Chalfont & Latimer";
item.Zone = "Fare zone 8";
item.Link = "/Lines and Stations/Metropolitan/CFO_(Metropolitan).xaml";
Collection.Add(item);
item = new Item();
item.Station = "Chesham";
item.Zone = "Fare zone 9";
item.Link = "/Lines and Stations/Metropolitan/Chesham.xaml";
Collection.Add(item);
}
private ItemCollection _Collection = new ItemCollection();
public ItemCollection Collection
{
get
{
return this._Collection;
}
}
internal List<GroupInfoList<object>> GetGroupsByCategory()
{
List<GroupInfoList<object>> groups = new List<GroupInfoList<object>>();
var query = from item in Collection
orderby ((Item)item).Zone
group item by ((Item)item).Zone into g
select new { GroupName = g.Key, Items = g };
foreach (var g in query)
{
GroupInfoList<object> info = new GroupInfoList<object>();
info.Key = g.GroupName;
foreach (var item in g.Items)
{
info.Add(item);
}
groups.Add(info);
}
return groups;
}
internal List<GroupInfoList<object>> GetGroupsByLetter()
{
List<GroupInfoList<object>> groups = new List<GroupInfoList<object>>();
var query = from item in Collection
orderby ((Item)item).Station
group item by ((Item)item).Station[0] into g
select new { GroupName = g.Key, Items = g };
foreach (var g in query)
{
GroupInfoList<object> info = new GroupInfoList<object>();
info.Key = g.GroupName;
foreach (var item in g.Items)
{
info.Add(item);
}
groups.Add(info);
}
return groups;
}
}
// Workaround: data binding works best with an enumeration of objects that does not implement IList
public class ItemCollection : IEnumerable<Object>
{
private System.Collections.ObjectModel.ObservableCollection<Item> itemCollection = new System.Collections.ObjectModel.ObservableCollection<Item>();
public IEnumerator<Object> GetEnumerator()
{
return itemCollection.GetEnumerator();
}
System.Collections.IEnumerator System.Collections.IEnumerable.GetEnumerator()
{
return GetEnumerator();
}
public void Add(Item item)
{
itemCollection.Add(item);
}
}
#endif
}
Metropolitan_line.xaml.cs
using Exits_Expert_London_Lite.Common;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
// The Basic Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234237
namespace Exits_Expert_London_Lite.Lines_and_Stations.Metropolitan
{
public sealed partial class Metropolitan_line : Page
{
public Metropolitan_line()
{
this.InitializeComponent();
StoreData _storeData = null;
// creates a new instance of the sample data
_storeData = new StoreData();
// sets the list of categories to the groups from the sample data
List<GroupInfoList<object>> dataLetter = _storeData.GetGroupsByLetter();
// sets the CollectionViewSource in the XAML page resources to the data groups
cvsMetropolitan.Source = dataLetter;
// sets the items source for the zoomed out view to the group data as well
(semanticZoom.ZoomedOutView as ListViewBase).ItemsSource = cvsMetropolitan.View.CollectionGroups;
(semanticZoom.ZoomedInView as ListViewBase).SelectedIndex = -1;
}
#region Data Visualization
void ItemsGridView_ContainerContentChanging(ListViewBase sender, ContainerContentChangingEventArgs args)
{
ItemViewer iv = args.ItemContainer.ContentTemplateRoot as ItemViewer;
if (args.InRecycleQueue == true)
{
iv.ClearData();
}
else if (args.Phase == 0)
{
iv.ShowPlaceholder(args.Item as Item);
args.RegisterUpdateCallback(ContainerContentChangingDelegate);
}
else if (args.Phase == 1)
{
iv.ShowStation();
args.RegisterUpdateCallback(ContainerContentChangingDelegate);
}
else if (args.Phase == 2)
{
iv.ShowZone();
}
args.Handled = true;
}
private TypedEventHandler<ListViewBase, ContainerContentChangingEventArgs> ContainerContentChangingDelegate
{
get
{
if (_delegate == null)
{
_delegate = new TypedEventHandler<ListViewBase, ContainerContentChangingEventArgs>(ItemsGridView_ContainerContentChanging);
}
return _delegate;
}
}
private TypedEventHandler<ListViewBase, ContainerContentChangingEventArgs> _delegate;
#endregion //Data Visualization
private void backButton_Tapped(object sender, TappedRoutedEventArgs e)
{
this.Frame.Navigate(typeof(Station_Chooser));
}
void GridView_ItemClicked(object sender, ItemClickEventArgs args)
{
var item = (Item)args.ClickedItem;
if (item.Link == "/Lines and Stations/Metropolitan/AMR_(Metropolitan).xaml")
((Frame)Window.Current.Content).Navigate(typeof(AMR__Metropolitan_));
else if (item.Link == "/Lines and Stations/Metropolitan/CFO_(Metropolitan).xaml")
((Frame)Window.Current.Content).Navigate(typeof(CFO__Metropolitan_));
else if (item.Link == "/Lines and Stations/Metropolitan/Chesham.xaml")
((Frame)Window.Current.Content).Navigate(typeof(Chesham));
}
}
}
ItemViewer.xaml
<UserControl
x:Class="Exits_Expert_London_Lite.ItemViewer"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Exits_Expert_London_Lite"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Margin="0,0,0,20" HorizontalAlignment="Left">
<StackPanel>
<StackPanel Margin="10,0,0,0" Width="420">
<TextBlock x:Name="stationTextBlock" Foreground="{StaticResource ApplicationForegroundThemeBrush}" VerticalAlignment="Center" HorizontalAlignment="Left" FontFamily="Segoe UI" FontSize="32" FontWeight="Light" />
<TextBlock x:Name="zoneTextBlock" TextWrapping="Wrap" Foreground="White" FontSize="20" FontWeight="Light" VerticalAlignment="Center" HorizontalAlignment="Left"/>
</StackPanel>
</StackPanel>
</Grid>
</UserControl>
Metropolitan_line.xaml
<Page
x:Class="Exits_Expert_London_Lite.Lines_and_Stations.Metropolitan.Metropolitan_line"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Exits_Expert_London_Lite"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Page.Resources>
<CollectionViewSource x:Name="cvsMetropolitan" IsSourceGrouped="true" />
</Page.Resources>
<Grid Background="Black">
<Grid.ChildrenTransitions>
<TransitionCollection>
<EntranceThemeTransition/>
</TransitionCollection>
</Grid.ChildrenTransitions>
<Grid.RowDefinitions>
<RowDefinition Height="140"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" Margin="39,59,39,0"
Style="{StaticResource NavigationBackButtonNormalStyle}"
VerticalAlignment="Top"
AutomationProperties.Name="Back"
AutomationProperties.AutomationId="BackButton"
AutomationProperties.ItemType="Navigation Button" Tapped="backButton_Tapped"/>
<TextBlock x:Name="pageTitle" Text="Metropolitan line" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1"
IsHitTestVisible="false" TextWrapping="NoWrap" VerticalAlignment="Bottom" Margin="0,0,30,40" Foreground="#FF9B0056"/>
</Grid>
<Grid x:Name="Output" Grid.Row="1">
<!-- This shows a hard-coded width to show within the SDK Sample framework. In a real application you likely wouldn't set a width on the SemanticZoom -->
<SemanticZoom x:Name="semanticZoom" Margin="0,0,0,0">
<SemanticZoom.ZoomedOutView>
<GridView ScrollViewer.IsHorizontalScrollChainingEnabled="False" >
<GridView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Group.Key}" HorizontalAlignment="Center" FontFamily="Segoe UI" FontWeight="Light" FontSize="56" Foreground="White"/>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid ItemWidth="200" ItemHeight="200" MaximumRowsOrColumns="4" VerticalAlignment="Center"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="Margin" Value="4" />
<Setter Property="Padding" Value="10" />
<Setter Property="Background" Value="#9B0056" />
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="VerticalContentAlignment" Value="Center" />
</Style>
</GridView.ItemContainerStyle>
</GridView>
</SemanticZoom.ZoomedOutView>
<SemanticZoom.ZoomedInView>
<GridView x:Name="ItemsGridView"
ItemsSource="{Binding Source={StaticResource cvsMetropolitan}}"
ShowsScrollingPlaceholders="False"
ContainerContentChanging="ItemsGridView_ContainerContentChanging"
IsSwipeEnabled="True" ScrollViewer.IsHorizontalScrollChainingEnabled="False" ItemClick="GridView_ItemClicked">
<GridView.ItemTemplate>
<DataTemplate>
<local:ItemViewer/>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock Text='{Binding Key}' Foreground="#FF9B0056" Margin="5" FontSize="50" FontFamily="Segoe UI" FontWeight="Light" />
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</GridView.GroupStyle>
</GridView>
</SemanticZoom.ZoomedInView>
</SemanticZoom>
</Grid>
</Grid>
</Page>
给你。在您的代码隐藏中...
void GridView_ItemClicked(object sender, ItemClickEventArgs args)
{
var item = (Item)args.ClickedItem;
if (item.Link == "/Page_1.xaml")
((Frame)Window.Current.Content).Navigate(typeof (Page_1));
else if (item.Link == "/Page_2.xaml")
((Frame)Window.Current.Content).Navigate(typeof (Page_2));
else if (item.Link == "/Page_3.xaml")
((Frame)Window.Current.Content).Navigate(typeof (Page_3));
}
祝你好运！