从 C# WPF 中的用户控件更改图像可见性

Question

我正在编写一个应用程序，它是一个测验，我有一个主 Window，我在其中加载不同的 UserControls（页面）。所以我的问题是我在 MainWindow 上有一张图片，我想将这张图片的 Visibility 从 Collapsed 更改为 Visible 从 UserControls 但运气不好...

这是我的 MainWindow:

<Window x:Class="MuseonQuiz_v3.PageSwitcher"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:pages="clr-namespace:MuseonQuiz_v3.Pages"
    xmlns:k="http://schemas.microsoft.com/kinect/2013"
    Title="MainWindow" Height="710" Width="1127" IsEnabled="True" DataContext="{Binding}" FontFamily="KaiTi" ResizeMode="NoResize" WindowStyle="None"
     WindowStartupLocation="CenterScreen" WindowState="Maximized">


<Grid>         
    <Grid>            
        <k:KinectRegion Name="kinectRegion">
            <ContentControl x:Name="mainContentControl"/>
        </k:KinectRegion>
    </Grid>
    <Grid>
        <Grid.Resources>
            <BooleanToVisibilityConverter x:Key="BoolToVisConverter" />
        </Grid.Resources>

        <k:KinectSensorChooserUI HorizontalAlignment="Center" VerticalAlignment="Top" Name="sensorChooserUi" />
        <k:KinectUserViewer VerticalAlignment="Bottom" HorizontalAlignment="Center" k:KinectRegion.KinectRegion="{Binding ElementName=kinectRegion}" Height="600" Width="600" />
        <Image Name="colorStreamImage" Width="640" Height="480" Visibility="Collapsed" HorizontalAlignment="Center" />
    </Grid>
</Grid>

这是我的 UserControl:

public partial class Selectie : UserControl, ISwitchable
{
    string backgroundSelectie = "pack://application:,,,/MuseonQuiz_v3;component/Images/Selectie/selectie_background.jpg";

    public Selectie()
    {
        InitializeComponent();
        selectieBackground();
        animatieButtons();
    }

    #region ISwitchable Members
    public void UtilizeState(object state)
    {
        throw new NotImplementedException();
    }

    #endregion
}

我的问题是...如何更改位于 MainWindow 中的 colorStreamImage 的 Visibility 从 UserControl... 我有尝试制作 MainWindow 的实例，但这不起作用，也许我必须使用一些绑定，但我不确定，非常感谢您提供的任何帮助！

Answer 1

如Clemens mentioned, your best bet is to go down the MVVM path. This is a good tutorial to get started In the Box – MVVM Training.

首先，您可以创建一个实现 INotifyPropertyChanged 的视图模型。在这种情况下，您可能希望它至少具有一个属性类型的可见性。

public class MainViewModel : INotifyPropertyChanged
{
    private Visibility _imageVisibility;
    public Visibility ImageVisibility
    {
        get { return _imageVisibility; }
        set { _imageVisibility = value; OnPropertyChanged("ImageVisibility"); }
    }

    private BitmapImage _imageSource;
    public BitmapImage ImageSource{...}

    #region INotifyPropertyChanged Members
    public event PropertyChangedEventHandler PropertyChanged;
    #endregion

    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChangedEventHandler eventHandler = PropertyChanged;
        if (eventHandler != null)
            eventHandler(this, new PropertyChangedEventArgs(propertyName));
    }
}

现在您需要将此视图模型设置为主 window 上的数据上下文。为此，Paul Stovell 对不同的方法有很好的 post：http://paulstovell.com/blog/mvvm-instantiation-approaches。一旦我们在主 window 上设置它，Selectie 元素将继承数据上下文。使用最简单的方法：

public MainWindow()
{
    InitializeComponent();

    this.DataContext = new MainViewModel();
}

您的图像元素可能会像这样绑定到属性：

<Image Visibility="{Binding ImageVisibility, UpdateSourceTrigger=PropertyChanged}" Source="{Binding ImageSource}" Height="200" Width="200"></Image>

Selectie 元素现在可以更改视图模型上的 ImageVisbility 属性，因为它与 MainWindow 共享相同的数据上下文。（我使用代码隐藏作为示例。您可能希望将尽可能多的逻辑从视图中推送到视图模型或更下游）

public partial class Selectie : UserControl
{
    public Selectie()
    {
        InitializeComponent();
    }
    private void Selectie_MouseDoubleClick(object sender, MouseButtonEventArgs e)
    {
        if (((MainViewModel)this.DataContext).ImageVisibility == System.Windows.Visibility.Visible)
            ((MainViewModel)this.DataContext).ImageVisibility = System.Windows.Visibility.Collapsed;
        else
            ((MainViewModel)this.DataContext).ImageVisibility = System.Windows.Visibility.Visible;
    }
}

从 C# WPF 中的用户控件更改图像可见性

Change image visibility from an Usercontrol on C# WPF

c#

wpf

xaml

user-controls