對(duì)于列表控件，WP8.1常用的是ListView、GridView、ListBox控件。其中前兩個(gè)是從第三個(gè)繼承來的。

1、ListView控件

它是展示垂直列表的，如下圖所示。它十分適合展示數(shù)據(jù)。

2、GridView控件

它是行列表展示數(shù)據(jù)的控件，排列圖如下。通常用來展示基于圖片的數(shù)據(jù)。

3、控件的Templates

常用的有HeaderTemplate、FooterTemplate、ItemTemplate。本文最下面有相關(guān)代碼。

（其中還有ItemContainerStyle、ItemsPanel

4、屬性：重新排序Reordering

WP8.1中：MyListView.ReorderMode = ListViewReorderMode.Enabled;

Win8.1中：MyListView.CanReorderItems = false;

但Grouped Lists （分組列表）不能重新排序。

5、屬性：多種選定MultiSelection

當(dāng)開啟MultiSelection后，列表會(huì)變?yōu)橄聢D。開啟MultiSelection代碼為：MyListView.SelectionMode =? ListViewSelectionMode.Multiple;

6、運(yùn)用實(shí)例：

xaml代碼：

<Grid Grid.Row="1" x:Name="ContentRoot" Margin="19,9.5,19,0"><ListView Name="view1"SelectionMode="None"AllowDrop="True"CanDragItems="True"IsSwipeEnabled="True"><ListView.HeaderTemplate><DataTemplate><StackPanel><Canvas Height="15" Background="#962381E0"><TextBlock Text="header"><TextBlock.Foreground><LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"><GradientStop Color="Black" Offset="0"/><GradientStop Color="#FFF9F5F5" Offset="1"/></LinearGradientBrush></TextBlock.Foreground></TextBlock></Canvas></StackPanel></DataTemplate></ListView.HeaderTemplate><ListView.ItemTemplate><DataTemplate><StackPanel Orientation="Horizontal"><TextBlock Text="{Binding Id}" Style="{ThemeResource ListViewItemTextBlockStyle}" Width="100"/><TextBlock Text="{Binding Name}" Style="{ThemeResource ListViewItemTextBlockStyle}"/></StackPanel></DataTemplate></ListView.ItemTemplate><ListView.FooterTemplate><DataTemplate><TextBlock Foreground="Red" Text="這是個(gè)學(xué)習(xí)的好例子"/></DataTemplate></ListView.FooterTemplate></ListView></Grid></Grid><Page.BottomAppBar><CommandBar><CommandBar.SecondaryCommands><AppBarButton Label="appbarbutton"/></CommandBar.SecondaryCommands><AppBarButton Name="AllApps" Icon="AllApps" Label="多選" Click="AllApps_Click"/><AppBarButton Name="viewall" Icon="ViewAll" Label="appbarbutton" Click="viewall_Click"/></CommandBar></Page.BottomAppBar>

相應(yīng)的部分C#代碼：

List<School> items = new List<School>();public string[] str=new string[]{"華農(nóng)","華工","中大","華師","暨大","廣工","廣外","廣大","深大","廣中醫(yī)","南醫(yī)大"};Random random = new Random();for (int i = 0; i < 100; i++){items.Add(new School { Id = i, Name = str[random.Next(0,10)] });}this.view1.ItemsSource = items;...private void AllApps_Click(object sender, RoutedEventArgs e){if (view1.SelectionMode == ListViewSelectionMode.Multiple){view1.SelectionMode = ListViewSelectionMode.Single;}elseview1.SelectionMode = ListViewSelectionMode.Multiple;}private void viewall_Click(object sender, RoutedEventArgs e){if ( view1.ReorderMode == ListViewReorderMode.Enabled){view1.ReorderMode = ListViewReorderMode.Disabled;}elseview1.ReorderMode = ListViewReorderMode.Enabled;}private void gotopage2_Click(object sender, RoutedEventArgs e){Frame.Navigate(typeof(Page2));}}

?---------------------------------------------------------------------------------------------------------------------------------------------

2015年2月26號(hào)添加

一、ListView或GridView控件的GroupStyle

使用GroupStyle屬性可以更好為App展示數(shù)據(jù)，效果圖如下：

這種樣式十分容易弄出來，步驟如下：

step1：

1 在Page.Resoures添加 2 <CollectionViewSource x:Name="collectionItems" IsSourceGrouped="True" Source="{Binding Items}" ItemsPath="Codes"/>

step2：

添加GroupStyle <ListView Name="listCode" ItemClick="listViewCode_ItemClick" ItemsSource="{Binding Source={StaticResource collectionItems}}" ItemTemplate="{StaticResource StandardTripleLineItemTemplate}"IsItemClickEnabled="True"><ListView.GroupStyle><GroupStyle><GroupStyle.HeaderTemplate><DataTemplate><Grid><Border Opacity="0.8" Width="350" CornerRadius="0,30,30,0" Background="{StaticResource MyFavoriteBrush}"><TextBlock Text="{Binding Title}" FontSize="30" Padding="5"/></Border></Grid></DataTemplate></GroupStyle.HeaderTemplate></GroupStyle></ListView.GroupStyle></ListView>

即可

ps：collectionItems綁定的數(shù)據(jù)格式可參考https://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh780627.aspx?f=255&MSPPError=-2147217396

還可以使用SemanticZoom控件加強(qiáng)用戶體驗(yàn)，demo地址：https://msdn.microsoft.com/zh-cn/library/windows/apps/xaml/hh781234

轉(zhuǎn)載于:https://www.cnblogs.com/NEIL-X/p/4149522.html

總結(jié)

以上是生活随笔為你收集整理的wp8.1 Study7： ListView 和GridView应用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。