Maui.Markup way to define VisualStates in Styles

[devonuto]

Working with the new Maui.Markup way of defining style setters:

public static readonly Style<Grid> GridSyle = new Style<Grid>()
    .ApplyToDerivedTypes(true)
    .Add(Grid.BackgroundColorProperty, Color.White);

It would be nice if we could extend it for adding visual states, if possible maybe something simple like this:

public static readonly Style<Grid> GridSyle = new Style<Grid>()
    .ApplyToDerivedTypes(true)
    .Add(Grid.BackgroundColorProperty, ColourConstants.BackgroundColour)
    .Add(VisualStateManager.VisualStateGroups, new VisualState(VisualStateType.Selected)
    {
        Setters.Add(Grid.BackgroundColorProperty, Color.Black)
    });

May obviously need to change, if multiple state groups are required, but this method would assume all visual states are within the same visual state group.

Currently, the only method I have found to define these state setters is by creating my own Grid type like this which is a little convoluted:

public class MyGrid : Grid
{
    public MyGrid()
    {
        VisualStateManager.SetVisualStateGroups(
            this,
            new VisualStateGroupList()
            {
                new VisualStateGroup()
                {
                    States =
                    {
                        new VisualState()
                        {
                            Name = "Selected",
                            Setters =
                            {
                                new Setter { Property = Grid.BackgroundColorProperty, Value = Color.Black }
                            }
                        }
                    }
                }
            }
        );
    }
}

Related origin: #61

[mrlacey]

This would be very helpful.

As a reference, also look at VincentH-Net/CSharpForMarkup#22

[YourAppNerds-Admin]

I agree, this would be very helpful. Do we create an issue from this to hopefully get it worked on?

[brminnick]

Agreed! The next step is to create a New Feature Proposal outlining the new detailed API Design.

[VinMorEpsilog]

Hello, any news about this question? Thanks.

[JoeVoo]

this works:

     new Style<Button>()
    .Add(VisualStateManager.VisualStateGroupsProperty, new VisualStateGroupList
      {
          new VisualStateGroup
          {
              Name = "CommonStates",
              States =
              {
                  new VisualState
                  {
                      Name = "Normal",
                  },
                  new VisualState
                  {
                      Name = "Pressed",
                      Setters =
                      {
                          new Setter { Property = Button.OpacityProperty, Value = 0.7 },
                          new Setter { Property = Button.BackgroundColorProperty, Value = darkOrange }
                      }
                  }
              }
          }
      })