如何在 UWP 应用程序的紧凑模式下增加命令栏高度？答案

【问题标题】：How to increase the command bar height in compact mode in a UWP app?如何在 UWP 应用程序的紧凑模式下增加命令栏高度？
【发布时间】：2017-01-31 12:59:25
【问题描述】：

当属性“ClosedDisplayMode”设置为“Compact”时，我想增加命令栏的高度。我什至通过编辑默认样式来尝试它，但我无法解决它。请帮帮我。I have added the image of the commandbar to resize

【问题讨论】：

标签： xaml uwp uwp-xaml commandbar

【解决方案1】：

你的问题和它的标题是两个不同的东西，如果你想增加命令栏的高度，那么按照这个：

<Application.Resources>
   <x:Double x:Key="AppBarThemeCompactHeight">80</x:Double>
</Application.Resources>

如上一个答案所示，但如果您只想在应用处于紧凑模式时增加命令栏的高度，那么您必须使用如下视觉状态：

<VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="Normal">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="900"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Value="40" Target="{Themeresource AppBarThemeCompactHeight}"/>
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="Mobile">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="0"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Value="80" Target="{Themeresource AppBarThemeCompactHeight}"/>
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

【讨论】：

感谢您的回复。但我想我没有把问题说清楚。我的问题是我想在属性“ClosedDisplayMode”设置为“Compact”时增加命令栏的大小，而不是在应用程序处于紧凑模式时。

【解决方案2】：

在您的 App.xaml 页面中添加以下资源

 <Application.Resources>
    <x:Double x:Key="AppBarThemeCompactHeight">80</x:Double>
</Application.Resources>

现在高度会增加。默认高度是48，你可以根据你的要求改变

【讨论】：

如何以编程方式而不是在 XAML 文件中进行设置？