Expander Extensions?

[michael-hawker]

ExpanderEx?

Problem Statement

While the new Expander in WinUI is great, it doesn't quite supplant all the needs of the Toolkit Expander, namely Left/Right orientation support (due to the lack of LayoutTransform).

This creates an awkward gap where we don't want to deprecate the Toolkit version, yet we want folks to move to the WinUI version.

Inspiration

With the work we've been doing in Labs, I thought it could be interesting to see how far we could take extending a control to add extra behavior on top of it without having to completely own the whole implementation.

Expander seemed like a good candidate to override a property, provide extra values to the enum, and modify the XAML template to add this extra orientation behavior with the LayoutTransform helper we have in the Toolkit.

Proposed Solution

Luckily Expander is unsealed (thus why microsoft/microsoft-ui-xaml#780 is so valuable)!

We copy the template for Expander and add in a LayoutTransform and some visual states bound to an override enum for the ExpandDirection.

I've already done some initial work to show we can inherit from and provide our own style for a WinUI control in Labs. Can be found here: https://github.com/michael-hawker/Labs-Windows/tree/llama/expander-ex/labs/Expander

There's also some additional items we could investigate, like adding Footer support as came up from the #333 PR.

Open Questions

• Build on top of MUXC Expander
• Left/Right Orientation
• Footer Property (outside expanded content)
• Investigate:
  • Collapsed/Expanded Event for Expander Control microsoft/microsoft-ui-xaml#5495
  • Proposal: Add the Ability to Cancel Expand/Collapse of the Expander microsoft/microsoft-ui-xaml#4407

API Reference Docs

• Toolkit Expander
• Expander guidance doc
• Expander WinUI 2
• Expander WinUI 3

References

• Proposal: Adding a Expander Control to the set of WinUI controls. microsoft/microsoft-ui-xaml#3279

Platform Issues

• Proposal: Add FrameworkElement.LayoutTransform microsoft/microsoft-ui-xaml#546
• Proposal: Unseal all the things microsoft/microsoft-ui-xaml#780