Add CSS Styling

[kyle-seongwoo-jun]

<Style x:Key="On"
       TargetType="Label">
    <Setter Property="TextColor"
            Value="Red" />
    <Setter Property="FontSize"
            Value="Large" />
</Style>
...
<Label Text="1" Style="{StaticResources On}" />
<Label Text="2" Style="{StaticResources On}" />
<Label Text="3" Style="{StaticResources On}" />
<Label Text="4" Style="{StaticResources On}" />

vs

label {
    textColor: red;
    fontSize: large;
}

<Label Text="1" />
<Label Text="2" />
<Label Text="3" />
<Label Text="4" />

What seems to be a better way? References

[insinfo]

I already made this request, https://github.com/Microsoft/xaml-standard/issues/99

[ghost]

but can you use CSS to apply the style to just , as the label has no id or name.

[mdtauk]

You would need to be able to assign styles to types, as well as ID'd elements, and reused Style/Class names.

To include TypeTargeting as is the case with current XAML resource dictionaries - it would have to be CSS+

[adebiyial]

Nice. But by CSS styling, I guess you mean "easy syntax"? This is fairly a game of compromise. We should try as much as possible not to stray from the syntax of XAML we have now - just improve upon them. Using your CSS styling seems pretty cool but remember, XAML is a variant of XML so XML must show. And when styling gets really complex, that CSS styling could even be more complex than the XAML equivalent.

[warappa]

@kyle-john , @mdtauk , @adebiyial If you want to see this proposal in action, try XamlCSS, also available on nuget for WPF, UWP and Xamarin Forms. It generates native Style instances on the fly and applies them to matched elements, where native styling takes over. You can even use markup-extensions like StaticResource and triggers. For complex objects like Storyboards that can't be expressed as css, you can put it in a ResourceDictionary as usual and reference it in your css. It also supports a subset of scss like variables and selector-nesting.

Have a try!

Disclaimer: I'm the author of XamlCSS

[insinfo]

@warappa your work is incredible, congratulations for your effort and contribution to the open source community.