文档章节

【万里征程——Windows App开发】ListView&GridView之分组

NoMasp
 NoMasp
发布于 2015/09/08 21:48
字数 1218
阅读 8
收藏 0

本文承接【万里征程——Windows App开发】ListView&GridView之添加数据

在上一篇中我们已经了解了怎样将数据绑定到ListView或GridView,但既然要用到这两个控件往往是因为数据繁多,那么几乎就不可避免的要让其能够分组。我们所绑定的数据源可能是项列表,其中的每个项甚至还有其自己的项,那么问题就来了。

一时不会也想不出什么宏伟的例子,就做一个简单的闹钟的时间表的ListView和GridView吧。那么先在项目中添加一个类,最好在Shared下。内容都是很简易的,闹钟的标题、时间、备注等,为了增加一级目录就加了一个AlarmMode,就算作学习和生活吧,学习生活两不误……

public class Alarm
{
    public string Title { get; set; }
    public DateTime AlarmClockTime { get; set; }
    public string Description { get; set; }
    public string AlarmMode { get; set; }
}
public class AlarmMode
{
   public AlarmMode()
   {
       alarmMode = new ObservableCollection<Alarm>();
   }
   public string Name { get; set; }
   public ObservableCollection<Alarm> alarmMode { get; private set; }
}

首先嘛,先来定义一个全局的时间,然后在页面加载时加载两个函数(将在下一步定义)。

    DateTime globalTime;
protected override void OnNavigatedTo(NavigationEventArgs e)
{
    DateTime.TryParse("1/1/2115", out globalTime);
    AddAlarm();
    AddAlarmMode();
}

一大波数据正在靠近!

        private void AddAlarm()
        {
            List<Alarm> listAlarm = new List<Alarm>();

            listAlarm.Add(new Alarm()
            {
                Title = "Alarm1",
                Description = "First Alarm",
                AlarmClockTime = globalTime.AddHours(1),
                AlarmMode = "Alarm In Life"
            });
            listAlarm.Add(new Alarm()
            {
                Title = "Alarm2",
                Description = "Second Alarm",
                AlarmClockTime = globalTime.AddHours(11),
                AlarmMode = "Alarm In Life"
            });
            listAlarm.Add(new Alarm()
            {
                Title = "Alarm3",
                Description = "Third Alarm",
                AlarmClockTime = globalTime.AddDays(1),
                AlarmMode = "Alarm In Life"
            });

            listAlarm.Add(new Alarm()
            {
                Title = "Alarm1",
                Description = "First Alarm",
                AlarmClockTime = globalTime.AddHours(12),
                AlarmMode = "Alarm In Study"
            });
            listAlarm.Add(new Alarm()
            {
                Title = "Alarm2",
                Description = "Second Alarm",
                AlarmClockTime = globalTime.AddHours(15),
                AlarmMode = "Alarm In Study"
            });
            listAlarm.Add(new Alarm()
            {
                Title = "Alarm3",
                Description = "Third Alarm",
                AlarmClockTime = globalTime.AddMonths(1),
                AlarmMode = "Alarm In Study"
            });

            ar alarmSetting = from ala in listAlarm
                               group ala
                               by ala.AlarmMode
                               into alaSetting
                               orderby alaSetting.Key
                               select alaSetting;
            collectionVSAlarm.Source = alarmSetting;
        }

        private void AddAlarmMode()
        {
            List<AlarmMode> listAlarmMode = new List<AlarmMode>();

            AlarmMode am1 = new AlarmMode();
            am1.Name = "Alarm In Life";
            am1.alarmMode.Add(new Alarm()
            {
                Title = "Alarm1",
                Description = "First Alarm",
                AlarmClockTime = globalTime.AddHours(1),
            });
            am1.alarmMode.Add(new Alarm()
            {

                Title = "Alarm2",
                Description = "Second Alarm",
                AlarmClockTime = globalTime.AddHours(11),
            });
            am1.alarmMode.Add(new Alarm()
            {
                Title = "Alarm3",
                Description = "Third Alarm",
                AlarmClockTime = globalTime.AddDays(1),
            });
            listAlarmMode.Add(am1);

            AlarmMode am2 = new AlarmMode();
            am2.Name = "Alarm In Study";
            am2.alarmMode.Add(new Alarm()
            {
                Title = "Alarm1",
                Description = "First Alarm",
                AlarmClockTime = globalTime.AddHours(12),
            });
            am2.alarmMode.Add(new Alarm()
            {
                Title = "Alarm2",
                Description = "Second Alarm",
                AlarmClockTime = globalTime.AddHours(15),
            });
            am2.alarmMode.Add(new Alarm()
            {
                Title = "Alarm3",
                Description = "Third Alarm",
                AlarmClockTime = globalTime.AddMonths(1),
            });
            listAlarmMode.Add(am2);

            collectionVSAlarmMode.Source = listAlarmMode;
        }

这些数据都是乱七八糟啦,大家凑合着看啦。这是两个函数,数据我都是用List<>来定义的,将数据通过Add函数添加到listAlarm和listAlarmMode中即可。最后再从listAlarm中根据AlarmMode挑出数据到alaSetting,同时还要根据Key值进行排序最后选出并连接到collectionVSAlarm的Source属性中。这个是需要在MainPage.xaml中定义的哦,就像

    <UserControl.Resources>
        <CollectionViewSource x:Name="collectionVSAlarm" IsSourceGrouped="True"/>
        <CollectionViewSource x:Name="collectionVSAlarmMode" IsSourceGrouped="True" ItemsPath="alarmMode"/>
    </UserControl.Resources>

然后我们还需要创建一个ListGridGroupStyle类来继承GroupStyleSelector,重载它的SelectGroupStyleCore方法,并且返回ListGridGroupStyleResource资源,这个资源在博客后文中有定义,其定义在App.xaml中。相应的代码如下咯:

    public class ListGridGroupStyle : GroupStyleSelector
    {
        protected override GroupStyle SelectGroupStyleCore(object group, uint level)
        {
            return (GroupStyle)App.Current.Resources["ListGridGroupStyleResource"];
        }
    }

方法重载好之后就需要在前面的UserControl.Resources中加上以下这条代码啦。

    <local:ListGridGroupStyle x:Key="ListGridGroupStyleResource"/>

然后我们来一系列的基本样式到App.xaml中就好啦,关于资源文件的使用我们在后面会系统的来学习。这里的DataTemplate和GroupStyle都在资源字典中,前者是Template模板,后者是Style风格。内容的排版大家都随意啦,记得设置好Key值。

    <Application.Resources>
        <ResourceDictionary>
            <DataTemplate x:Key="dataTemplateListView">
                <StackPanel Width="700" Margin="10">
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Title}" FontWeight="Bold" Margin="12"/>
                        <TextBlock Text="{Binding AlarmClockTime}" TextWrapping="NoWrap" Margin="12"/>
                        <TextBlock Text="{Binding Description}" TextWrapping="NoWrap" Margin="12"/>
                    </StackPanel>

                </StackPanel>
            </DataTemplate>

            <GroupStyle x:Key="ListGridGroupStyleResource">
                <GroupStyle.HeaderTemplate>
                    <DataTemplate>
                        <Grid Background="LightGray" >
                            <TextBlock Text='{Binding Key}' Foreground="CornflowerBlue" Margin="12" />
                        </Grid>
                    </DataTemplate>
                </GroupStyle.HeaderTemplate>
            </GroupStyle>
        </ResourceDictionary>
    </Application.Resources>

那么这些各种资源都定义好了之后就在MainPage.xaml把下面这些敲进去。各种资源的调用在这里尤其需要注意,其实对于稍微复杂一丁点的程序而言,名称就已经变得让人崩溃了。所以拥有一个良好的命名习惯很重要。

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="auto"/>
            <ColumnDefinition Width="auto"/>
        </Grid.ColumnDefinitions>

        <GridView Grid.Column="0" ItemsSource="{Binding Source={StaticResource collectionVSAlarmMode}}" Margin="12,120,12,12" MaxHeight="600" >
            <GridView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Margin="18">
                        <TextBlock Text="{Binding Title}" FontWeight="ExtraBold" />
                        <TextBlock Text="{Binding AlarmClockTime}" FontWeight="Light" TextWrapping="NoWrap" />
                        <TextBlock Text="{Binding Description}" TextWrapping="NoWrap" />
                    </StackPanel>
                </DataTemplate>
            </GridView.ItemTemplate>
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <ItemsWrapGrid MaximumRowsOrColumns="2"/>
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>

            <GridView.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <Grid Background="Green" Margin="12">
                                <TextBlock Text='{Binding Name}' Foreground="Bisque" Margin="36"/>
                            </Grid>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>    
                </GroupStyle>
            </GridView.GroupStyle>
        </GridView>

        <ListView Grid.Column="1" ItemsSource="{Binding Source={StaticResource collectionVSAlarm}}" ItemTemplate="{StaticResource dataTemplateListView}" GroupStyleSelector="{StaticResource ListGridGroupStyleResource}" Margin="120" />       
    </Grid>

这里写图片描述

我这写的真是太丑了哎,做App的时候可得好好调调了,为了不伤了大家的眼睛最后我还是来张漂亮的壁纸吧……下一篇再见咯!

这里写图片描述

为使本文得到斧正和提问,转载请注明出处:
http://blog.csdn.net/nomasp

版权声明:本文为 NoMasp柯于旺 原创文章,未经许可严禁转载!欢迎访问我的博客:http://blog.csdn.net/nomasp

本文转载自:http://blog.csdn.net/nomasp/article/details/44926753

NoMasp
粉丝 7
博文 334
码字总数 0
作品 0
镇江
程序员
私信 提问
nomasp 博客导读:Lisp/Emacs、Algorithm、Android

版权声明:转载请联系本人,感谢配合!本站地址:http://blog.csdn.net/nomasp https://blog.csdn.net/NoMasp/article/details/44966625 Profile Introduction to Blog 您能看到这篇博客导读...

nomasp
2015/09/17
0
0
浙江万里学院-阿里云大数据应用学院2018级新生开学典礼隆重举行

2018年10月11日,由浙江万里学院、阿里云、慧科集团三方共建的阿里云大数据应用学院2018级新生开学典礼在浙江万里学院隆重举行。浙江万里学院阿里云大数据应用学院不仅是浙江省首个,也是目前...

昕华
2018/10/12
0
0
『远山淡影』——逝去往昔的记忆拼图

远山淡影,书名就很有禅意,有种中国泼墨山水画的意境,不禁让人遐想。这是今年诺贝尔奖文学奖获得者石黑一雄出道的作品,也是我读的第一本他的书。 远山淡影封面 故事有两条线,一条线是悦子...

知猪侠_CD
2017/11/26
0
0
专访阿里云首席科学家闵万里:为什么说数据不是新时代的石油

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/McIl9G4065Q/article/details/83311637 关注网易智能,聚焦AI大事件,读懂下一个大时代! 出品| 网易智能(公...

网易智能
2018/10/23
0
0
阿里云定义产业AI:ET大脑全面发布

  上周,阿里云因为一条微博引发行业对其AI布局的关注。微博中提到的“一个开创性的AI”,会是什么?   12月20日谜底揭晓。阿里云在云栖大会·北京峰会上正式推出整合城市管理、工业优化...

人工智能技术社区
2017/12/21
0
0

没有更多内容

加载失败,请刷新页面

加载更多

mysql概览

学习知识,首先要有一个总体的认识。以下为mysql概览 1-架构图 2-Detail csdn |简书 | 头条 | SegmentFault 思否 | 掘金 | 开源中国 |

程序员深夜写bug
今天
8
0
golang微服务框架go-micro 入门笔记2.2 micro工具之微应用利器micro web

micro web micro 功能非常强大,本文将详细阐述micro web 命令行的功能 阅读本文前你可能需要进行如下知识储备 golang分布式微服务框架go-micro 入门笔记1:搭建go-micro环境, golang微服务框架...

非正式解决方案
今天
6
0
前端——使用base64编码在页面嵌入图片

因为页面中插入一个图片都要写明图片的路径——相对路径或者绝对路径。而除了具体的网站图片的图片地址,如果是在自己电脑文件夹里的图片,当我们的HTML文件在别人电脑上打开的时候图片则由于...

被毒打的程序猿
今天
8
0
Flutter 系列之Dart语言概述

Dart语言与其他语言究竟有什么不同呢?在已有的编程语言经验的基础上,我们该如何快速上手呢?本篇文章从编程语言中最重要的组成部分,也就是基础语法与类型变量出发,一起来学习Dart吧 一、...

過愙
今天
5
0
rime设置为默认简体

转载 https://github.com/ModerRAS/ModerRAS.github.io/blob/master/_posts/2018-11-07-rime%E8%AE%BE%E7%BD%AE%E4%B8%BA%E9%BB%98%E8%AE%A4%E7%AE%80%E4%BD%93.md 写在开始 我的Arch Linux上......

zhenruyan
今天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部