wpf - 更改标题栏的高度

Question

问题：我们可以更改MahApps.Metro中显示的标题栏的高度吗？

详细信息：例如，在 MahApps 团队的以下 XAML示例中，我想在 CupCake 的图像下方显示Deploy CupCake内容TextBlock。所以我Orientation="Horizontal"从StackPanel以下 XAML 中删除了。如下面的快照所示，内容Deploy CupCake现在显示在 CupCake 的图像下方 - 但它几乎隐藏了所有内容。我们怎样才能让这些内容全部显示在 CupCake 图像下方？

带有 MahApps.Metro 的工具栏快照：只有大约 10% 的内容显示在图像下方。

<mah:MetroWindow x:Class="SampleApp.MainWindow"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                 xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
                 xmlns:mah="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                 Title="MainWindow"
                 Width="800"
                 Height="450"
                 GlowBrush="{DynamicResource MahApps.Brushes.Accent}"
                 ResizeMode="CanResizeWithGrip"
                 WindowStartupLocation="CenterScreen"
                 mc:Ignorable="d">

  <mah:MetroWindow.LeftWindowCommands>
    <mah:WindowCommands>
      <Button Click="LaunchGitHubSite" ToolTip="Open up the GitHub site">
        <iconPacks:PackIconModern Width="22"
                                  Height="22"
                                  Kind="SocialGithubOctocat" />
      </Button>
    </mah:WindowCommands>
  </mah:MetroWindow.LeftWindowCommands>

  <mah:MetroWindow.RightWindowCommands>
    <mah:WindowCommands>
      <Button Click="DeployCupCakes" Content="Deploy CupCakes">
        <Button.ContentTemplate>
          <DataTemplate>
            <StackPanel Orientation="Horizontal">
              <iconPacks:PackIconModern Width="22"
                                        Height="22"
                                        VerticalAlignment="Center"
                                        Kind="FoodCupcake" />
              <TextBlock Margin="4 0 0 0"
                         VerticalAlignment="Center"
                         Text="{Binding}" />
            </StackPanel>
          </DataTemplate>
        </Button.ContentTemplate>
      </Button>
    </mah:WindowCommands>
  </mah:MetroWindow.RightWindowCommands>

  <Grid>
    <!--  Your content  -->
  </Grid>
</mah:MetroWindow>

标签： wpfxamlmahapps.metro

Answer 1

首先，最好使用 a 来使用在其内容之间分配可用空间Grid的面板，例如 a ，以防止像使用StackPanel. 在这里，数据模板定义了Grid具有两行的 a，其中TextBlock缩放到所需的大小，并且图标占据了剩余的可用空间。还要注意HorizontalAlignment图标的 ，它是居中的。

<DataTemplate>
   <Grid>
      <Grid.RowDefinitions>
         <RowDefinition/>
         <RowDefinition Height="Auto"/>
      </Grid.RowDefinitions>
      <iconPacks:PackIconModern Grid.Row="0"
                                Width="22"
                                Height="22"
                                HorizontalAlignment="Center"
                                Kind="FoodCupcake" />
      <TextBlock Grid.Row="1"
                 Margin="4 0 0 0"
                 VerticalAlignment="Center"
                 Text="{Binding}" />
   </Grid>
</DataTemplate>

使用 a 也可以实现相同的结果DockPanel，其中最后一个子项（在本例中为图标）占用剩余的可用空间，因此定义控件的顺序很重要。

<DataTemplate>
   <DockPanel>
      <TextBlock DockPanel.Dock="Bottom"
                 Margin="4 0 0 0"
                 VerticalAlignment="Center"
                 Text="{Binding}" />
      <iconPacks:PackIconModern DockPanel.Dock="Top"
                                Width="22"
                                Height="22"
                                HorizontalAlignment="Center"
                                Kind="FoodCupcake" />
   </DockPanel>
</DataTemplate>

在这两种情况下，您都会得到下面的结果，一个带有居中图标的按钮和一个下面的文本。

要使按钮更加突出，请使用TitleBarHeight属性更改标题栏高度。

<mah:MetroWindow x:Class="SampleApp.MainWindow"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
         xmlns:mah="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         Title="MainWindow"
         Width="800"
         Height="450"
         GlowBrush="{DynamicResource MahApps.Brushes.Accent}"
         ResizeMode="CanResizeWithGrip"
         WindowStartupLocation="CenterScreen"
         mc:Ignorable="d"
         TitleBarHeight="50">