需要指导将WPF C#代码转换为MVVM

dgjrabp2  于 11个月前  发布在  C#
关注(0)|答案(1)|浏览(120)

我在这里的目标是获得帮助,将这个简单的WPF示例与后面的代码转换为MVVM,这将大大帮助我理解如何在未来做我想做的事情,并为它编写MVVM。
在学习MVVM时,我有一个盲点。理想情况下,我想要一个完整文件的副本(就像我在下面的示例中所做的那样),这样我就可以插入并修改它了。像“将此片段放入您的ViewModel”这样的建议对我没有帮助,因为构建ViewModel作为一个整体是要求的一部分。
如果我没有花太多的时间学习在线教程,我不会要求这种类型的帮助,这与我的直接需求无关。
在这个例子中,用户选择了三个单选按钮之一。根据选中的单选按钮,文本块和标签显示相应的字符串。
MainWindow.xaml

<Window x:Class="VMTest.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:VMTest"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <StackPanel>
            <RadioButton x:Name="rbRed" Content="Red Means Stop" Checked="RbRed_Checked"/>
            <RadioButton x:Name="rbYellow" Content="Yellow Means Go Faster" Checked="RbYellow_Checked"/>
            <RadioButton x:Name="rbGreen" Content="Green Mean Go" Checked="RbGreen_Checked"/>
        </StackPanel>
        <TextBlock x:Name="myTextBlock" Grid.Row="1"/>
        <Label x:Name="myLabel" Grid.Row="2"/>
    </Grid>
</Window>

字符串
MainWindow.xaml.cs

using System.Windows;

namespace VMTest
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        private readonly string LabelString1 = "1234567890";
        private readonly string LabelString2 = "ABCDEFGHIJ";
        private readonly string LabelString3 = "abcdefghij";

        public MainWindow()
        {
            InitializeComponent();
        }

        private void RbRed_Checked(object sender, RoutedEventArgs e)
        {
            myTextBlock.Text = rbRed.Content.ToString();
            myLabel.Content = LabelString1;
        }

        private void RbYellow_Checked(object sender, RoutedEventArgs e)
        {
            myTextBlock.Text = rbYellow.Content.ToString();
            myLabel.Content = LabelString2;
        }

        private void RbGreen_Checked(object sender, RoutedEventArgs e)
        {
            myTextBlock.Text = rbGreen.Content.ToString();
            myLabel.Content = LabelString3;
        }
    }
}

nkhmeac6

nkhmeac61#

1.安装CommunityToolkit.Mvvm NuGet软件包:

Install-Package CommunityToolkit.Mvvm

字符串
它是由Microsoft维护和发布的MVVM工具包,它为您提供了一个标准、自包含一种轻量级类型,它为使用MVVM模式构建现代应用程序提供了一个起始实现。此类类型的一个示例是实现ICommand接口的RelayCommand<T>类。另一个示例是实现INotifyPropertyChangedObservableObject基类接口.
1.删除视图中的事件处理程序,并将其替换为ICommand属性的绑定。同时,将TextBlock绑定到string属性:

<Grid>
     <Grid.RowDefinitions>
         <RowDefinition/>
         <RowDefinition/>
     </Grid.RowDefinitions>
     <StackPanel>
         <RadioButton Content="Red Means Stop" Command="{Binding SelectColorCommand}" CommandParameter="red" GroupName="color"/>
         <RadioButton Content="Yellow Means Go Faster" Command="{Binding SelectColorCommand}" CommandParameter="yellow" GroupName="color"/>
         <RadioButton Content="Green Mean Go" Command="{Binding SelectColorCommand}" CommandParameter="green" GroupName="color"/>
     </StackPanel>
     <TextBlock Grid.Row="1" Text="{Binding Label}"/>
 </Grid>


1.创建在执行命令时设置数据绑定Label属性的视图模型:

public class ViewModel : ObservableObject
 {
     private readonly string LabelString1 = "1234567890";
     private readonly string LabelString2 = "ABCDEFGHIJ";
     private readonly string LabelString3 = "abcdefghij";

     public ViewModel()
     {
         SelectColorCommand = new RelayCommand<object>(SelectColor);
     }

     public RelayCommand<object> SelectColorCommand { get; }

     private void SelectColor(object parameter)
     {
         string color = parameter?.ToString();
         switch (color)
         {
             case "red":
                 Label = LabelString1;
                 break;
             case "yellow":
                 Label = LabelString2;
                 break;
             case "green":
                 Label = LabelString3;
                 break;
         }
     }

     private string _label;
     public string Label
     {
         get { return _label; }
         set { _label = value; OnPropertyChanged(nameof(Label)); }
     }
 }


CommandParameter用于确定选中了哪个RadioButton
1.将视图的DataContext设置为视图模型的示例:

public partial class MainWindow : Window
 {
     public MainWindow()
     {
         InitializeComponent();
         DataContext = new ViewModel();
     }
 }

相关问题