If xaml becomes css ???

[JHeLiu]

Wouldn't it be nice if xAML-style writing were sublimated to CSS operations in HTML?
(^o^)/~

<Style>
.Demo {
 Background:Red;
 FontSize:16
}

.InputText{
  BorderRadius: 3;  // If you have
}

</Style>

<StackPanel Class="Demo">
        <TextBox Class="InputText"  />
</StackPanel>

Wow, It feels so great when I think about it

XAML write styles are not simple enough for CSS

[GeraudFabien]

Wouldn't it be nice if you take time to explain :

• Why you want that.
• What problem you hope it solve
• How it work (You're exemple show one kind of selector, Basic style that doesn't overlap, no animation, no templating, no device specific, ...)

To help you you can use what already exist:

• Stylesheets xamarin/Xamarin.Forms#1207
• https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/styles/css/

If what you want is CSS pure why don't you use Blazor and mobile binding.

[JHeLiu]

1. Stronger sense of hierarchy
2. Less code, easier to maintain, easier to read
3. It can be compiler parsing as before, instead of CSS dynamic parsing, which is just a writing change.
   What do you think of the idea?

[GeraudFabien]

Stronger sense of hierarchy

hierarchy in css is done with convention in css. You can do it in XAML

Less code, easier to maintain, easier to read

<Style x:Selector=".Demo">
  <Setter Property="Background" Value="Red"/>
  <Setter Property="FontSize" Value="16"/>
</Style>
<Style x:Selector=".InputText">
  <Setter Property="BorderRadius" Value="3"/>
</Style>

7 LOC on both side. Same feature and as far i understand no difference to maintain.

<!-- Demo with child content -->
<Style x:Selector=".Demo" TargetType="MyControl">
  <Setter Property="WhenEmptyContentTemplate">
  <Setter.Value>
    <MyEmptyTemplate Text="Noooooo!" />
  </Setter.Value>
</Style>

<!-- Demo with Complex type -->
<Style BasedOn="{StaticResource MyParentStyle}">
  <Trigger Property="OnFocus">
    <MyAnimation />
  </Trigger>
</Style>

I try not to use WPF/Xamarin XAML. To sho only the idea. What about when you want to embeed XAML.

It can be compiler parsing as before, instead of CSS dynamic parsing, which is just a writing change.

I'm not sur i understand Dynamic parsing is to avoid it's slow, hard to debug, and inconsistent. If i understand what you say is the fact that it's in a style will make it compile with the xaml.

What do you think of the idea?

I believe i start to understand what you're talking about. You want to add css to style in a way it work exactly like xaml.

<Style>
.Demo {
 Background:Red;
 FontSize:16
}

.InputText{
  BorderRadius: 3;  // If you have
}
</Style>
<Style x:Key="MyStyle" TargetType="MyPanel" >
.InputText{
  Foreground: Fushia;
}
</Style>

<StackPanel Class="Demo">
  <TextBox Class="InputText"  />
  <MyPanel Style="{StaticResource MyStyle}" >
    <!-- This will have both Fushia foreground and a border -->
    <MyTextInliner Class="InputText" />
  </MyPanel>
</StackPanel>

This is a more realistic exemple :

<!-- Other style --> 
<Style>
<![CDATA[
.InputText{
 Foreground: Fushia;
 Setters: ]]>
   <Setter Property="Foo" Value="X"/>
   <Trigger Binding="Foo" Value="Z">
     <Setter Property="Foo1" Value="Y"/>
   </Trigger>
   <![CDATA[
}
]]>;
</Style>

I use <![CDATA[]]> to limit css part.
I use Setters: to add xaml part in css with "]]>" to start and "]]>;" to end the property.

You may want to based the conversation on a goal/problem. Otherwise like all thread about using WPF/UWP/... xaml you're discussion will go nowhere.

[JHeLiu]

Thank you. I'll have a try