Disabled Buttons - UX Improvement

[Ajaiqmar]

Describe the bug

Noticed, that the disabled buttons doesn't seem to show Tooltips and it lets the click event bubble to the parent controls.

It seems vital to show the tooltip even in the disabled state, If the button just contains an Icon. Noticed this in the Windows Settings App.

Here the tooltip is shown, but incase we have reached the GoBack limit, The button disables and the tooltip isn't appearing anymore. And whether bubbling the event seems to be ideal or not is based on the UI that we opt for.

Keen to know, What's your take on this?

And checked out the same behaviour in Mac for comparison and found that they do show Tooltip and Nullify the event bubbling.

Steps to reproduce the bug

1. Go to Windows Settings Page

Expected behavior

No response

Screenshots

No response

NuGet package version

None

Packaging type

No response

Windows version

No response

IDE

No response

Additional context

No response

[castorix]

You can use a Container like a transparent Grid For example, in this test, the Tooltip is displayed even when the Button is disabled :

        <Grid Margin="10, 10, 10, 10" Background="Transparent">
            <Button x:Name="btn1" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0, 0, 0, 0" Width="60" Height="60"               
                    Click="btn1_Click" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch"
                    FontFamily="Segoe UI Emoji" FontSize="40" Content="&#x1F4BE;" Padding="0, 0, 0, 0" >
            </Button>
            <ToolTipService.ToolTip>
                <ToolTip Content="This is a Tooltip" Placement="Bottom" Background="LightYellow" Foreground="Black"/>
            </ToolTipService.ToolTip>
        </Grid>

[codendone]

Same as #1149?

[marcelwgn]

Regarding the point of bubbling events, can you explain a little bit more what scenario and event you are encountering this with @Ajaiqmar ? With the following XAML, none of the events were raised:

<StackPanel 
    HorizontalAlignment="Center" 
    PointerPressed="StackPanel_PointerPressed" 
    Width="500" VerticalAlignment="Center">
    <Button Click="Button_Click" IsEnabled="False"/>
</StackPanel>

On the tooltip matter, I would agree with @codendone that this is the same ask as #1149

[Ajaiqmar]

Regarding the point of bubbling events, can you explain a little bit more what scenario and event you are encountering this with @Ajaiqmar ? With the following XAML, none of the events were raised:

<StackPanel HorizontalAlignment="Center" PointerPressed="StackPanel_PointerPressed" Width="500" VerticalAlignment="Center"> <Button Click="Button_Click" IsEnabled="False"/> </StackPanel> On the tooltip matter, I would agree with @codendone that this is the same ask as #1149

I noticed the bubbling, when having those disabled buttons inside a ListView Template, @marcelwgn.

Let's whip up a scenario, where I need to disable a button with an Icon inside a Data Template for a few ListView Items, i.e. Delete . In this case, I would still want the user to get the ToolTip and if we do show the tooltip then we should try restricting the ListView Item Click from firing when the disabled button is clicked upon.

We couldn't just remove the disabled button in view as it will cause a difference in UI across the ListView Items is what we thought. Open for your thoughts on this @marcelwgn . Could whip up a POC if you are not clear on what was mentioned, if need be @marcelwgn .

[marcelwgn]

Definitely see that removing the button is not an option for you. Unfortunately, I wasn't able to reproduce this with a quick project so if you could provide a repro project that would be great @Ajaiqmar !

[microsoft-github-policy-service[bot]]

This issue has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 7 days. It will be closed if no further activity occurs within 7 days of this comment.