dotnet / dotnet/maui

VisualState does not obey style hierarchy rules

Open
#28,535 4 comments 0 reactions 0 assignees View on GitHub
area-xaml platform/windows s/triaged s/verified t/bug
Dominant language
C#
Stars
23.3k
Forks
2k
Avg merge
1d 15h
Merged PRs (30d)
290

Description

### Description

When using VisualStates they do not appear to obey the rules of style hierarchies. Styles defined at the page level do not seem to correctly override styles defined at the app level.

### Steps to Reproduce

1. Clone and compile the repository specified below (use the `main` branch).
2. Note that there are `Label` and `Picker` styles defined in the `Styles.xaml` document as well as at the top of the `MainPage`.
3. Run the app and note the appearance of the controls. The styles in the `MainPage` do not seem to override those defined in the `Styles.xaml` for the `VisualState`s. If correct, the text should be red. The styles that are directly assigned using `x:Key` function as expected.
![Image](https://github.com/user-attachments/assets/b8f3e6a4-f858-4f8d-a578-001c51158239)
4. Toggle the `Switch` to enable the controls. Note that style properties set without the use of `VisualState`s do override those in the `Styles.xaml` document (all the text is green).
![Image](https://github.com/user-attachments/assets/b6acfe17-77e2-4afc-8dd0-2e5182f7ad79)

Based on the [documentation](https://learn.microsoft.com/en-us/dotnet/maui/user-interface/styles/xaml?view=net-maui-9.0), I would expect styles defined at the page level to override those at the app level. I would expect that for the visual states as well and the result would be both sets of controls (_Override_ and _Assigned_) to function the same.

### Link to public reproduction project repository

https://github.com/lendres/MauiPickerVisualStates

### Version with bug

9.0.50 SR5

### Is this a regression from previous behavior?

Not sure, did not test other versions

### Last version that worked well

_No response_

### Affected platforms

Windows

### Affected platform versions

Windows 10.0.19041.0

### Did you find any workaround?

The styles can be explicitly set using the `Style` or `StyleClass` attributes.

### Relevant log output

```shell

```

Contributor guide

Open the contributing guide

Research direction

Clone and run the linked MauiPickerVisualStates reproduction on Windows, then inspect Styles.xaml and MainPage where the app-level and page-level Label and Picker styles are defined. Trace how VisualStates resolve style hierarchy versus directly assigned styles; done means page-level VisualState styles override app-level styles and both control sets behave consistently.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.