[proof of concept] List lightweight styling resources

[citelao]

Today, it is very difficult to get a list of lightweight styles for a given control.

This change introduces a proof of concept that can automatically fetch a list of lightweight styles for a given control. It does this by reading the Application ResourceDictionarys for brushes that have the correct prefixes.

Thoughts

• How do we order the styles?
• How about non-brush styles?
• Are there some styles that are colors instead?
• How do we generalize this for all controls?

Screenshots

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

[niels9001]

@citelao Whoa, this is pretty amazing and super useful!

Just wondering, should this live in a component page? Or should there be a dedicated 'lightweight styling' page where you could select a UI control and then see its styles?

In terms of generalization: this could also be a button (next to the Documentation / Source code links) that, upon click would show all this in a dialog or flyout? That way, this logic would live in PageHeader.xaml which is a common control used for every page (and is aware of the namespace/UI control name?)

[karkarl]

Thanks so much for this @citelao, I'm really looking forward for this feature!

In response to @niels9001 suggestions, here are my two cents: I think the lightweight styling resources should live with the control, since most developers only need this information for the one control they need. I don't think a dialog or flyout will be helpful since it should stay static to allow for easy copy and pasting of the resources. That said, I would recommend it to live in a expander, with copy buttons for each resource name.

[citelao]

I strongly agree with @karkarl here: I think this UI should live in the control, since that's where developers will be looking when they lookup "button" etc.

Also:

• +1: I agree that an expander would be nice.
• +1: I agree we need copy-paste.
• I want to get the underlying swatch name if we can (eg if ButtonFooBrush maps to SystemSomethingBrush, it'd be nice to display that name).

---

I mocked up what I hope might happen (minus copy-paste, which we should add):

When you hover a brush, it's "highlighted" in the sample (by actually replacing the brush in the sample!):

[marcelwgn]

I think if we could get the actual XAML source code of WinUI 3 during runtime and go from that information. That way we could also try to get more brushes that might not be named after the control (e.g. resources that apply for multiple controls). Also have you thought about visualizing non color/brush resources?