Port TabbedCommandBar

[niels9001]

Base Porting Checklist

Preview Give feedback

1. Component name (to CommunityToolkit.WinUI.Controls.TabbedCommandBar)
2. Redesign, following the latest WinUI design guidelines
3. Merge differences from UWP main to WinAppSDK / Uno forks
4. Support for WASM via Uno Platform
5. Improve Samples
6. All brought over tests pass for UWP/WinAppSDK

Known Issues

Preview Give feedback

No tasks being tracked yet.

Improvements

Preview Give feedback

No tasks being tracked yet.

Notable Changes

N/A

[michael-hawker]

Talked to @yoshiask and they're going to take an initial look at it, thanks!

@niels9001 if we get the initial port in, maybe you can take a quick look at the template for styling?

[niels9001]

Talked to @yoshiask and they're going to take an initial look at it, thanks!

@niels9001 if we get the initial port in, maybe you can take a quick look at the template for styling?

Awesome! Yep, for sure - happy to help!

[mdtauk]

Having a quick look at Paint's VisualTree...

<Ribbon>
    <ScrollContentPresenter>
        <Grid> // With columns for each toolbar/group
            <Border>
                <CollapsedToolbar> <!-- Contents change as width narrows and isCollapsed changes -->
                    <Grid>
                        <Border x:Name="ContentHolder"> <!-- contains the Buttons that display in this toolbar -->
                            <!-- ... Custom Controls containing Buttons, SplitButtons, etc -->
                        </Border>
                        <Button x:Name="CollapsedButton"> <!-- The Button that displays when the toolbar isCollapsed -->
                    <TextBlock> <!-- The Name of the toolbar/group -->

• The CollapsedButton is hidden when the CollapsedToolbar isCollapsed = False
• The Contents of the CollapsedToolbar render in a flyout when it is collapsed, whilst the CollapsedButton remains in the Ribbon

I would guess there are Visual States that collapse as the width changes and goes below a threshold.

[mdtauk]

Office and Outlook puts their toolbar controls within a floating panel

Something like this perhaps?