WPF用户控件属性更改未更新

Question

我有一个用户控件，将其添加到我的主应用程序中。 该用户控件包含一个用于UI元素的按钮。

用户控件包含DispatchTimer，每2秒钟基于一些整数值确定按钮图像。

在用户控件中调用的方法之一应该设置它的图像，但是控件从未显示更改后的图像。

public void SetNormal()
    {
        btnFlashAlert.Content = new BitmapImage(new Uri("Images/FlashButton.png", UriKind.RelativeOrAbsolute));
    }

我是否漏掉了什么，以使得控件更新的外观在主应用程序中呈现？

当我查看.Content包含的内容时，它是正确的。但界面没有反映出这种变化。

XAML

<UserControl x:Class="SC.FlashSystem.MainButton"
         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" 
         mc:Ignorable="d" Height="53" Width="164">
<Button x:Name="btnFlashAlert" Background="{x:Null}" BorderBrush="{x:Null}" Cursor="Hand" Click="btnFlashAlert_Click">
    <Button.Template>
        <ControlTemplate>
            <Image Source="Images/FlashButton.png"/>
        </ControlTemplate>
    </Button.Template>
</Button>

Codebehind已更新

        public partial class MainButton : UserControl
{
    private SupportConsoleWeb.MessageData messageCounts { get; set; }
    private readonly DispatcherTimer flashButtonChangeTimer = new DispatcherTimer();
    private BitmapImage NormalImage { get; set; }
    private BitmapImage CriticalImage { get; set; }
    private BitmapImage AlertImage { get; set; }
    private BitmapImage InfoImage { get; set; }

    public MainButton()
    {
        InitializeComponent();

        messageCounts = new SupportConsoleWeb.MessageData();
        messageCounts.CriticalCount = 0;
        messageCounts.AlertCount = 0;
        messageCounts.InfoCount = 0;

        NormalImage = new BitmapImage(new Uri("Images/FlashButton.png", UriKind.RelativeOrAbsolute));
        CriticalImage = new BitmapImage(new Uri("Images/FlashButtonRed.png", UriKind.RelativeOrAbsolute));
        AlertImage = new BitmapImage(new Uri("Images/FlashButtonOrange.png", UriKind.RelativeOrAbsolute));
        InfoImage = new BitmapImage(new Uri("Images/FlashButtonGreen.png", UriKind.RelativeOrAbsolute));

        flashButtonChangeTimer.Interval = TimeSpan.FromSeconds(2);
        flashButtonChangeTimer.Tick += flashButtonChangeTimer_Tick;
        flashButtonChangeTimer.Start();
    }

    void flashButtonChangeTimer_Tick(object sender, EventArgs e)
    {
        btnFlashAlert.Dispatcher.BeginInvoke(new Action(() =>
        {
            if (btnFlashAlert.Content == null)
            {
                SetNormal();
            }
            else if (messageCounts.CriticalCount > 0 && btnFlashAlert.Content.Equals(CriticalImage))
            {
                SetNormal();
            }
            else if (messageCounts.AlertCount > 0 && btnFlashAlert.Content.Equals(AlertImage))
            {
                SetNormal();
            }
            else if (messageCounts.InfoCount > 0 && btnFlashAlert.Content.Equals(InfoImage))
            {
                SetNormal();
            }
            else if (messageCounts.CriticalCount > 0)
            {
                SetCritical();
            }
            else if (messageCounts.AlertCount > 0)
            {
                SetAlert();
            }
            else if (messageCounts.InfoCount > 0)
            {
                SetInfo();
            }
        }));
    }

    public void UpdateMessageCounts(SupportConsoleWeb.MessageData messageCounts)
    {
        this.messageCounts = messageCounts;
    }

    private void btnFlashAlert_Click(object sender, RoutedEventArgs e)
    {
        MainWindow window = new MainWindow();
        window.WindowStartupLocation = WindowStartupLocation.CenterScreen;
        window.ShowDialog();
    }

    public void SetMessageCount(int criticalCount, int alertCount, int infoCount)
    {
        messageCounts.CriticalCount = criticalCount;
        messageCounts.AlertCount = alertCount;
        messageCounts.InfoCount = infoCount;
    }

    private void SetNormal()
    {
        btnFlashAlert.Content = NormalImage;
    }

    private void SetCritical()
    {
        btnFlashAlert.Content = CriticalImage;
    }

    private void SetAlert()
    {
        btnFlashAlert.Content = AlertImage;
    }

    private void SetInfo()
    {
        btnFlashAlert.Content = InfoImage;
    }
}

- Tsukasa

---

请发布您的完整XAML和代码。 - Federico Berasategui

你的XAML写错了，而且你还在改变Button.Content并再次放置相同的图片，即使它能工作，你也看不到任何视觉上的变化。请澄清一下。你有没有打算将其更改为其他内容？ - Federico Berasategui

我将发布刚才我发布的一个方法的后台代码。 - Tsukasa

从XAML中删除按钮模板 - Eugene P.

Answer 1

将您的XAML更改为以下内容：

 <Image Source="{Binding TheImage}"/>

添加通知属性更改

 public partial class MainButton : UserControl, INotifyPropertyChanged

创建OnPropertyChanged事件

    void OnPropertyChanged(String prop)
    {
        PropertyChangedEventHandler handler = PropertyChanged;

        if (handler != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(prop));
        }
    }
    public event PropertyChangedEventHandler PropertyChanged;

创建一个Bitmap属性并通知属性更改事件。

    private BitmapImage _TheImage;

    public BitmapImage TheImage
    {
        get { return _TheImage; }
        set { _TheImage = value; OnPropertyChanged("TheImage"); }
    }

在你的初始化程序中

  public MainButton()
    {
        this.DataContext = this;
        InitializeComponent();
        TheImage = new BitmapImage();

现在在您的设置方法中调用

TheImage = //Your Bitmap Goes here

我知道这看起来过度了，但从长远来看，这是一种更干净的实现方式。

- DotNetRussell

---

完美，这也清理了逻辑的其他部分。 - Tsukasa

我曾经是一个持怀疑态度的人。然而，在进行WPF或其变体时，数据绑定是唯一可行的方法。 - DotNetRussell

Answer 2

我认为这是一个图片选择逻辑的问题，当没有满足条件时没有默认图片...

话虽如此，在我看来，更好的图片逻辑应该是将所有图片预加载并将它们的可见性初始设置为隐藏。然后将每个图片的可见性绑定到VM上的特定标志布尔值上。计时器事件可以简单地打开或关闭布尔值，从而根据需要显示或隐藏图片。

这样可以消除由于加载和显示图片而产生的任何延迟；同时也可以解决由于加载/卸载图片而可能导致的未来内存问题。

示例

以下示例有一个带有两张图片的按钮。两张图片的可见性都与VM上的布尔值绑定。VM有一个布尔值，图片根据它的状态工作，并且一个计时器每两秒钟改变其状态以切换图片。

Xaml：

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

<Button x:Name="bStatus" Width="48" Height="48">
    <StackPanel Orientation="Vertical">
        <Image Source="Images\Copy-icon.png" Visibility="{Binding IsCopyOn, 
                                                            Converter={StaticResource BooleanToVisibilityConverter}}" />
        <Image Source="Images\Recycle-icon.png"
                Visibility="{Binding IsRecycleOn, 
                            Converter={StaticResource BooleanToVisibilityConverter}}" />
    </StackPanel>
</Button>

VM

public class MainVM : INotifyPropertyChanged
{
    private bool _bSwitch;
    private readonly DispatcherTimer flashButtonChangeTimer = new DispatcherTimer();

    public bool IsRecycleOn
    {
        get { return _bSwitch; }

    }

    public bool IsCopyOn
    {
        get { return !_bSwitch; }
    }

    public MainVM()
    {
        flashButtonChangeTimer.Interval = TimeSpan.FromSeconds(2);
        flashButtonChangeTimer.Tick += (sender, args) =>
        {
            _bSwitch = ! _bSwitch;
            OnPropertyChanged("IsCopyOn");
            OnPropertyChanged("IsRecycleOn");
        };
        flashButtonChangeTimer.Start();

    }

    /// <summary>Event raised when a property changes.</summary>
    public event PropertyChangedEventHandler PropertyChanged;

    /// <summary>Raises the PropertyChanged event.</summary>
    /// <param name="propertyName">The name of the property that has changed.</param>
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }

}

- ΩmegaMan

---

谢谢你给了我一些之前没有注意到的关于延迟和内存问题的东西。你能展示一个将多个图像绑定到按钮的例子吗？之前我没想到可以有多个图片源。 - Tsukasa