zoukankan      html  css  js  c++  java
  • Windows 10 开发日记(四)-- 当Binding遇到异步 -- 问题的引出

            Binding之于MVVM来说的重要性无需多说,Binding之于DataTemplate来说的重要性也无需多说,Binding的重要性也无需多说,异步也不用多说了,今天就到此为止吧。。。

            -------------------------------------------------冷冷的分割线------------------------------------------------------

            但是,当你要binding的数据是一个需要异步操作的结果的时候呢?

            这是我们在项目中遇到的实际问题,一度困扰了我很长时间,这篇文章是我探索的过程,在这个过程中,我尝试用不同的方案来解决这个问题,并且咨询了其它朋友,终于找到了一种解决方案,而且更加深入地了解了DataTemplate的工作机制,我觉得很有必要纪录下来,重新梳理这个探索的过程,应该会对遇到同样问题的同学有所帮助。

    我们的需求:

         显示一组缩略图的滤镜效果,用户点击了这个滤镜,可以在页面上看到应用了这个滤镜的效果 ,类似于这种效果

    们的解决方案:

    1. 需要一个项集合控件,类似于ListBox (UI工作)

    2. 需要一个ItemControl,用于显示滤镜的名称和处理过的缩略图(UI)

    3. 需要一个滤镜类,需要包含滤镜名和滤镜信息(数据)

    4. UI与数据结合

    开始动手--方案一:

         1. 先把数据做起来,我们给出了这么一个类,代表我的滤镜

    public class MyFilter
    {
       public FilterData Filter{get;set;} // 滤镜相关信息
       public FilterName Name{get;set;} // 滤镜名
    } 
    

          2. 项集合控件,MyItemsControl,有一个ItemsSource,接收一个List<MyFilter>的数据源

          3. Item控件,用于显示滤镜名和展示应用过该滤镜的缩略图,MyItemControl,我只需要一个数据源,将MyItemControl的DataContext设置为这个数据源,然后使用binding就OK,由于Image需要的是一个ImageSource的数据源,所以我还需要一个转换器,将FilterData转换为WriteableBitmap

    <UserControl.Resources>
    <local:WriteableBitmapConverter x:name="imageConverter"/>
    </UserControl.Resources>
    <UserControl> <Grid> <Image x:Name="FilterImage" Binding={MyFilterData, Converter={StaticResource imageConverter} /> <TextBlock x:Name="FilterNameTB" Binding= {MyFilterName}/> </Grid> </UserControl>

          4. 最后一步,实现这个WriteableBitmapConverter,将数据转换为可以被Image接收的WriteableBitmap:

     public class ImageConverter : IValueConverter
        {
            public async Task<object> Convert(object value, Type targetType, object parameter, string language)
            {
               
                WriteableBitmap thumb = await SDK.GetThumbAsync();
                var filterData = value as MyFilterData;
                WriteableBitmap renderedResult = await SDK.RenderAsync(thumb, filterData);
                return renderedResult;
            }
    
            public object ConvertBack(object value, Type targetType, object parameter, string language)
            {
                throw new NotImplementedException();
            }
        }
    

      OH,NO!为了保证用户体验和UI的流畅性,我的SDK被设计成了异步操作,转换器里面能这么写么?答案很明显,不行。

          那么问题来了:当Binding遇到异步的时候,该怎么办?

         

  • 相关阅读:
    mac sourceTree 每次操作提示需要密码
    docker-compose.yml开机启动
    详解Oracle 21c 中的只读Oracle主⽬录特性 (ROOH)
    使用kubeadm一键部署kubernetes集群
    Ubuntu18.04 开机自启动(需要 sudo 权限)
    nginx加载vue3 打包后的静态文件
    使用Docker搭建Nextcloud SSL站点
    Docker+Selenium+TestNG+Maven+Jenkins环境搭建
    Windows Server 2016安装AD并开启SSL
    Centos 环境配置内网 Yum 源
  • 原文地址:https://www.cnblogs.com/DinoWu/p/4543033.html
Copyright © 2011-2022 走看看