Search code examples
uno-platform

Uno platform Material Button use symbolicon


I want to use a Material styled button in my app- but I am not able to get the settings icon to disply. I dont mind switching from symbolicon(I believe it is failing in part because it is from the Fluent style font and Material does not have it)- but I am not sure how to go about this. Also- how would I change the color of the ripple of a Material button? I see in the source code for the Material button there is a pressed state- but it only has an opacity and a duration. Since my background in light mode will be a light grey- you will never see the ripple. Here is my code:

Working- but using fluent:
<Button Background="{StaticResource buttonBackground}" Click="set_Click">
                <SymbolIcon x:Name="gearIcon" Symbol="Setting" Foreground="{StaticResource buttonForeground}" >
                   
                </SymbolIcon>
            </Button>

Goal:
<material:Button Style="{StaticResource MaterialContainedButtonStyle}" Click="set_Click">
                <SymbolIcon Symbol="Setting" Foreground="{StaticResource buttonForeground}" >
                   
                </SymbolIcon>
</material:Button>


Solution

  • Material styling is done via styles only, you don't want <material:Button, there's no custom class named button, it uses the Uno/WinUI Button class directly.

    In other words, you need <Button Style="{StaticResource MaterialContainedButtonStyle}"

    Something like this:

    <Button Style="{StaticResource MaterialContainedButtonStyle}" Click="set_Click">
       <SymbolIcon Symbol="Setting"/>
    </Button>