WPF使用ItemsControl显示Object的所有属性值

已于 2024-05-13 09:27:51 修改
阅读量360 收藏 7
点赞数 3
文章标签： wpf
于 2024-05-13 09:06:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lishuangquan1987/article/details/138783199
版权

对于上位机开发，我们有时候有这样的需求：如何显示所有的IO点位？比如有10个IO点位，那我们要写10个TextBlock去绑定这10个点位的属性（本文暂时不考虑显示的样式，当然也可以考虑），当点位变成了20个，我们要再加10TextBlock去显示。
那么有没有一种方法，直接显示这个Object的所有属性的值，当值发生变化，自动更新界面呢？这个需求不就类似于PropertyGrid吗？但是我不想用PropertyGrid，我们使用ItemsControl去简单的实现一下。

定义要显示的IO点位

public class IOInfo : BindableBase
    {
        public IOInfo()
        {

        }
        private bool workLed1;
        public bool WorkLed1
        {
            get { return workLed1; }
            set { workLed1 = value; this.RaisePropertyChanged(nameof(WorkLed1)); }
        }

        private bool workLed2;
        public bool WorkLed2
        {
            get { return workLed2; }
            set { workLed2 = value; this.RaisePropertyChanged(nameof(WorkLed2)); }
        }

        private bool protectOn;
        public bool ProtectOn
        {
            get { return protectOn; }
            set { protectOn = value; this.RaisePropertyChanged(nameof(ProtectOn)); }
        }

        private bool pin1Status;
        public bool Pin1Status
        {
            get { return pin1Status; }
            set { pin1Status = value; this.RaisePropertyChanged(nameof(Pin1Status)); }
        }

        private bool pin2Status;
        public bool Pin2Status
        {
            get { return pin2Status; }
            set { pin2Status = value; this.RaisePropertyChanged(nameof(Pin2Status)); }
        }


        private bool cylinder1;
        public bool Cylinder1
        {
            get { return cylinder1; }
            set { cylinder1 = value; this.RaisePropertyChanged(nameof(Cylinder1)); }
        }

        private bool cylinder2;
        public bool Cylinder2
        {
            get { return cylinder2; }
            set { cylinder2 = value; this.RaisePropertyChanged(nameof(Cylinder2)); }
        }

        private bool bj;
        public bool BJ
        {
            get { return bj; }
            set { bj = value; this.RaisePropertyChanged(nameof(BJ)); }
        }

        private bool upSensor1;
        public bool UpSensor1
        {
            get { return upSensor1; }
            set { upSensor1 = value; this.RaisePropertyChanged(nameof(UpSensor1)); }
        }

        private bool upSensor2;
        public bool UpSensor2
        {
            get { return upSensor2; }
            set { upSensor2 = value; this.RaisePropertyChanged(nameof(UpSensor2)); }
        }

        private bool airPressure;
        public bool AirPressure
        {
            get { return airPressure; }
            set { airPressure = value; this.RaisePropertyChanged(nameof(AirPressure)); }
        }

        private bool doorStatus;
        public bool DoorStatus
        {
            get { return doorStatus; }
            set { doorStatus = value; this.RaisePropertyChanged(nameof(DoorStatus)); }
        }


        private bool smokeStatus;
        public bool SmokeStatus
        {
            get { return smokeStatus; }
            set { smokeStatus = value; this.RaisePropertyChanged(nameof(SmokeStatus)); }
        }

        private bool tempStatus;
        public bool TempStatus
        {
            get { return tempStatus; }
            set { tempStatus = value; this.RaisePropertyChanged(nameof(TempStatus)); }
        }

        private bool remoteStatus;
        public bool RemoteStatus
        {
            get { return remoteStatus; }
            set { remoteStatus = value; this.RaisePropertyChanged(nameof(RemoteStatus)); }
        }

        private bool trayStatus;
        public bool TrayStatus
        {
            get { return trayStatus; }
            set { trayStatus = value; this.RaisePropertyChanged(nameof(TrayStatus)); }
        }

        private bool startStatus;
        public bool StartStatus
        {
            get { return startStatus; }
            set { startStatus = value; this.RaisePropertyChanged(nameof(StartStatus)); }
        }

        private bool powerStatus;
        public bool PowerStatus
        {
            get { return powerStatus; }
            set { powerStatus = value; this.RaisePropertyChanged(nameof(PowerStatus)); }
        }

        private bool emergencyStatus;
        public bool EmergencyStatus
        {
            get { return emergencyStatus; }
            set { emergencyStatus = value; this.RaisePropertyChanged(nameof(EmergencyStatus)); }
        }

        private bool errTrace;
        public bool ErrorTrace
        {
            get { return errTrace; }
            set { errTrace = value; this.RaisePropertyChanged(nameof(ErrorTrace)); }
        }

    }

上述的BindableBase是引用了Prism框架

定义转换器

无论是ItemsControl还是PropertyGrid最终显示到界面的时候，都是一个集合。我们需要把object使用转换器转换为集合，转换为集合之前，首先定义ItemsControl要显示的Model:

public class PropertyAndValue : BindableBase
    {
        private string propertyName;
        /// <summary>
        /// 属性名称
        /// </summary>
        public string PropertyName
        {
            get { return propertyName; }
            set { propertyName = value; this.RaisePropertyChanged(nameof(PropertyName)); }
        }

        private string propertyNameAlias;
        /// <summary>
        /// 显示的别名，如果没有定义，则和属性名称一致
        /// </summary>
        public string PropertyNameAlias
        {
            get { return propertyNameAlias; }
            set { propertyNameAlias = value; this.RaisePropertyChanged(nameof(PropertyNameAlias)); }
        }


        private object propertyValue;
        /// <summary>
        /// 属性的值
        /// </summary>
        public object PropertyValue
        {
            get { return propertyValue; }
            set { propertyValue = value; this.RaisePropertyChanged(nameof(PropertyValue)); }
        }
    }

将转换器转换为Model的集合，这里重点要思考的是，IOInfo的属性变化，如何去更新界面，我采用简单粗暴的方式是手动订阅PropertyChanged事件:

public class IOStatusConverter : IValueConverter
    {
        private List<PropertyAndValue> values = new List<PropertyAndValue>();
        private IOInfo ioInfo = null;
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value == null || !(value is IOInfo ioInfo)) return value;

            ioInfo.PropertyChanged += IoInfo_PropertyChanged;

            foreach (var property in typeof(IOInfo).GetProperties())
            {
                values.Add(new PropertyAndValue() { PropertyName = property.Name, PropertyNameAlias = property.Name, PropertyValue = property.GetValue(ioInfo) }); 
            }

            return values;
        }

        private void IoInfo_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
        {
            var v = values.FirstOrDefault(x => x.PropertyName == e.PropertyName);
            if (v == null) return;



            var property = typeof(IOInfo).GetProperty(e.PropertyName);
            if (property == null) return;

            v.PropertyValue = property.GetValue(sender);
        }
        

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return Binding.DoNothing;
        }
    }

前台界面绑定

xaml的代码如下：

<ItemsControl Grid.Row="1" ItemsSource="{Binding IO,Converter={StaticResource IOStatusConverter}}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding PropertyName}" />
                <TextBlock Text=":" />
                <TextBlock Text="{Binding PropertyValue}" />
            </StackPanel>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

最终实现的效果

在这里插入图片描述
点击上方的修改按钮，它能更新界面的属性值。

改进

属性名称显示别名

要显示别名，我们要经过3个步骤。

  • 获取要显示的别名
  • 将别名赋值到PropertyNameAlias属性
  • 将PropertyNameAlias绑定到界面

我们使用DescriptionAttribute标签来实现别名，更改后的IOInfo类如下：

public class IOInfo : BindableBase
    {
        public IOInfo()
        {

        }
        private bool workLed1;
        [Description("灯1")]
        public bool WorkLed1
        {
            get { return workLed1; }
            set { workLed1 = value; this.RaisePropertyChanged(nameof(WorkLed1)); }
        }

        private bool workLed2;
        [Description("灯2")]
        public bool WorkLed2
        {
            get { return workLed2; }
            set { workLed2 = value; this.RaisePropertyChanged(nameof(WorkLed2)); }
        }

        private bool protectOn;
        public bool ProtectOn
        {
            get { return protectOn; }
            set { protectOn = value; this.RaisePropertyChanged(nameof(ProtectOn)); }
        }

        private bool pin1Status;
        public bool Pin1Status
        {
            get { return pin1Status; }
            set { pin1Status = value; this.RaisePropertyChanged(nameof(Pin1Status)); }
        }

        private bool pin2Status;
        public bool Pin2Status
        {
            get { return pin2Status; }
            set { pin2Status = value; this.RaisePropertyChanged(nameof(Pin2Status)); }
        }


        private bool cylinder1;
        public bool Cylinder1
        {
            get { return cylinder1; }
            set { cylinder1 = value; this.RaisePropertyChanged(nameof(Cylinder1)); }
        }

        private bool cylinder2;
        public bool Cylinder2
        {
            get { return cylinder2; }
            set { cylinder2 = value; this.RaisePropertyChanged(nameof(Cylinder2)); }
        }

        private bool bj;
        public bool BJ
        {
            get { return bj; }
            set { bj = value; this.RaisePropertyChanged(nameof(BJ)); }
        }

        private bool upSensor1;
        public bool UpSensor1
        {
            get { return upSensor1; }
            set { upSensor1 = value; this.RaisePropertyChanged(nameof(UpSensor1)); }
        }

        private bool upSensor2;
        public bool UpSensor2
        {
            get { return upSensor2; }
            set { upSensor2 = value; this.RaisePropertyChanged(nameof(UpSensor2)); }
        }

        private bool airPressure;
        public bool AirPressure
        {
            get { return airPressure; }
            set { airPressure = value; this.RaisePropertyChanged(nameof(AirPressure)); }
        }

        private bool doorStatus;
        public bool DoorStatus
        {
            get { return doorStatus; }
            set { doorStatus = value; this.RaisePropertyChanged(nameof(DoorStatus)); }
        }


        private bool smokeStatus;
        public bool SmokeStatus
        {
            get { return smokeStatus; }
            set { smokeStatus = value; this.RaisePropertyChanged(nameof(SmokeStatus)); }
        }

        private bool tempStatus;
        public bool TempStatus
        {
            get { return tempStatus; }
            set { tempStatus = value; this.RaisePropertyChanged(nameof(TempStatus)); }
        }

        private bool remoteStatus;
        public bool RemoteStatus
        {
            get { return remoteStatus; }
            set { remoteStatus = value; this.RaisePropertyChanged(nameof(RemoteStatus)); }
        }

        private bool trayStatus;
        public bool TrayStatus
        {
            get { return trayStatus; }
            set { trayStatus = value; this.RaisePropertyChanged(nameof(TrayStatus)); }
        }

        private bool startStatus;
        public bool StartStatus
        {
            get { return startStatus; }
            set { startStatus = value; this.RaisePropertyChanged(nameof(StartStatus)); }
        }

        private bool powerStatus;
        public bool PowerStatus
        {
            get { return powerStatus; }
            set { powerStatus = value; this.RaisePropertyChanged(nameof(PowerStatus)); }
        }

        private bool emergencyStatus;
        public bool EmergencyStatus
        {
            get { return emergencyStatus; }
            set { emergencyStatus = value; this.RaisePropertyChanged(nameof(EmergencyStatus)); }
        }

        private bool errTrace;
        public bool ErrorTrace
        {
            get { return errTrace; }
            set { errTrace = value; this.RaisePropertyChanged(nameof(ErrorTrace)); }
        }

    }

我们在WorkLed1和WorkLed2这两个属性上打了两个标签，界面显示的时候，我们希望显示我们打上的标签的值。
现在我们把转换器修改下：

public class IOStatusConverter : IValueConverter
    {
        private List<PropertyAndValue> values = new List<PropertyAndValue>();
        private IOInfo ioInfo = null;
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value == null || !(value is IOInfo ioInfo)) return value;

            ioInfo.PropertyChanged += IoInfo_PropertyChanged;

            foreach (var property in typeof(IOInfo).GetProperties())
            {
                var propertyName=property.Name;

                var propertyNameAlias = property.GetCustomAttribute<DescriptionAttribute>()?.Description ?? propertyName;

                values.Add(new PropertyAndValue() { PropertyName = propertyName, PropertyNameAlias = propertyNameAlias, PropertyValue = property.GetValue(ioInfo) }); 
            }

            return values;
        }

        private void IoInfo_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
        {
            var v = values.FirstOrDefault(x => x.PropertyName == e.PropertyName);
            if (v == null) return;



            var property = typeof(IOInfo).GetProperty(e.PropertyName);
            if (property == null) return;

            v.PropertyValue = property.GetValue(sender);
        }
        

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return Binding.DoNothing;
        }
    }

界面显示绑定修改绑定到PropertyNameAlias属性：

<ItemsControl Grid.Row="1" ItemsSource="{Binding IO, Converter={StaticResource IOStatusConverter}}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding PropertyNameAlias}" />
                <TextBlock Text=":" />
                <TextBlock Text="{Binding PropertyValue}" />
            </StackPanel>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

最后的显示效果：
在这里插入图片描述

转换器的改进

通用转换器:

public class ObjectToListBaseConverter<T> : IValueConverter where T:INotifyPropertyChanged
    {
        private List<PropertyAndValue> values = new List<PropertyAndValue>();
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            if (value == null || !(value is T obj)) return value;//如果不是T的类型，则返回

            obj.PropertyChanged += Obj_PropertyChanged;

            foreach (var property in typeof(IOInfo).GetProperties())
            {
                var propertyName = property.Name;

                var propertyNameAlias = property.GetCustomAttribute<DescriptionAttribute>()?.Description ?? propertyName;

                values.Add(new PropertyAndValue() { PropertyName = propertyName, PropertyNameAlias = propertyNameAlias, PropertyValue = property.GetValue(obj) });
            }

            return values;
        }

        private void Obj_PropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            var v = values.FirstOrDefault(x => x.PropertyName == e.PropertyName);
            if (v == null) return;

            var property = typeof(T).GetProperty(e.PropertyName);
            if (property == null) return;

            v.PropertyValue = property.GetValue(sender);
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return Binding.DoNothing;
        }
    }

IOStatusConverter修改如下,做到了代码的通用：

public class IOStatusConverter : ObjectToListBaseConverter<IOInfo>
{
    
}
lishuangquan1987
关注
  • 3
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
WPF中ItemsControl的异步加载
04-09
WPF的ItemsControl的ItemsSource的异步加载，引用程序集，使用依赖项属性，可以异步加载。
WPF ItemsControl：-在运行时更改ItemsControl的ItemSource属性后，更改ItemControle中的项目属性
04-05
我有以下方案：我使用了一个ItemsControl。根据给它的ItemsSource生成了哪个Button？现在，当我按下nextButton时。ItemsControl（pageControl）的ItemsSource发生了变化。 chagne的按钮背景...
SelectedItemsBindingDemo:如何将WPF中ItemsControl的SelectedItems属性绑定到ViewModel的示例
04-30
SelectedItemsBindingDemo 如何将WPF中ItemsControl的SelectedItems属性绑定到ViewModel的示例
WPF ListBox等ItemsControl交替（Alternation）变化效果
yan_yu_lv_ji的博客
12-04 741
最近遇到一个需求，就是让表格等控件的内容显示交替变化。交替变化的内容，有利于缓解用户的视觉疲劳，个人感觉是一个很好的需求，要怎么实现呢？先看看效果吧！ AlternationCount 属性指定了ItemsControl按AlternationCount 值轮换数量。如果这个值是2，那么内容（Item）相关每两个交替变化；如果这个值是3，则每三个交替变化； 2.Xaml.cs 总结 总之，时显示方式就是ItemsControl的AlternationCount 属性搭配Trigger。另外，MSDN官方示
WPF基础四：UI的相关类 (5)ItemsControl类
hd51cc的博客
04-05 863
2.5条目控件 2.5.1 ContextMenu 2.5.2 ComboBox 2.5.3 DataGrid 2.5.4 ItemsControl 2.5.5 ListBox 2.5.6 ListView 2.5.7 MenuBase 2.5.8 Menu 2.5.9 Selector 2.5.10 TabControl 2.5.11 TreeView
【wpf】ItemsControl 的Binding 小技巧
songhuangong123的博客
03-01 1603
ItemsControl 非常常用和好用的控件，我经常将之用于配置界面！ 比如这么一个配置界面： 整体是一个ItemsControl，每个子界面就是其中的一个Item。 ItemsControl 的ItemsSource 绑定到ParameterInfo 的集合 public ObservableCollection<ParameterInfo> configInfos { get; set; } = new ObservableCollection<Paramete
WPF中继承ItemsControl子类控件数据模板获取选中属性
关关长语
03-30 578
WPF中继承ItemsControl子类控件数据模板获取选中属性实现部分逻辑思路
WPF中ItemsControl应用虚拟化时找到子元素的方法
01-23
参考：http://blog.csdn.net/muzizongheng/article/details/42141755
wpf用户组件创建依赖属性demo
02-17
wpf用户组件创建依赖属性demo
WPF 自定义ItemsControl/ListBox/ListView控件样式
weixin_33809981的博客
04-07 298
一、前言 ItemsControl、ListBox、ListView这三种控件在WPF中都可作为列表信息展示控件。我们可以通过修改这三个控件的样式来展示我们的列表信息。 既然都是展示列表信息的控件，那他们有什么相同点和不同点呢。 同： 　　1、这三个控件都是列表型控件，可以进行列表绑定（ItemsSource）； 　　2、这三个控件均使用ItemsPresenter来展示列表信息； 异...
WPF中如何为ItemsControl添加ScrollViewer并显示ScrollBar
weixin_30497527的博客
06-02 3101
今天在开发的过程中突然碰到了一个问题，本来的意图是想当ItemsControl中加载的Item达到一定数量时，会出现ScrollViewer并出现垂直的滚动条，但是实际上并不能够达成目标，对于熟手来说这个问题非常简单，但是如果不了解WPF的模板的原理，可能并不清楚这些，这里举出一个例子来论证。 <Window x:Class="TestItemsControl.MainWind...
WPF快速学习入门（9.依赖属性）
没有黑科技
05-27 369
WPF（Windows Presentation Foundation）是一种用于构建桌面应用程序的UI框架。在WPF中，依赖属性是一种特殊的属性类型，它允许我们在不修改类定义的情况下，为控件添加新功能或扩展现有功能。本文将介绍依赖属性的概念、用途以及如何在实际项目中使用它们。
WPF/C#：理解与实现WPF中的MVVM模式
mingupup的博客
05-28 844
本文介绍了WPF中的MVVM模式，希望对正在学习WPF中的MVVM模式的同学有所帮助。
WPF WebBrowser控件解析 HTML
weixin_45381071的博客
05-27 357
【代码】WPF WebBrowser控件解析 HTML。
WPF Binding对象
最新发布
u013400314的博客
05-31 84
控件对象，直接操作数据源，系统会自动监听数据源的变化实时的更新到控件上，相反的，用户改变控件的值，也会实时更新到后台数据源，这也就是我们之前所说的，WPF天生支持MVVM模式。在WPF中，微软引入了Binding对象，通过Binding，我们可以直接将控件与数据做绑定，在后台不用。控件对象进行操作，这种赋值形式，从根本上是无法实现界面与逻辑分离的。在WinForm中，我们要想对控件赋值，需要在后台代码中。
WPF实现简单的3D图形
weixin_48083386的博客
05-28 227
它不支持完整的3D游戏开发，但在某种程度上，您可以创建3D图形。通过组合 2D 和 3D 图形，您还可以创建丰富的控件、提供复杂的数据插图或增强应用程序界面的用户体验。“视口3D”元素将 3D 模型托管到我们的 WPF 应用程序中。以下 XAML 代码创建一个 3D 对象和一个滑块。在滑块的帮助下，您可以旋转此 3D 对象。以下 XAML 代码演示如何使用 3D 几何图形创建 2D 对象。运行应用程序时，它将在窗口上生成一个 3D 对象和一个滑块。当您编译并执行上述代码时，它将在3D中生成2D对象。
WPF 如何调试
weixin_48083386的博客
05-28 961
如果您使用的是 Visual Studio 的较旧选项，则无法使用此工具，但是还有另一个可以与 Visual Studio 集成的工具，例如 XAML Spy for Visual Studio .如果它不工作，然后检查什么是错的。在这些工具的帮助下，XAML 代码以正在运行的 WPF 应用程序的可视化树以及树中不同的 UI 元素属性的形式呈现。两个文本块的文本属性被静态设置为“姓名”和“职务”，而其他两个文本块的文本属性绑定到“名字”和“职务”，但类变量是 Employee 类中的名称和职务，如下所示。
WPF 布局的原理
u013400314的博客
05-30 255
控件的最终大小和位置是由该控件和父控件共同完成的，父控件会先给子控件提供可用大小（MeasureOverride中availableSize参数），子控件再反馈给父控件一个自己的期望值（DesiredSize），父控件最后根据自己所拥有的空间大小与子控件期望的值分配一定的空间给子控件并返回自己的大小。这个过程是通过MeasureOverride和ArrangeOverride这两个方法共同完成的，这里需要注意：父控件的availableSize是减去Margin、Padding等的值。: base()
WPF 中ItemsControl令显示内容水平居中
06-07
在 WPF 中，可以通过设置 ItemsControl 的 ItemContainerStyle 属性来使其显示内容水平居中。具体步骤如下： 1. 在 ItemsControl 中定义 ItemContainerStyle 属性，并设置为一个 Style 对象。 2. 在 Style 对象中...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值