zoukankan      html  css  js  c++  java
  • Windows Phone 8.1 列表控件(3):多数据呈现

    说到 List 控件,Windows Phone 8.1 上推荐使用的是 ListView 和 GridView。

    而这两个控件实在太多东西可讲了,于是分成三篇来讲:

    (1)基本

    (2)分组数据

    (3)多数据呈现

    ListView 和 GridView 的最大差别就是:ListView 是一条条依序排列的,而 GridView 则是一块块依序排列的,因此 ListView 中的一项就会占据整整一行或者一列,而 GridView 的一项只会占据它应有的大小,一行或一列中可以放置多项。

    而两者在其它方面上基本一致,因此下文只对 ListView 进行介绍,GridView 其实也一样的。


    多数据呈现,也就是说大量的数据要在 ListView 中呈现时,加载必定会较慢,那要如何让用户体验更好呢?

    (1)添加 ListView 的 ContainerContentChanging 事件

    如字面意思所示,也就是当 ListView 的内容(也就是Item)发生改变时会触发的事件:

    <ListView ContainerContentChanging="IncrementalUpdateHandler"/>

    (2)确定 Item 内容的呈现顺序

    比如 Item 的结构为:

    Grid
       |__Border name=templatePlaceholder 
       |__Image name=templateImage
       |__Grid
          |__TextBlock name=templateTitle
          |__TextBlock name=templateSubTitle

    一般的做法都是先让占位符(templatePlaceholder)呈现,然后根据每项内容的重要程度和加载难度依次排序呈现。

    假设这个 Item 的呈现顺序为:Placeholder -> Title -> Image, SubTitle。

    (3)处理 ListView 的 ContainerContentChanging 事件

    private void IncrementalUpdateHandler(ListViewBase sender, ContainerContentChangingEventArgs args)
    {
        args.Handled = true;
    
    if( args.Phase != 0 )
            throw new Exception("something went terribly wrong");
        else
        {
            Grid templateRoot = (Grid)args.ItemContainer.ContentTemplateRoot;
            Border placeholder = (Border)templateRoot.FindName("templatePlaceholder");
            Image itemImage = (Image)templateRoot.FindName("templateImage");
            TextBlock title = (TextBlock)templateRoot.FindName("templateTitle");
            TextBlock subtitle = (TextBlock)templateRoot.FindName("templateSubTitle");
    
            placeholder.Opacity = 1;
    
            itemImage.Opacity = 0;
            title.Opacity = 0;
            subtitle.Opacity = 0;
    
            args.RegisterUpdateCallback(ShowText);
        }
    }

    首先将 args.Handled 设为 true 以及检查 args.Phase 是否不为 0。

    然后根据控件名称找到各控件,并根据需要设置每个控件的 Opacity,隐藏或显示它们。(注意,不能调整 Visible 属性,因为这会再次触发 ContainerContentChanging 事件)

    最后调用 args.RegisterUpdateCallback(MethodName),显示下一个要呈现的控件内容。

    private void ShowText(ListViewBase sender, ContainerContentChangingEventArgs args)
    {
        args.Handled = true;
    
        if( args.Phase != 1 )
            throw new Exception("something went terribly wrong");
        else
        {
            SampleItem sItem = (SampleItem)args.Item;
    
            Grid templateRoot = (Grid)args.ItemContainer.ContentTemplateRoot;
            TextBlock title = (TextBlock)templateRoot.FindName("templateTitle");
    
            title.Text = sItem.Title;
            title.Opacity = 1;
            args.RegisterUpdateCallback(ShowImage);
        }
    }
    ShowText
    private void ShowImage(ListViewBase sender, ContainerContentChangingEventArgs args)
    {
        args.Handled = true;
    
        if( args.Phase != 2 )
            throw new Exception("something went terribly wrong");
        else
        {
            SampleItem sItem = (SampleItem)args.Item;
    
            Grid templateRoot = (Grid)args.ItemContainer.ContentTemplateRoot;
            Image itemImage = (Image)templateRoot.FindName("templateImage");
            TextBlock subtitle = (TextBlock)templateRoot.FindName("templateSubTitle");
            Border placeholder = (Border)templateRoot.FindName("templatePlaceholder");
    
            itemImage.Source = new BitmapImage(new Uri(sItem.ItemImage));
            subtitle.Text = sItem.TargetGroup;
    
            itemImage.Opacity = 1;
            subtitle.Opacity = 1;
    
            placeholder.Opacity = 0;
        }
    }
    ShowImage

    其实也就是根据第二步中确定的内容呈现顺序依次调用 RegisterUpdateCallback。

  • 相关阅读:
    系统维护相关问题
    Python环境维护
    哈希表解决字符串问题
    论文笔记二:《A Tutoral on Spectral Clustering》
    论文笔记之哈希学习比较--《Supervised Hashing with Kernels》《Towards Optimal Binary Code Learning via Ordinal Embedding》《Top Rank Supervised Binary Coding for Visual Search》
    Java中String、StringBuffer、StringBuilder的比较与源 代码分析
    浙大pat1040 Longest Symmetric String(25 分)
    浙大pat1039 Course List for Student(25 分)
    浙大pat---1036 Boys vs Girls (25)
    百炼oj-4151:电影节
  • 原文地址:https://www.cnblogs.com/xiaoshi3003/p/3748827.html
Copyright © 2011-2022 走看看