如何在 MVVM 中更改属性时更新 UI 更改 [英] How to update UI change when property changed in MVVM

问题描述

我正在尝试在 WPF 中实现正确的 MVVM 架构.

I'm trying to accomplish a correct MVVM architecture in WPF.

我有一个播放器，在模型"部分有一个布尔属性，表示我们现在是否正在播放".

I have a player, in the "Model" section there is a Boolean property that says if we are "playing" right now.

public bool IsPlaying
    {
        get
        {
            return isPlaying;
        }
        set
        {
            isPlaying = value;
            OnPropertyChanged("IsPlaying");
        }
    }

(注意我实现了INotifyPropertyChanged"接口，所以OnPropertyChanged函数会报告变化)

(Notice I implemented the "INotifyPropertyChanged" interface, so the OnPropertyChanged function reports the change)

在我的 ViewModel 中，我有一个名为ToggleButtonIcon"的 ImageSource 属性:

in my ViewModel, I have a ImageSource property called "ToggleButtonIcon":

public ImageSource ToggleButtonIcon
    {
        get
        {
            if (Model.IsPlaying)
                return pauseIcon;
            else
                return playIcon;
        }
    }

我绑定到视图中的TogglePlayButton":

Which I bind to a "TogglePlayButton" in the view:

<cc:IconButton x:Name="TogglePlayButton" 
               Style="{StaticResource playButton}" 
               ImageSource="{Binding Path=ToggleButtonIcon,
               UpdateSourceTrigger=PropertyChanged}"  
               Command="{Binding Path=TogglePlayCommand}"/>

(这是一个自定义控件，但它可以工作，我检查过)当然，我希望按钮根据它是否正在播放(暂停)和是否在播放(播放)来更改其图像图标.

(It's a custom control, but it's working, I checked) Of course I want the button to change its image icon according to if it is playing (pause) and if it is not playing (play).

问题是 ToggleButtonIcon 在更改时没有通知，我无法在 ViewModel 部分实现 INotifyValueChanged，因为 a.我知道这不是 MVVM 架构的一部分，并且 b.我不知道它什么时候改变，因为它取决于模型的 IsPlaying 属性.

Problem is the ToggleButtonIcon does not notify when it changes, and I can't implement the INotifyValueChanged in the ViewModel section because a. I understood that's not a part of the MVVM architexture, and b. I don't know when it changes since it depends on the IsPlaying property of Model.

我想将 ToggleButtonIcon 属性放在模型部分，但这不是业务逻辑"，所以我认为这不是正确的方法.

I thought about putting the ToggleButtonIcon property on the Model section, but that's not "Business Logic" so I don't think that's the right way.

我还考虑过使用转换器并将 IconButton 直接绑定到IsPlaying"，这可能会起作用，但我在这里阅读:WPF 转换器如何在 MVVM 模式中使用? 您根本不应该在 MVVM 中使用转换器因为您可以在ViewModel"部分进行任何您想要的转换.

I also thought about using a converter and bind the IconButton directly to "IsPlaying", which would probably work, but I read here: How can WPF Converters be used in an MVVM pattern? that you should not use converters at all in MVVM because you can do any convertion you want in the "ViewModel" Section.

在 MVVM 架构中实现这一目标的最佳方法是什么?

What's the best way to accomplish this in MVVM architecture?

推荐答案

对我来说，IsPlaying 应该在 ViewModel 中，并实现更改通知，因为它代表了各种应用程序状态.

To me, IsPlaying should be in the ViewModel, with change notification implemented, as it represents an application state of sorts.

为了解决这个问题，我建议从 ViewModel 中取出 ToggleButtonIcon，并在 IconButton 控件上创建一个 DataTrigger(通过它的Style)，绑定到 IsPlaying 属性(在 ViewModel 上)并基于此更改 ImageSource 属性.

To solve the issue I would recommend taking the ToggleButtonIcon out of the ViewModel, and creating a DataTrigger on the IconButton control (via its Style), that binds to the IsPlaying property (on the ViewModel) and alters the ImageSource property based on that.

这篇关于如何在 MVVM 中更改属性时更新 UI 更改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！