UWP CommandBar More Button not showing unless size changed

Question

My question is almost the same question as here.

My CommandBar is supposed to have these buttons:

<CommandBar
    DefaultLabelPosition="Right"
    Style="{StaticResource PlaylistCommandBarStyle}">
    <AppBarButton
        Icon="Shuffle"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <AppBarButton
        Icon="Add"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <AppBarButton
        Icon="Rename"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <AppBarButton
        Icon="Pin"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <AppBarButton
        Icon="Clear"
        Style="{StaticResource PlaylistAppBarButtonStyle}"
        Visibility="Collapsed" />
    <AppBarButton
        Icon="Delete"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
</CommandBar>

When the window size is not large enough to hold the last delete button, it should go to overflow and then show a More Button instead. However, the more button is not shown unless I resize the window.

The answer here is very complicated. I wonder if there is a simpler solution.

PlaylistAppBarButtonStyle is here.

PlaylistCommandBarStyle is here.

Richard Zhang - MSFT Richard Zhang - MSFT · Accepted Answer · 2019-10-21T09:59:27

The CommandBar's overflow button has two conditions.

The first is that the screen width is not enough to display the full list of buttons.

The second is that CommandBar.SecondaryCommands is not empty.

You can try moving the unimportant buttons into the SecondaryCommands list.

<CommandBar
    DefaultLabelPosition="Right"
    Style="{StaticResource PlaylistCommandBarStyle}">
    <AppBarButton
        Icon="Shuffle"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <AppBarButton
        Icon="Add"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <AppBarButton
        Icon="Rename"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <AppBarButton
        Icon="Pin"
        Style="{StaticResource PlaylistAppBarButtonStyle}" />
    <CommandBar.SecondaryCommands>
        <AppBarButton
            Icon="Clear"
            Style="{StaticResource PlaylistAppBarButtonStyle}"
            Visibility="Collapsed" />
        <AppBarButton
            Icon="Delete"
            Style="{StaticResource PlaylistAppBarButtonStyle}" />
    </CommandBar.SecondaryCommands>
</CommandBar>

Best regards.

UWP CommandBar More Button not showing unless size changed

1 Answers