2

This is a mystery to me. I have a button like so:

<Button
    Text="{x:Static res:AppRes.SaveAsDraft}"
    BorderColor="#2b3c3c"
    BackgroundColor="#001933"
    CornerRadius="10"
    TextColor="White"
    HorizontalOptions="CenterAndExpand"
    WidthRequest="120"
    HeightRequest="40"
    Margin="0,0,10,10"
    IsVisible="True"
    VerticalOptions="Center"
    Command="{Binding SaveAsDraftCommand}">
    <Button.Triggers>
        <DataTrigger TargetType="Button" Binding="{Binding ChangesWereMade}" Value="True">
            <Setter Property="IsEnabled" Value="True" />
            <Setter Property="BackgroundColor" Value="#001933" />
        </DataTrigger>
        <DataTrigger TargetType="Button" Binding="{Binding ChangesWereMade}" Value="False">
            <Setter Property="IsEnabled" Value="False" />
            <Setter Property="BackgroundColor" Value="Gray" />
        </DataTrigger>                        
    </Button.Triggers>
</Button>

In Design it works like a charm. When I set the value [ObservableProperty] changesWereMade to true in my VM, the button gets enabled, and it shows as such. When that property is false, the button gets disabled.

In Release mode, however, not so much... When I set changesWereMade to true, the button gets enabled, it works if you know to click on it, it saves the data, but it is still greyed out - you have to know that it just looks disabled, but it is actually enabled. When that property is false, the button gets disabled for real. The appearance is still greyed out, of course, but now clicking on it does not work. Now it's correct.

So.... Why does my button work properly in both design and release, but in release it does not change its appearance to really signal "Hey, I'm now enabled" ?

Long story short:

in both design and release, the property "IsEnabled" works as expected. The property "BackgroundColor", however, only works in design.

Why ?

Thank you Alex.

Alex
  • 157
  • 8
  • All you need to do is: IsEnabled = "{Binding ChangesWereMade}". Check my answer for details. – H.A.H. Feb 22 '23 at 11:28

2 Answers2

1

Yes, I can reproduce this issue. It's really weird. You may raise an issue on Github if you want.

For a workaround, you could use Background property instead of BackgroundColor property.

<Button.Triggers>
    <DataTrigger TargetType="Button" Binding="{Binding ChangesWereMade}" Value="True">
        <Setter Property="IsEnabled" Value="True" />
        <Setter Property="Background" Value="#001933" />
    </DataTrigger>
    <DataTrigger TargetType="Button" Binding="{Binding ChangesWereMade}" Value="False">
        <Setter Property="IsEnabled" Value="False" />
        <Setter Property="Background" Value="Gray" />
    </DataTrigger>                        
</Button.Triggers>

Don't worry. There is no much differences between Background and BackgroundColor, you could refer to .net MAUI Background vs BackgroundColor - what is the difference?.

Hope it works for you.

Liqun Shen-MSFT
  • 3,490
  • 2
  • 3
  • 11
  • This is a disaster waiting to happen. I am 99.99% sure, that the default style, that is changing the button appearance when disabled still applies. In a way, you have Background changing to one thing, and BackgroundColor changing to something else from the style. Two different codes, in two different places and times, will be doing two different things. – H.A.H. Feb 22 '23 at 11:30
0

Do you know that, in your Resources/Styles.xaml you have something like that:

<Style TargetType="Button">
    <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource White}, Dark={StaticResource Primary}}" />
    <Setter Property="BackgroundColor" Value="{AppThemeBinding Light={StaticResource Primary}, Dark={StaticResource White}}" />
    <Setter Property="FontFamily" Value="OpenSansRegular"/>
    <Setter Property="FontSize" Value="14"/>
    <Setter Property="CornerRadius" Value="8"/>
    <Setter Property="Padding" Value="14,10"/>
    <Setter Property="VisualStateManager.VisualStateGroups">
        <VisualStateGroupList>
            <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal" />
                <VisualState x:Name="Disabled">
                    <VisualState.Setters>
                        <Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Gray950}, Dark={StaticResource Gray200}}" />
                        <Setter Property="BackgroundColor" Value="{AppThemeBinding Light={StaticResource Gray200}, Dark={StaticResource Gray600}}" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateGroupList>
    </Setter>
</Style>

Even by default, there are VisualStateManager, that targets properties of your buttons. (And this is working, release or debug, I am using it in every project)

Changing the VisualState does invoke all the setters, and every property there gets changed. More precisely - BackgroundColor.

H.A.H.
  • 2,104
  • 1
  • 8
  • 21
  • @h-a-h are you suggesting we set the visual states again to trigger the update? – envyM6 Jun 02 '23 at 09:13
  • @envyM6 Plain and simple I am saying that there is already written code that handles background color change, bound to the IsEnabled property. You do not have to do anything. More importantly - doing something, without removing the existing code is beyond wrong. Nothing justifies it. Imagine if colleagues of mine open my project, and see that I am doing one thing with the button Style, and then change the same thing with Trigger on that button. No. Complete logical non-sense. – H.A.H. Jun 03 '23 at 15:04