How to migrate this from <Style> to ux:Class

Can someone help me rewrite this:

    <Button ux:InheritStyle="false" Background="#55ACEE" Name="self"> <Fuse.BasicTheme.ButtonText TextColor="#FFF" Font="RobotoMedium" Value="{Property self.Text}" TextAlignment="Center"/></Button>

To something like:

<Button ux:Class="CustomButton" ...>
 // stuff

Could someone explain how this would be done, with some explanation


It’s pretty straight forward. Just put all properties and inner tags from the Button in Style on the class tag instead.

You can drop ux:InheritStyle now, just delete it.

Next step is to start using CustomButton instead of Button whenever you want to use your custom class.

Yea I understand that part, but the style is not the same when using:

<Button ux:Class="TabButton" Name="self" Background="#55ACEE">
    <Fuse.BasicTheme.ButtonText TextColor="#FFF" Font="RobotoMedium" Value="{Property self.Text}" TextAlignment="Center"/>

The background color of the button doesn’t change for some reason, the ux:InheritStyle="false" made that work, but its not allowed on the <Button> unless its inside a <Style> tag

Your code doesn’t make much sense. What are you actually trying to do here?

With this level of customization, consider just using a <Panel> as the base class, and build your control from scratch.

Yea that’s what I ended up doing thanks.