Question

我在WPF中有一个网格，其中包含一个按钮，该按钮可以使用户控件可见。如何使用MVVM模式和/或代码来实现这一点？

Answer 1

在视图模型中，您需要bool属性以获取用户控件的可见性。我们称之为IsUserControlVisible。现在，您需要在视图模型中使用命令将IsUserControlVisible属性设置为true。我们称之为ShowUserControlCommand。

在XAML中，您可以将用户控件的可见性绑定到IsUserControlVisible。在WPF中有一个BooleanToVisibilityConverter，因此我们不必创建自己的转换器。你的XAML看起来像这样。

<Window
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

  <Window.Resources>
    <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
  </Window.Resources>

  <Grid> 
    <Grid.RowDefinitions>
      <RowDefinition Height="50" />
      <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Button Command="{Binding ShowUserControlCommand}">Show</Button>
    <UserControl Grid.Row="1" Visibility="{Binding IsUserControlVisible, Converter={StaticResource BooleanToVisibilityConverter}}" />
  </Grid>
</Window>

我希望这会有所帮助。

Answer 2

以完整的例子介绍如何在MVVM中实现这一点，并附上ICommand接口你的主要应该是这样的

<强> XAML：

    <Window x:Class="WpfApplication3.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525" xmlns:my="clr-namespace:WpfApplication3">
        <Grid>
            <my:UserControl1  Background="Aqua"  Visibility="{Binding ChangeControlVisibility,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Left" Margin="111,66,0,0" x:Name="userControl11" VerticalAlignment="Top" Height="156" Width="195" />
            <Button Content="Button" Height="36" HorizontalAlignment="Left" Margin="36,18,0,0" Name="button1" VerticalAlignment="Top" Width="53"  Command="{Binding  MyButtonClickCommand}" />
        </Grid>
    </Window>

MainWindow.cs

using System;
using System.ComponentModel;
using System.Windows;
using System.Windows.Input;

namespace WpfApplication3
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new MyViewModel(); 
        }
    }
}

<强>视图模型：

    public class MyViewModel : INotifyPropertyChanged
    {
        public MyViewModel()
        {
           _myCommand = new MyCommand(FuncToCall,FuncToEvaluate);
        }

        private ICommand _myCommand;

        public ICommand MyButtonClickCommand
        {
            get { return _myCommand; }
            set { _myCommand = value; }
        }

        private void FuncToCall(object context)
        {
            //this is called when the button is clicked
            //for example
            if (this.ChangeControlVisibility== Visibility.Collapsed)
            {
              this.ChangeControlVisibility = Visibility.Visible;   
            }
            else
            {
              this.ChangeControlVisibility = Visibility.Collapsed;  
            }                
        }

        private bool FuncToEvaluate(object context)
        {            
            return true;
        }

        private Visibility _visibility = Visibility.Visible;

        public Visibility ChangeControlVisibility
        {
            get { return _visibility; }
            set {
                 _visibility = value;
                 this.OnPropertyChanged("ChangeControlVisibility");
            }    
        }

        public event PropertyChangedEventHandler PropertyChanged;

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

<强>命令：

    class MyCommand : ICommand
    {
        public delegate void ICommandOnExecute(object parameter);
        public delegate bool ICommandOnCanExecute(object parameter);
        private ICommandOnExecute _execute;
        private ICommandOnCanExecute _canExecute;

        public bool CanExecute(object parameter)
        {
            return _canExecute.Invoke(parameter);
        }

        public MyCommand(ICommandOnExecute onExecuteMethod, ICommandOnCanExecute onCanExecuteMethod)
        {
        _execute = onExecuteMethod;
        _canExecute = onCanExecuteMethod;
        }

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

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

Answer 3

一般来说，你的viewmodel中有一个布尔标志，它使用适当的转换器绑定到用户控件Visibility。您的viewmodel中有一个命令绑定到按钮的Command属性。该命令的Execute方法切换布尔标志。

编辑：

如果您只需要按钮在表单上显示某些内容，请考虑已经开箱即用的Expander control。

<Expander>
   <YourUserControl/>
</Expander>

使用按钮使用MVVM模式使用户控件在WPF中可见

3 个答案: