Appbar Button label positions automatically UWP

问题

I am working on a UWP app. I am using Appbar buttons to show quick Icon buttons for actions. The issue is, The labels automatically get placed horizontally to the icon while some are still placed below the icon. Is there any way they the label position can be fixed? Below is the picture for clearer understanding of the issue:

But ideally I want them to look like below

Is there any way of making sure they(the icons and their respective labels) remain vertically aligned. Below is my code:

<AppBarButton Label="Share" Grid.Column="2" HorizontalAlignment="Center">
    <AppBarButton.Icon>
        <PathIcon HorizontalAlignment="Center" Data="ShareIconPathDataHere"/>
    </AppBarButton.Icon>
</AppBarButton>
<AppBarButton Label="Add to" Grid.Column="3" HorizontalAlignment="Center">
    <AppBarButton.Icon>
        <PathIcon HorizontalAlignment="Center" Data="AddToIconPathDataHere"/>
    </AppBarButton.Icon>
</AppBarButton>
<AppBarButton Label="Report" Grid.Column="4" HorizontalAlignment="Center">
    <AppBarButton.Icon>
        <PathIcon HorizontalAlignment="Center" Data="ReportIconPathDataHere"/>
    </AppBarButton.Icon>
</AppBarButton>

回答1:

When AppBarButton is used inside a CommandBar, setting the position of the label is as easy as setting the DefaultLabelPosition of the CommandBar to Bottom.

Outside of it, there are a couple of things you could try.

Try setting IsCompact="False" on each AppBarButton.
If 1. doesn't work, go grab the default style for the AppBarButton here, and remove the Storyboard under the visual state LabelOnRight. So even when control asks the label to align right, there's no state to set it hence nothing visually will be changed.

Hope this helps.

来源：https://stackoverflow.com/questions/44754973/appbar-button-label-positions-automatically-uwp

标签

xaml

uwp