AvaloniaCommunity / Material.Avalonia

Material design in AvaloniaUI
MIT License
832 stars 77 forks source link

Implement styles for all Avalonia's controls #234

Open SKProCH opened 1 year ago

SKProCH commented 1 year ago

Since we positioning Material.Avalonia as standalone styles library we should add styles to all existing Avalonia controls.
Of course anyone can just reference FluentTheme before our theme and with ControlThemes it will work fine, but we should provide a basic support for all controls.

List of currently missing controls:

New files should be created in Resources/Themes folder and imported in MaterialToolKit.xaml. All PRs and support are highly appreciated.

NoizeDaemon commented 1 year ago

Could you elaborate on how to use FluentTheme as a fallback for missing or broken controls?

Right now I'm trying to get a CalenderDatePicker to work:

When I place fluent first, like so:

<Application ...
             xmlns:themes="clr-namespace:Material.Styles.Themes;assembly=Material.Styles"
             xmlns:icons="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia" 
             xmlns:styles="clr-namespace:Material.Styles;assembly=Material.Styles"
                         ...

    <Application.Styles>
        <FluentTheme />
        <themes:MaterialThemeBase />
        <icons:MaterialIconStyles />
        <styles:MaterialToolKit />
    </Application.Styles>
</Application>

I get:

System.InvalidOperationException: "ControlTemplate styles cannot contain multiple template selectors."

When I place it last or in its own Selector (just for the CalenderDatePicker), everything becomes fluent...

How can I set it only for that specific control (or as a fall back if there's no material style for a control?)

(Btw, looking at fluent again after only working with this material for a while now, makes me really appreciate your work all over again! Beautiful design!)

SKProCH commented 1 year ago

Hello, @NoizeDaemon. Thanks for the kind words)

As about your problem, i can just do this at my example project:

<Application.Styles>
  <FluentTheme />
  <themes:MaterialTheme />
  ...

And everything works fine. Can you provide a minimum representable example with your error, please?

NoizeDaemon commented 1 year ago

Here is the sample: https://github.com/NoizeDaemon/MS

It runs without <FluentTheme />, but does not show the CalenderDatePicker.

When putting <FluentTheme /> first, we get ControlTemplate styles cannot contain multiple template selectors.

When putting <FluentTheme /> last, it displays the CalenderDatePicker (& everything else in Fluent) - which is expected.

Edit: I also tried variations of MaterialTheme and MaterialThemeBase, setting the theme in code/not setting, etc.

SKProCH commented 1 year ago

@NoizeDaemon, I've commented a Calendar styles (they need a bit more polishing) and it works fine with latest nightly. Give it a try.

NoizeDaemon commented 1 year ago

Works now! :) Thank you!