在ViewModel

时间:2017-06-08 14:03:55

标签: wpf mvvm viewmodel

视图:我有UserControl,它有一个TextBox和一个Label。当"输入"键已关闭,我希望使用文本框中的值更新Label。为了这个例子,我创建了一个CarUserControl。我将在MainWindow的ItemsControl中托管这些列表。

模特:我有班车,这将是模特。

ViewModel:我没有CarUserControl和Car的ViewModel。我有一个用于MainWindow - 我们称之为MainViewModel。

我可以将从各个用户控件传播的命令传递给MainViewModel,但是我不确定从MainViewModel中的文本框中获取值吗?

以下是我在网上看到的有关MVVM的一些假设(有些消息来源说假设是错误的。)

1] Usercontrols不应该有ViewModel。

2] Usercontrols只应公开依赖项属性,而不公开INotifyChanged或事件的公共属性。

所以,问题是,如何更新标签,并访问MainViewModel中的TextBox值。

这是测试代码:

----- ---- CarUserControl.xaml

<UserControl x:Class="TestMVVM.CarUserControl"
             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:TestMVVM"
             mc:Ignorable="d" 
             d:DesignHeight="50" d:DesignWidth="300" x:Name="thisUC">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Label Grid.Column="0">--</Label>
        <TextBox Grid.Column="1" Background="#FFE8D3D3" BorderThickness="0">
            <TextBox.InputBindings>
                <KeyBinding Key="Enter" 
                                Command="{Binding KeyDownCommand, ElementName=thisUC}" 
                                CommandParameter="{Binding}"/>
            </TextBox.InputBindings>
        </TextBox>
    </Grid>
</UserControl>

- - - - - - - - CarUserControl.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 TestMVVM
{
    /// <summary>
    /// Interaction logic for CarUserControl.xaml
    /// The Usercontrol
    /// </summary>
    public partial class CarUserControl : UserControl
    {
        private static readonly DependencyProperty StrValueProperty = DependencyProperty.Register("StrValue", typeof(float), typeof(CarUserControl), new PropertyMetadata(null));
        private static readonly DependencyProperty KeyDownCommandProperty = DependencyProperty.Register("KeyDownCommand", typeof(ICommand), typeof(CarUserControl), new PropertyMetadata(null)); //Enter key down in the text box

        public CarUserControl()
        {
            InitializeComponent();
        }

        public string StrValue
        {
            get { return (string)GetValue(StrValueProperty); }
            set { SetValue(StrValueProperty, value); }
        }

        /// <summary>
        /// "Enter" key down
        /// </summary>
        public ICommand KeyDownCommand
        {
            get { return (ICommand)GetValue(KeyDownCommandProperty); }
            set { SetValue(KeyDownCommandProperty, value); }
        }


    }
}

// ---模型 - Car.cs

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

namespace TestMVVM
{
    /// <summary>
    /// A simple model
    /// </summary>
    class Car : INotifyPropertyChanged
    {
        public Car(string name) {
            this.name = name;
        }

        private string name;
        public event PropertyChangedEventHandler PropertyChanged;

        public string Name
        {
            get { return name; }
            set
            {
                name = value;
                OnPropertyChanged("Name");
            }
        }
        public void OnPropertyChanged(string name)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(name));
            }
        }

    }
}

-----主视图模型---

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

namespace TestMVVM
{
    /// <summary>
    /// The Main View Model
    /// </summary>
    class MainViewModel : INotifyPropertyChanged
    {
        /// <summary>
        /// The main view model
        /// </summary>
        public MainViewModel()
        {
            //Create some test data
            cars = new ObservableCollection<Car>();
            cars.Add(new Car("Audi"));
            cars.Add(new Car("Toyota"));
            cars.Add(new Car("Subaru"));
            cars.Add(new Car("Volvo"));
        }

        public event PropertyChangedEventHandler PropertyChanged;
        private ObservableCollection<Car> cars; //List of tensioner spools
        private ICommand enterDownCommand;

        public ObservableCollection<Car> Cars
        {
            get { return cars; }
            set
            {
                cars = value;
                OnPropertyChanged("Cars");
            }
        }

        public ICommand EnterDownCommand
        {
            get
            {
                if (enterDownCommand == null)
                {
                    enterDownCommand = new RelayMCommand<Car>(OnEnterDownCommand);
                }
                return enterDownCommand;
            }
        }

        /// <summary>
        /// Called when "Enter" key is down. 
        /// </summary>
        /// <param name="obj"></param>
        private void OnEnterDownCommand(Car obj)
        {
            //How do I get the text box value here?
            Console.Write(">>"+obj.Name);
        }

        public void OnPropertyChanged(string name)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(name));
            }
        }
    }
}

- - - - 主窗口---

  <Window x:Class="TestMVVM.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:TestMVVM"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Window.DataContext>
        <local:MainViewModel x:Name ="MainVM"/>
    </Window.DataContext>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <Viewbox>
                <ItemsControl ItemsSource="{Binding Cars}" Margin="5" Width="200">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <local:CarUserControl Margin="5"
                                                  KeyDownCommand="{Binding Path=DataContext.EnterDownCommand, RelativeSource={RelativeSource AncestorType=ItemsControl}}"/>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Vertical" IsItemsHost="True" />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                </ItemsControl>
            </Viewbox>
        </Grid>
    </Grid>

</Window>

---接力命令---

   using System;
using System.Threading;
using System.Windows.Input;

namespace TestMVVM
{
    /// <summary>
    /// Same as the Relay Command, except this handles an array of generic type <T>
    /// </summary>
    /// <typeparam name="T">Generic type parameter</typeparam>
    public class RelayMCommand<T> : ICommand
    {
        private Predicate<T> _canExecute;
        private Action<T> _execute;

        public RelayMCommand(Action<T> execute, Predicate<T> canExecute = null)
        {
            _execute = execute;
            _canExecute = canExecute;
        }

        private void Execute(T parameter)
        {
            _execute(parameter);
        }

        private bool CanExecute(T parameter)
        {
            return _canExecute == null ? true : _canExecute(parameter);
        }

        public bool CanExecute(object parameter)
        {
            return parameter == null ? false : CanExecute((T)parameter);
        }

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

        public event EventHandler CanExecuteChanged;

        public void RaiseCanExecuteChanged()
        {
            var temp = Volatile.Read(ref CanExecuteChanged);
            if (temp != null)
            {
                temp(this, new EventArgs());
            }
        }
    }
}

1 个答案:

答案 0 :(得分:1)

UserControl可以从父窗口或DataContext中的当前项继承其ItemsControl

因此,如果您将ItemsControl绑定到IEnumerable<Car>CarUserControl的每个实例都可以直接绑定到相应Name对象的Car属性:

<TextBox Text="{Binding Name}" 
            Grid.Column="1" Background="#FFE8D3D3" BorderThickness="0">
    <TextBox.InputBindings>
        <KeyBinding Key="Enter" 
                    Command="{Binding KeyDownCommand, ElementName=thisUC}" 
                    CommandParameter="{Binding}"/>
    </TextBox.InputBindings>
</TextBox>

这是因为UserControl会自动从其父元素继承DataContext,这是Car中对应的ItemsControl对象。