Binding the style of the control to a Viewmodel property

Question

I am trying to create a banner with different states and colors to show messages to the user, showing a Border with a specific style and a Label with an style bases in the Border style and using DataTrigger. I have created each custom styles for each state in my App.xaml and I am trying to change the state based on a property of my ViewModel.

The problem is that the style doesn't change every time I change the property, but nevertheless if I modify some of the XAML during debugging, the style is refreshed correctly.

Maybe I am missing a NotifyPropertyChanged somewhere?

Visual example:

This is My code:

App.xaml with my defined styles and my custom converter

Styleconverter.cs

public class StyleConverter : IValueConverter {
    public object Convert (object value, Type targetType, object parameter, CultureInfo culture) {
        if (targetType != typeof (Style)) {
            throw new InvalidOperationException ("The target must be a Style");
        }

        var styleProperty = parameter as string;
        if (value == null || styleProperty == null) {
            return null;
        }

        string styleValue = value.GetType ()
            .GetProperty (styleProperty)
            .GetValue (value, null)
            .ToString ();
        if (styleValue == null) {
            return null;
        }

        Style newStyle = (Style) Application.Current.TryFindResource (styleValue);
        return newStyle;
    }

    public object ConvertBack (object value, Type targetType, object parameter, CultureInfo culture) {
        throw new NotImplementedException ();
    }
}

Banner.cs

public class Banner : INotifyPropertyChanged {
    private string _Message;
    public string Message {
        get => _Message;
        private set {
            _Message = value;
            RaisePropertyChanged (null);
        }
    }

    private string _Style = "Banner_Success";
    public string Style {
        get => _Style;
        private set {
            _Style = value;
            RaisePropertyChanged (null);
        }
    }

    public Banner SetSuccess (string message) {
        Style = "Banner_Success";
        Message = message;

        return this;
    }

    public Banner SetInfo (string message) {
        Style = "Banner_Info";
        Message = message;

        return this;
    }

    public Banner SetError (string message) {
        Style = "Banner_Error";
        Message = message;

        return this;
    }

    #region INotifyPropertyChanged

    public event PropertyChangedEventHandler PropertyChanged;
    public void RaisePropertyChanged (string PropertyName) {
        PropertyChanged?.Invoke (this, new PropertyChangedEventArgs (PropertyName));
    }

    #endregion
}

Mainwindow.xml

MainViewModel.cs

public class MainViewModel : INotifyPropertyChanged {
    
    public Banner Banner { get; } = new Banner ();
    public string BannerStyle => Banner.Style;
    public string BannerMessage => Banner.Message;

    public RelayCommand CmdChangeColor { get; }

    public MainViewModel () {
        Banner.SetSuccess ("This is the initial message");

        CmdChangeColor = new RelayCommand (param => ChangeColor (param.ToString ()));
    }

    public void ChangeColor (string color) {
        switch (color) {
            case "blue":
                Banner.SetInfo ("INFO!! This should be a banner with blue background");
                break;

            case "red":
                Banner.SetError ("ERROR!! This should be a banner with red background");
                break;

            case "green":
                Banner.SetSuccess ("SUCCESS!! This should be a banner with green background");
                break;
        }

        RaisePropertyChanged (null);
    }

    #region INotifyPropertyChanged

    public event PropertyChangedEventHandler PropertyChanged;
    public void RaisePropertyChanged (string PropertyName) {
        PropertyChanged?.Invoke (this, new PropertyChangedEventArgs (PropertyName));
    }

    #endregion
}

ASh · Accepted Answer

bind to property which has notifications, instead of entire view model ({Binding .}). This way also simplifies converter (no more reflection)

public class StyleConverter : IValueConverter {
    public object Convert (object value, Type targetType, object parameter, CultureInfo culture) {
        if (targetType != typeof (Style)) {
            throw new InvalidOperationException ("The target must be a Style");
        }

        string styleValue = value?.ToString();
        if (styleValue == null) {
            return null;
        }

        Style newStyle = (Style) Application.Current.TryFindResource (styleValue);
        return newStyle;
    }

    public object ConvertBack (object value, Type targetType, object parameter, CultureInfo culture) {
        throw new NotImplementedException ();
    }
}

Binding the style of the control to a Viewmodel property

Answers (1)

Related Questions