WPF仿网易云搭建笔记(3):信息流控制之父子通讯

文章目录

专栏和Gitee仓库

WPF仿网易云 Gitee仓库
WPF仿网易云 CSDN博客专栏

前言

本篇主要以理论为主,讲解WPF中的信息流,以我个人的主观理解为主。

信息流

信息流简单来说就是各个代码之间如何通讯。一般来说,前端页面的元素分为三类。

  • 窗体元素:窗体元素是整个窗口。一般来说我们WPF都是单窗口项目。
  • 页:页就是最小业务逻辑整体,每个页都能实现一个完整的功能,比如用户设置页,数据列表页。在WPF中就是UserController
  • 组件/控件:最小逻辑单元,用于将复杂的逻辑简化。比如统计图控件,加载控件。WPF中是UserController。具有高度复用性。

后端是服务类[Services],用于处理整体的数据逻辑。将WPF的前端交互转化为真实的数据代码。

信息流一般有三种方式:

  • 父子通讯:一般用于页和组件,因为页和组件是父子关系。
  • 消息定义:一般用于页和页,因为页和页是兄弟关系。
  • IOC容器:一般是用于Service类

父子通讯

父子通讯一般遵守两个原则:

  • 主动暴露,有限交互:父子通讯必须要将通讯部分主动暴露,使用函数封装。
  • 单向数据流:父子通讯通道不同。一般来说是父通过数据驱动子,子通过回调父。

理解vue的单向数据流

父数据驱动子

这个就是我们上节课说的依赖属性。每次binding的数据更新都会驱动依赖属性交互。这里不展开说明

WPF仿网易云搭建笔记(2):组件化开发

子回调父

这里我们用Action作为回调的函数,代码功能基于我们上次的代码

WPF仿网易云搭建笔记(2):组件化开发

流程图

子组件 子组件View依赖属性CallBack 子组件ViewModel调用 父组件 父组件ViewModel声明回调 XAML设置子组件回调

测试用例

父组件ViewModel
csharp 复制代码
namespace BlankApp1.ViewModels
{
    public partial class MainWindowViewModel : ObservableObject
    {
    	
        .......其它代码

        /// <summary>
        /// 声明回调函数
        /// </summary>
        [ObservableProperty]
        private Action<string> mainTestShow;
        public MainWindowViewModel()
        {
            //实例化回调函数
            MainTestShow = new Action<string>((msg) =>
            {
                Debug.WriteLine("主函数回调"+msg);
            });
        }
    }
}
子组件ViewModel声明和使用
csharp 复制代码
namespace BlankApp1.ViewModels
{
    public partial class TitileViewModel:ObservableObject
    {
		//其它代码

        public RelayCommand MiniWindow { get; set; }
		//父组件回调
        public Action<string> TestCallBack { get; set; }
        
        public MainWindow MainWindow { get; set; }

        
        public TitileViewModel() {

            //其它代码
            MiniWindow = new RelayCommand(() => {
                MainWindow.WindowState = WindowState.Minimized;
                //父组件回调函数
                TestCallBack("缩小窗口");
                //本身打印
                Debug.WriteLine("缩小窗口");
            });
        }

    }
}
子组件依赖属性
csharp 复制代码
namespace BlankApp1.Views
{
    /// <summary>
    /// TitleView.xaml 的交互逻辑
    /// </summary>
    public partial class TitleView : UserControl
    {

        //这个只是为了代码提示,不涉及逻辑
        public MainWindow MainWindow { get; set; }

        public Action<string> TestCallBack { get; set; }

        //初始化依赖属性构造器
        public static readonly MyWpfExtension<TitleView> MyWpfExtension = new MyWpfExtension<TitleView>();

        //将回调函数注入
        public static readonly DependencyProperty TestCallBackProperty =
            MyWpfExtension.DependencyPropertySet<Action<string>>("TestCallBack", (view, value) =>
            {
                view.TitileViewModel.TestCallBack = value;

            });



        /// <summary>
        /// DataContext的数据
        /// </summary>
        public TitileViewModel TitileViewModel { get; set; }

        public TitleView()
        {
            InitializeComponent();
            //拿到DataContext数据重定向
            TitileViewModel = (TitileViewModel)DataContext;
            TitileViewModel.UserName = "小王";
        }
    }
}
父子回调绑定

结果和预期一致

csharp 复制代码
 MiniWindow = new RelayCommand(() => {
     MainWindow.WindowState = WindowState.Minimized;
     //父组件回调函数
     TestCallBack("缩小窗口");
     //本身打印
     Debug.WriteLine("缩小窗口");
 });

完整代码

完整代码可以看我的Gitee仓库

WPF仿网易云 Gitee仓库

结论

父子通讯问题解决了之后,我们就可以完美的组件化开发WPF项目了。但是由于父子通讯是父子关系通讯,有些组件是兄弟关系,没有上下级,这个就需要另外的信息通讯方案了。我将会在下一节进行介绍。

相关推荐
聪明的笨猪猪19 分钟前
Java Spring “MVC ”面试清单(含超通俗生活案例与深度理解)
java·经验分享·笔记·面试
LXS_3571 小时前
Day 09(下) B2a实例解说----exampleB2a.cc+ActionInitialization+PrimaryGeneratorAction
笔记·学习方法·改行学it·geant4·b2a
繁星星繁2 小时前
C++11学习笔记
c++·笔记·学习
金水谣3 小时前
10.8考研笔记
笔记
分布式存储与RustFS8 小时前
告别手动配置:用 Terraform 定义你的 RustFS 存储帝国
云原生·wpf·文件系统·terraform·对象存储·minio·rustfs
蒙奇D索大12 小时前
【数据结构】考研数据结构核心考点:二叉排序树(BST)全方位详解与代码实现
数据结构·笔记·学习·考研·算法·改行学it
玲娜贝儿--努力学习买大鸡腿版12 小时前
推荐算法学习笔记(十九)阿里SIM 模型
笔记·学习·推荐算法
我命由我1234514 小时前
Photoshop - Photoshop 工具栏(10)透视裁剪工具
经验分享·笔记·学习·ui·职场和发展·职场发展·photoshop
JJJJ_iii14 小时前
【深度学习03】神经网络基本骨架、卷积、池化、非线性激活、线性层、搭建网络
网络·人工智能·pytorch·笔记·python·深度学习·神经网络
玉石观沧海14 小时前
高压变频器故障代码解析F67 F68
运维·经验分享·笔记·分布式·深度学习