Need for multiple button styles

[SmauDistribution]

Hello everyone!
I've been using Avalonia for a short time, and I've relied on https://theme.xaml.live/ to customize the FluentTheme. I need to create an app where a button must stand out from the others, and in this case, I would need a button like the one on FluentEditor called the "Enabled Accent Button," but I haven't found any other variant besides the classic one.

I'm opening this new issue because it would be nice to have more variations beyond the normal button, similar to Bootstrap, or to be able to change the background and automatically generate other colors based on the background for hover or when the button is clicked. I know this can be done with styles, but I think it would be better to have something automatic or predefined instead of having to create a custom button for every project.

Thanks for the work you've been doing so far. Keep it up!

[thevortexcloud]

predefined instead of having to create a custom button for every project.

This is what themes are for. There are several available for Avalonia. You can also make your own and reuse it wherever you want. The material theme for example is used in a lot of apps.

https://github.com/AvaloniaCommunity/Material.Avalonia

Controls in Avalonia are actually "lookless" which means they don't even have a visual representation without a style/theme. Which means they can be customised to look like anything.

[SmauDistribution]

@thevortexcloud Great! Thanks for the response :)
However, I noticed that FluentEditor generates colors for the hover effect or click effect based on the colors I provided. It would be nice to use those colors. But as far as I know, I have no way to use that 'Enabled accent button' in my app. If I use styles and create my button, I would basically have to copy and paste the hex values into the project... It would be nice to have a button, maybe called AccentButton or something similar, that takes the primary color I set in the FluentTheme.

[timunie]

That's what Dynamic Resources is for. You just have to find out the resource key to use. Check original styles in source for reference

[thevortexcloud]

You can also just set a global style and override really anything if you want.

In any case, the themeing system is very flexible. Also since it sounds like you are possibly not aware of it, Avalonia actually has two official themes. The Fluent theme, and the simple theme. They visually look pretty different. I typically use Fluent myself but that's mainly out of habit.

[SmauDistribution]

I understand, so I will act accordingly.

Thanks for the replies.
Have a nice day! :)

[MikeCodesDotNET]

@SmauDistribution you may also like the theme from Actipro.

[timunie]

Will convert this into a Q&A as for now.

[rohit2876]

found the solution just add -- Classes="accent" -- to the button and it will apply Accent theme to the button