WPF的UserControl的MVVM模式赋值

于 2025-03-02 18:01:48 发布
阅读量366 收藏 1
点赞数 15
文章标签： wpf
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/ly1h1/article/details/145967095
版权

背景说明

项目日常应用，经常会使用到UserConrol来进行组合形成组合控件，组合控件在使用过程中，必然需要进行赋值，当前案例是UserControl中label的定时赋值。

技术分析

1.分离关注点：MVVM 模式将应用程序分为三个主要部分，即模型（Model）、视图（View）和视图模型（ViewModel）。在这个例子中，MyUserControlViewModel 和 MainViewModel 充当 ViewModel，负责处理业务逻辑和数据操作；MyUserControl.xaml 和 MainWindow.xaml 是 View，负责呈现用户界面；而数据本身则相当于 Model。这种分离使得代码结构更加清晰，易于维护和测试。

2.属性更改通知：ViewModel 实现了 INotifyPropertyChanged 接口，当 ViewModel 中的属性值发生变化时，会触发 PropertyChanged 事件，通知视图更新相应的显示内容。这是 MVVM 模式中实现数据绑定自动更新的关键技术。

代码

UserControl的xaml

<UserControl x:Class="UserControlLabelsShow.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:UserControlLabelsShow"
             mc:Ignorable="d" Background="White" Height="145" Width="115"
            >
    <Grid >
        <Label Content="{Binding Label1Value}" Foreground="Black" HorizontalAlignment="Left" VerticalAlignment="Top" Height="25" Width="140"/>
        <Label Content="{Binding Label2Value}" Foreground="Black" HorizontalAlignment="Left" Margin="0,30,0,0" VerticalAlignment="Top" Height="30" Width="140"/>
        <Label Content="{Binding Label3Value}" Foreground="Black" HorizontalAlignment="Left" Margin="0,60,0,0" VerticalAlignment="Top" Height="25" Width="140"/>
        <Label Content="{Binding Label4Value}" Foreground="Black" HorizontalAlignment="Left" VerticalAlignment="Top" Height="30" Width="140" Margin="0,90,0,0"/>
        <Label Content="{Binding Label5Value}" Foreground="Black" HorizontalAlignment="Left" Margin="0,115,0,0" VerticalAlignment="Top" Height="25" Width="140"/>
    </Grid>
</UserControl>

UserControl的cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace UserControlLabelsShow
{
    /// <summary>
    /// UserControl1.xaml 的交互逻辑
    /// </summary>
    public partial class UserControl1 : UserControl
    {
        public UserControl1()
        {
            InitializeComponent();
            DataContext = new UserControl1ViewModel();
        }
    }
}

UserControl1ViewModel

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace UserControlLabelsShow
{
    public class UserControl1ViewModel:Notify
    {
        private int _label1Value;
        private int _label2Value;
        private int _label3Value;
        private int _label4Value;
        private int _label5Value;

        public int Label1Value
        {
            get { return _label1Value; }
            set
            {
                if (_label1Value != value)
                {
                    _label1Value = value;
                    OnPropertyChanged(nameof(Label1Value));
                }
            }
        }

        public int Label2Value
        {
            get { return _label2Value; }
            set
            {
                if (_label2Value != value)
                {
                    _label2Value = value;
                    OnPropertyChanged(nameof(Label2Value));
                }
            }
        }

        public int Label3Value
        {
            get { return _label3Value; }
            set
            {
                if (_label3Value != value)
                {
                    _label3Value = value;
                    OnPropertyChanged(nameof(Label3Value));
                }
            }
        }

        public int Label4Value
        {
            get { return _label4Value; }
            set
            {
                if (_label4Value != value)
                {
                    _label4Value = value;
                    OnPropertyChanged(nameof(Label4Value));
                }
            }
        }

        public int Label5Value
        {
            get { return _label5Value; }
            set 
            {
                if (_label5Value != value)
                {
                    _label5Value = value;
                    OnPropertyChanged(nameof(Label5Value));
                }
            }
        }

      

    }
}

MainWindowViewModel.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading;
using System.Threading.Tasks;
using System.Windows;

namespace UserControlLabelsShow
{
    public class MainWindowViewModel: Notify
    {

        public UserControl1ViewModel UserControl1ViewModel { get; set; }
        public UserControl1ViewModel UserControl2ViewModel { get; set; }
        public UserControl1ViewModel UserControl3ViewModel { get; set; }
        public UserControl1ViewModel UserControl4ViewModel { get; set; }


        private Timer _timer;

        public MainWindowViewModel()
        {
            UserControl1ViewModel = new UserControl1ViewModel();
            UserControl2ViewModel = new UserControl1ViewModel();
            UserControl3ViewModel = new UserControl1ViewModel();
            UserControl4ViewModel = new UserControl1ViewModel();

            _timer = new Timer(TimerCallback, null, TimeSpan.Zero, TimeSpan.FromSeconds(1));
        }



        private void TimerCallback(object state)
        {
            Application.Current.Dispatcher.Invoke(() =>
            {
                // 第一个 UserControl 赋值
                UserControl1ViewModel.Label1Value++;
                UserControl1ViewModel.Label2Value++;
                UserControl1ViewModel.Label3Value++;
                UserControl1ViewModel.Label4Value++;
                UserControl1ViewModel.Label5Value++;

                // 第二个 UserControl 赋值
                UserControl2ViewModel.Label1Value = UserControl2ViewModel.Label1Value + 100;
                UserControl2ViewModel.Label2Value = UserControl2ViewModel.Label2Value + 100;
                UserControl2ViewModel.Label3Value = UserControl2ViewModel.Label3Value + 100;
                UserControl2ViewModel.Label4Value = UserControl2ViewModel.Label4Value + 100;
                UserControl2ViewModel.Label5Value = UserControl2ViewModel.Label5Value + 100;

                // 第三个 UserControl 赋值
                UserControl3ViewModel.Label1Value = UserControl3ViewModel.Label1Value + 200;
                UserControl3ViewModel.Label2Value = UserControl3ViewModel.Label2Value + 200;
                UserControl3ViewModel.Label3Value = UserControl3ViewModel.Label3Value + 200;
                UserControl3ViewModel.Label4Value = UserControl3ViewModel.Label4Value + 200;
                UserControl3ViewModel.Label5Value = UserControl3ViewModel.Label5Value + 200;

                // 第四个 UserControl 赋值
                UserControl4ViewModel.Label1Value = UserControl4ViewModel.Label1Value + 300;
                UserControl4ViewModel.Label2Value = UserControl4ViewModel.Label2Value + 300;
                UserControl4ViewModel.Label3Value = UserControl4ViewModel.Label3Value + 300;
                UserControl4ViewModel.Label4Value = UserControl4ViewModel.Label4Value + 300;
                UserControl4ViewModel.Label5Value = UserControl4ViewModel.Label5Value + 300;
            });
        }
    }
}

MainWindow.xaml

<Window x:Class="UserControlLabelsShow.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:UserControlLabelsShow"
        mc:Ignorable="d"
        Title="MainWindow" Height="500" Width="690">
    <Grid>
        <local:UserControl1  DataContext="{Binding UserControl1ViewModel}" HorizontalAlignment="Left" Margin="10,5,0,0" VerticalAlignment="Top" Height="140" Width="305" Background="Aqua"/>
        <local:UserControl1  DataContext="{Binding UserControl2ViewModel}" HorizontalAlignment="Left" Margin="15,170,0,0" VerticalAlignment="Top" Height="140" Width="305" Background="Aqua"/>
        <local:UserControl1  DataContext="{Binding UserControl3ViewModel}" HorizontalAlignment="Left" Margin="350,170,0,0" VerticalAlignment="Top" Height="140" Width="305" Background="Aqua"/>
        <local:UserControl1  DataContext="{Binding UserControl4ViewModel}" HorizontalAlignment="Left" Margin="350,5,0,0" VerticalAlignment="Top" Height="140" Width="305" Background="Aqua"/>

    </Grid>
</Window>

MainWindow.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace UserControlLabelsShow
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            DataContext = new MainWindowViewModel();

        }
    }
}

辅助类MyCommand

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;

namespace UserControlLabelsShow
{
    public class MyCommand:ICommand
    {
        private readonly Action _execute;
        private readonly Func<bool> _canExecute;

        public MyCommand(Action execute, Func<bool> canExecute = null)
        {
            _execute = execute ?? throw new ArgumentNullException(nameof(execute));
            _canExecute = canExecute;
        }

        public event EventHandler CanExecuteChanged
        {
            add { CommandManager.RequerySuggested += value; }
            remove { CommandManager.RequerySuggested -= value; }
        }

        public bool CanExecute(object parameter)
        {
            return _canExecute == null || _canExecute();
        }

        public void Execute(object parameter)
        {
            _execute();
        }



    }
}

辅助类Notify

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Runtime.CompilerServices;
using System.Text;
using System.Threading.Tasks;

namespace UserControlLabelsShow
{
    public abstract class Notify : INotifyPropertyChanged
    {

        public event PropertyChangedEventHandler PropertyChanged;

        public void OnPropertyChanged([CallerMemberName] string name = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
        }

    }
}

观无
关注
【愚公系列】2023年11月 WPF+上位机+工业互联 069-MVVM模式中的命令
时光隧道
10-01 4万+
命令是计算机操作系统中用户输入的指令，它们告诉计算机要执行的操作和任务。命令可以通过命令行界面或图形用户界面（GUI）输入并执行。在计算机领域，命令可以用于许多不同的任务，包括文件操作、网络连接、系统管理和安全等。一些常见的命令包括cd（改变目录）、ls（列出文件）、mkdir（创建目录）和rm（删除文件）。序号描述1播放媒体2暂停播放媒体3停止播放媒体4切换播放媒体和暂停播放媒体5增加媒体音量6减少媒体音量7静音媒体音量8取消静音媒体音量9开/关媒体静音10。
WPF MVVM 循环添加控件
weixin_44568194的博客
06-27 2385
在WPF里面使用MVVM模式实现跨页面传输ID，并且查询出相应的数据 首先我们需要创建一个用户控件，当然你也一直接在那个主页面给他几个按钮，然后点击按钮就会传输特定的值，不过因为你这些值不是通过数据库查询出来的，没有办法随时改变想要的数据，比较生硬，我这边的话是先创建一个用户控件，里面就一个按钮，然后按钮的名称是通过绑定，在数据库查询出来的。 <Border Background="Transparent"> <Grid> <TextBl
WPF -- 自定义控件 （UserControl）（二 下）
qq_23018459的博客
04-17 5597
在自定义控件 （UserControl）（二 上）中转载大神的一篇博文。通过一个UserControl例子主要介绍了User Control后台添加依赖项属性，路由事件以及命令的添加以及使用，这篇我主要介绍一下通过通过项目应用后的一些总结。首先来分析一段前台代码： &lt;ScrollViewer Grid.Row="4" VerticalScrollBarVisibility="Auto...
WPF用户控件User Control的使用-在MVVM架构下实现能量条效果
最新发布
weixin_67244432的博客
08-21 895
定义用户控件是由一组现有的WPF控件组成，并在一个XAML文件中定义的可重用的控件。它可以包含多个控件、布局和行为，形成一个独立的、可在应用程序中多次使用的模块。特点可重用性：用户控件的设计目的是提高代码的重用性，使得界面元素的组合和布局能够在应用程序中重复利用。模块化：通过将界面划分为多个独立的用户控件，可以实现更好的模块化设计，有助于代码的维护和管理。易于扩展：用户控件可以根据需要轻松地进行扩展，包括添加新的控件、更改布局或修改逻辑等。
MVVM Usercontrol 依赖属性 前台后台双向数据绑定
05-15
关于使用MVVM 自定义控件,依赖属性的双向数据绑定方法，自己在网上找了很久很久，各大搜索都找过，最后总结的方法，希望对大家有作用，少走点弯路
WPF用户控件(WPF)UserControl的开发与使用
sryyqx的博客
05-30 2120
在日常开发中,WPF系统中自带的一些控件无法满足开发要求,且在开发过程中,同类型的控件使用的频率较高,需要通过创建用户控件来节省开发时间,简化开发过程,现以Button的开发为例.
WPF 自定义UserControl
flysh05的专栏
06-05 3661
有时候需要按照需求创建自定义的控件，避免重复编码，下面演示如何添加UserConrol，如果在项目中引用创建好的UserControl。
wpf中UserControl制作
weixin_30414155的博客
02-03 532
上篇文章里面说到UserControl主要是现有控件的组合。组合是好组合啊，我随便拖几个控件往页面里面一放，比如我弄个TextBox和一个button往页面里面一方，起个名字就是UserControl了，问题是这个UserControl光能看不能用啊。比如说我在WPF窗体里面要对这个UserControl里面的TextBox赋值或者获取它的值，咋获取？我想点击UserControl里的B...
WPF在MVVM模式中实现为TabControl动态添加标签页
Kyle_Jehring的博客
04-28 2959
WPF在MVVM模式中实现为TabControl动态添加标签页的解决方案
WPF基于图形的TabControl和模式切换
04-08
3. 在TabControl的XAML中，设置ControlTemplate，使其根据ViewModel中的模式属性动态改变显示的UserControl。 4. 添加切换模式的事件处理程序，当用户触发切换时，更新ViewModel的模式属性。 提供的压缩包文件中，...
WPF自定义控件，UserControl的制作与使用过程
07-09
WPF自定义控件，UserControl的制作与使用过程,这个例子采用了详细而且简介的方式讲述了WPF自定义控件的制作及调用的全过程，他适合初学者没制作过又想使用WPF自定义控件的程序员。
在WPF MVVM应用程序中使用IValueConverter选择UserControl / View
04-02
IValueConverter可用于选择一个视图。
爬C初试 掌握WPF入门知识 获取某.aspx类目及控制仪表盘的指向
cao919的专栏Net
11-08 432
WPF初试 获取某.aspx类目及控制仪表盘的指向 附仪表盘和获取某类目源码
WPF 八（ UserControl 与 CustomControl区别总结）
PassionLong的博客
09-03 1029
WPF UserControl 与 CustomControl区别总结
WPF UserControl和ContentControl的区别
点滴进步，当下做起！
03-17 4145
http://stackoverflow.com/questions/18781679/whats-the-difference-betwen-a-usercontrol-and-a-contentcontrol UserControls set themselves as the source to RoutedEvents raised by elements within
WPF UserControl
博客搬往 http://begtostudy.cnblogs.com
07-23 9499
在使用WPF以前,动辄使用自定义控件几乎成了惯性思维,比如需要一个带图片的按钮,但在WPF中此类任务却不需要如此大费周章,因为控件可以嵌套使用以及可以为控件外观打造一套新的样式就可以了.是否需要我们来自定义控件,这需要你考虑目前已有控件的真正逻辑功能而不要局限于外观,如果目前的控件都不能直觉地表达你的想法,那么你可以自己来打造一个控件,否则,也许我们仅仅改变一下目前控件的模板等就可以完成任务.很多人在自定义控件上经常犯的错误是:重复撰写已有的逻辑
WPF【二】基于MVVM模式，通过点击按钮（RadioButton）实现主页面显示不同的UserControl
weixin_44718038的博客
12-08 2076
WPF【二】基于MVVM模式，通过点击按钮（RadioButton）实现主页面显示不同的UserControl
c# --WPF学习之路（三）XAML如何为对象属性赋值
Yyuanyuxin的博客
04-16 1148
如果我们想存一些静态属性在页面上的时候，我们可以使用如下的方式，在描述之后添加Resources属性 上图的代码解释来说，就是创建了一个TestClass类实例，他的实例名为human ，给他的TestClass1属性赋值“Abc1”，text属性赋值为"Abc"。 下面我们来看TestClass类： public class TestClass { public string Name{ get;set; } public string text { get;
WPF中实现MVVM模式的完整应用指南
《Advanced_MVVM_WPF_mvvm_》是一份详尽的指南，它不仅为初学者提供了深入理解MVVM模式在WPF中应用的丰富信息，同时也为有经验的开发者提供了实践中的高级技巧和优化建议。这将有助于开发者构建更加健壮、可维护和可...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值