Skip to content

Investigate making public styles or public properties for MauiNavigationView #30179

@daltzctr

Description

@daltzctr

Description

I recently faced a challenge of wanting to implement some custom styling of Shell to fit more common WinUI3 idioms. Using the Community Toolkit WinUI rework as a reference, I implemented some UI such that

  • Toggle button and back button are always visible and are stacked on top of each other (this is default WinUI3 NavigationView behavior)
  • Toggling between Left (expanded) and LeftCompact (minimal) is sticky between navigations

During this exercise, I noticed that WinUI3 forcibly makes the TogglePaneGrid a fixed width of 78px, probably assuming that the layout is fixed. This property is not public and I found no XAML way to define the templates to override these defaults.

As such, I had to resort to reflection to access and modify the following properties

  • PaneToggleButtonGrid
    • Set the container width to 50px so it fits what WinUI3 expects (I think WinUI3 actually expects 48, but I digress)
  • NavigationViewBackButton
    • Set the MaxWidth and Translation of this to center, as MAUI applies margins and widths on this element itself
  • TogglePaneButton
    • Same as NavigationViewBackButton
  • PaneContentGrid
    • Since MAUI does not actually use WinUI3 footer items, but makes the entire layout a CustomContent, this means that WinUI3 default behavior of hiding the "expanded" items and showing just the "icons" does not work. This results in strange behavior where the layout would "disappear" because the width was being set to 48px. I worked around this by setting a MinWidth on this element.

Public API Changes

Providing a documented XAML way of customizing Shell navigation to fit more flexible idoms (use WinUI3 documentation as a reference) or at least opening up the underlying content properties.

Intended Use-Case

Being able to customize the Shell navigation a bit further.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions