WP8.1开发中ListView控件加载图列表的简单使用(1)
我也是刚接触WP编程没几个月,就是在这段时间一直闲着没事,然后又比较喜欢WP这款系统,就学习了WP这方面的开发言语,自学是很困难的,掌握这方面的资料不多,很初级,就是自己在网上找资料学习过程中,看到别人的分享让我学到了很多,所以我也想分享一下自己的经验,另一方面也希望和大家交流交流,并得到大家的指点。
好了,不多说了,现在开始进入正题吧:
ListView这个控件用的很多,而且功能很强大,在我练习开发两个小软件的之前,我以为很简单没什么内容,谁知在开发过程中,才知道它的功能之多,现在就简单说其中的一个功能:加载显示列表图片;
先上Page上的 XAML代码:
<Page x:Class="圣经故事1.BlankPage1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:圣经故事1" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> <Grid> <!--<Grid.Resources></Grid.Resources>之间注册要绑定的数据--> <Grid.Resources> <CollectionViewSource x:Name="itemcollectionSource" IsSourceGrouped="True" ItemsPath="DirNameList"/><!--ItemsPath=我一直没怎么搞懂,在这里这个可不要,没什么用--> </Grid.Resources>
<!--<ScrollViewer><ScrollViewer.Content></ScrollViewer.Content></ScrollViewer>在之间的ListView控件上加滚动条--> <ScrollViewer> <ScrollViewer.Content> <StackPanel> <ListView x:Name="lv" ItemsSource="{Binding Source={StaticResource itemcollectionSource}}"> <ListView.GroupStyle> <GroupStyle x:Name="gs"> <GroupStyle.HeaderTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <Image x:Name="im1" Source="{Binding Path=DirectoryImageSource}" Height="240" Width="240" Stretch="Uniform"/> <StackPanel> <TextBlock x:Name="te1" Text="{Binding Path=DirectoryName}" /> </StackPanel> </StackPanel> </DataTemplate> </GroupStyle.HeaderTemplate> </GroupStyle> </ListView.GroupStyle> </ListView> </StackPanel> </ScrollViewer.Content> </ScrollViewer> </Grid> </Page>
然后再写一个Model类(当然也可以写成自动属性,我习惯这样写;MVVM架构中的M):
public class DirectoryModel { private string _directoryName; public string DirectoryName//图片名称的属性 { get { return _directoryName; } set { _directoryName = value; } } private string _directoryImageSource; public string DirectoryImageSource//图片路径的属性 { get { return _directoryImageSource; } set { _directoryImageSource = value; } } }
再建一个ViewModel类(MVVM架构中的VM):
class DirectoryViewModel { private ObservableCollection<DirectoryModel> _dirNameList = new ObservableCollection<DirectoryModel>(); public ObservableCollection<DirectoryModel> DirNameList { get { return _dirNameList; } set { _dirNameList=value; } } public DirectoryViewModel() { } public DirectoryViewModel( ObservableCollection<DirectoryModel> list1) { this.DirNameList = list1; } }
最后是后台代码了:
public BlankPage1() { this.InitializeComponent();
ObservableCollection<DirectoryModel> dnmList = new ObservableCollection<DirectoryModel>()//这里用ObservableCollection<T>集合,是因为它能实时更改数据,
//且在加载大量数据时能实时加载,不是一次加载完,比如300张图片它可能加载50张,当你在下拉过程中实时更并加载其它的图片;
{
new DirectoryModel() { DirectoryImageSource="Assets/DirectoryImages/1.jpg", DirectoryName="asdfaf"},
new DirectoryModel() { DirectoryImageSource="Assets/DirectoryImages/2.jpg", DirectoryName="fffffffffffff" },
new DirectoryModel() { DirectoryImageSource="Assets/DirectoryImages/3.jpg", DirectoryName="aaaaaaaaaasfsaf" },
new DirectoryModel() { DirectoryImageSource="Assets/DirectoryImages/4.jpg", DirectoryName="aaaaaaaaaasfsaf" },
};
DirectoryViewModel dvm= new DirectoryViewModel(dnmList); //对dvm进行实例化 this.itemcollectionSource.Source =dvm.DirNameList;//将dvm的集合属性绑定到资源当中 }
好了,这样就完成了,上一张效果图:
我现在也在学习当中,一直在练习MVVM架构及LISTVIEW这方面数据绑定,理解不是太好,如果有哪错误或不合适的地方请各位指正,
弱者在迷惑恐惧前止步不前,
强者则步步前进;
posted on 2016-01-01 11:06 legendofhungrywolf 阅读(170) 评论(0) 编辑 收藏 举报