wpfmvvm-light

Change Button Background color through MVVM pattern in WPF


I am using MVVM light with WPF. I want to set button background color based on some specific condition through ViewModel. Kindly suggest some way to get it. Thanks


Solution

  • Using triggers:

    <Button>
        <Button.Style>
            <Style TargetType="Button">
                <!-- Set the default value here (if any). 
                     If you set it directly on the button that will override the trigger. -->
                <Setter Property="Background" Value="LightGreen" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding SomeConditionalProperty}"
                                 Value="True">
                        <Setter Property="Background" Value="Pink" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>
    

    Explanation of the comment.


    Using a dependent property in a view model (MVVM):

    public bool SomeConditionalProperty 
    {
        get { /*...*/ }
        set
        {
            //...
    
            OnPropertyChanged(nameof(SomeConditionalProperty));
            //Because Background is dependent on this property.
            OnPropertyChanged(nameof(Background));
        }
    }
    
    public Brush Background =>
        SomeConditionalProperty ? Brushes.Pink : Brushes.LightGreen;
    

    Then you just bind to Background.