南岸网站建设哪家好,wordpress留言版添加,微信app制作,站长工具seo诊断文章目录 1、项目创建2、UI界面布局1. MainWindow.xaml2、颜色转换器实现2.MainViewModel.cs 代码实现 3、运行效果4.源代码下载 1、项目创建
打开 VS2022 #xff0c;新建项目 Wpf_Examples#xff0c;创建各层级文件夹#xff0c;安装 CommunityToolkit.Mvvm 和 Microsof… 文章目录 1、项目创建2、UI界面布局1. MainWindow.xaml2、颜色转换器实现2.MainViewModel.cs 代码实现 3、运行效果4.源代码下载 1、项目创建
打开 VS2022 新建项目 Wpf_Examples创建各层级文件夹安装 CommunityToolkit.Mvvm 和 Microsoft.Extensions.DependencyInjectio NuGet包,完成MVVM框架搭建。搭建完成后项目层次如下图所示 这里如何实现 MVVM 框架可以参考本人 像 MvvmLight 一样使用 CommunityToolkit.Mvvm 工具包 的文章
2、UI界面布局
1. MainWindow.xaml
Window x:ClassWpf_Examples.MainWindowxmlnshttp://schemas.microsoft.com/winfx/2006/xaml/presentationxmlns:xhttp://schemas.microsoft.com/winfx/2006/xamlxmlns:dhttp://schemas.microsoft.com/expression/blend/2008xmlns:mchttp://schemas.openxmlformats.org/markup-compatibility/2006xmlns:converterclr-namespace:Wpf_Examples.Convertersxmlns:localclr-namespace:Wpf_ExamplesDataContext{Binding Source{StaticResource Locator},PathMain}mc:IgnorabledTitleMainWindow Height450 Width800Window.Resourcesconverter:StatusToColorConverter x:KeyStatusToColorConverter//Window.ResourcesGridGridGrid.ColumnDefinitionsColumnDefinition/ColumnDefinition/ColumnDefinition//Grid.ColumnDefinitionsStackPanel OrientationHorizontal VerticalAlignmentCenter HorizontalAlignmentRightTextBlock Text网络 FontSize16 ForegroundDarkGray Margin0 0 20 0/Ellipse Width20 Height20 Fill{Binding NetStatusValue, Converter{StaticResource StatusToColorConverter}}//StackPanelStackPanel Grid.Column1 OrientationHorizontal VerticalAlignmentCenter HorizontalAlignmentCenterTextBlock TextPLC FontSize16 ForegroundDarkGray Margin0 0 20 0/Ellipse Width20 Height20 Fill{Binding PLCStatusValue, Converter{StaticResource StatusToColorConverter}}//StackPanelStackPanel Grid.Column2 OrientationHorizontal VerticalAlignmentCenter HorizontalAlignmentLeftTextBlock Text相机 FontSize16 ForegroundDarkGray Margin0 0 20 0/Ellipse Width20 Height20 Fill{Binding DevStatusValue, Converter{StaticResource StatusToColorConverter}}//StackPanel/Grid/Grid
/Window
界面效果如下
2、颜色转换器实现
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Data;
using System.Windows.Media;namespace Wpf_Examples.Converters
{public class StatusToColorConverter : IValueConverter{public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture){if (value is int statusValue){switch (statusValue){case 0:return Brushes.Red;case 1:return #E5D21C;case 2:return Brushes.Green;default:return Brushes.Green; // 默认颜色}}return Brushes.Gray;}public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture){throw new NotImplementedException();}}
}
2.MainViewModel.cs 代码实现
代码如下示例
using CommunityToolkit.Mvvm.ComponentModel;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Threading;namespace Wpf_Examples.ViewModels
{public class MainViewModel:ObservableObject{/// summary/// 网络状态按钮名称/// /summaryprivate int netStatusValue 2;public int NetStatusValue{get { return netStatusValue; }set { SetProperty(ref netStatusValue, value); }}/// summary/// PLC状态按钮名称/// /summaryprivate int plcStatusValue 1;public int PLCStatusValue{get { return plcStatusValue; }set { SetProperty(ref plcStatusValue, value); }}/// summary/// 设备状态/// /summaryprivate int devStatusValue 0;public int DevStatusValue{get { return devStatusValue; }set { SetProperty(ref devStatusValue, value); }}public MainViewModel(){CreateTimer();}private void CreateTimer(){#region 每秒定时器服务DispatcherTimer cpuTimer new DispatcherTimer{Interval new TimeSpan(0, 0, 0, 3, 0)};cpuTimer.Tick DispatcherTimer_Tick;cpuTimer.Start();#endregion}private void DispatcherTimer_Tick(object sender, EventArgs e){DevStatusValueStatusChange(DevStatusValue);NetStatusValueStatusChange(NetStatusValue);PLCStatusValueStatusChange(PLCStatusValue);}private int StatusChange(int value){int outVal 0;//状态变化if (value 0){outVal 1;}else if (value 1){outVal 2;}else{outVal 0;}return outVal;}}
}
3、运行效果 4.源代码下载
CSDN下载链接WPFMVVM案例实战-设备状态LED灯变化实现
