Question

我有一个用c＃编写的WPF应用程序。我需要创建一个全宽背景的工具栏，中间的工具栏按钮。

这是我的XAML代码

<ToolBarPanel ToolBarTray.IsLocked="True"
              Style="{StaticResource ContentRoot}">

    <ToolBar VerticalAlignment="Center"
             HorizontalAlignment="Center"
             Loaded="ToolBar_Loaded"
             MinWidth="{Binding RelativeSource={RelativeSource AncestorType={x:Type ToolBarTray}}, Path=ActualWidth}">

        <StackPanel Orientation="Horizontal">
            <Button VerticalAlignment="Center"
                    Command="{Binding StepBackward}"
                    ToolTipService.ToolTip="Go to previous page"
                    ToolTipService.Placement="Mouse"
                    Height="32">

                <fa:FontAwesome Icon="StepBackward"
                                FontSize="18" />
            </Button>

            <Button VerticalAlignment="Center"
                    HorizontalAlignment="Center"
                    Command="{Binding Backward}"
                    ToolTipService.ToolTip="Go to first page"
                    ToolTipService.Placement="Mouse"
                    Height="32">

                <fa:FontAwesome Icon="Backward"
                                FontSize="18" />
            </Button>

            <TextBox Text="{Binding PageNumber}"
                     Width="50"
                     TextAlignment="Center"
                     VerticalAlignment="Center"
                     Padding="0, 4"
                     IsReadOnly="True"
                     ToolTipService.ToolTip="Current selected page"
                     ToolTipService.Placement="Mouse"
                     Height="32" />

            <Label Content="{Binding OfPageCount}"
                   Padding="5"
                   Height="32" />

            <Button VerticalAlignment="Center"
                    Command="{Binding Forward}"
                    ToolTipService.ToolTip="Go to last page"
                    ToolTipService.Placement="Mouse"
                    Height="32">

                <fa:FontAwesome Icon="Forward"
                                FontSize="18" />
            </Button>

            <Button VerticalAlignment="Center"
                    Command="{Binding StepForward}"
                    ToolTipService.ToolTip="Go to next page"
                    ToolTipService.Placement="Mouse"
                    Height="32">

                <fa:FontAwesome Icon="StepForward"
                                FontSize="18" />
            </Button>

            <ComboBox ItemsSource="{Binding PageSizes}"
                      SelectedItem="{Binding SelectedPageSize, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
                      DisplayMemberPath="Text"
                      SelectedValuePath="Value"
                      VerticalAlignment="Center"
                      HorizontalAlignment="Center"
                      HorizontalContentAlignment="Center"
                      Width="75"
                      Padding="0, 5"
                      ToolTipService.ToolTip="Show selected amount of records per page"
                      ToolTipService.Placement="Mouse"
                      Height="32" />



            <ComboBox ItemsSource="{Binding Pages}"
                      SelectedItem="{Binding SelectedPage, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
                      DisplayMemberPath="Text"
                      SelectedValuePath="Value"
                      VerticalAlignment="Center"
                      HorizontalAlignment="Center"
                      HorizontalContentAlignment="Center"
                      Width="75"
                      Padding="0, 5"
                      ToolTipService.ToolTip="Go to selected page"
                      ToolTipService.Placement="Mouse"
                      Height="32" />


            <Label Content="{Binding OfItemCount}"
                   Padding="5"
                   Height="32" />

        </StackPanel>
    </ToolBar>
</ToolBarPanel>

我的代码显示中心的按钮已消耗，但背景“ToolBarPanel”并未根据需要一直延伸到屏幕上。

如何在工具栏上拉伸背景？

Answer 1

这是another SO question

的解决方案

     <!-- ... -->
     <ToolBar VerticalAlignment="Center"
         HorizontalAlignment="Stretch"
         MinWidth="{Binding RelativeSource={RelativeSource AncestorType={x:Type ToolBarTray}}, Path=ActualWidth}">

            <ToolBar.Resources>
                <Style TargetType="{x:Type DockPanel}">
                    <Setter Property="HorizontalAlignment" Value="Center" />
                </Style>
            </ToolBar.Resources>

            <StackPanel Orientation="Horizontal">
     <!-- ... -->

要使其有效，我必须更改HorizontalAlignment的{{1}}并将其设置为ToolBar并添加Stretch样式覆盖。

如果您甚至不使用DockPanel样式，为什么要改变它？ default WPF ToolBar style使用一个，因此我们的代码会覆盖此内部DockPanel以确保我们的内容居中。请注意，此样式覆盖将应用于DockPanel个孩子中的所有DockPanel，因为现在您不会使用任何内容，但如果您有一天添加一个，则您要么明确要么将其ToolBar设置为HorizontalAlignment或删除Left样式覆盖，并使用DockPanel {{1创建您自己的ToolBar样式（受默认样式启发）设置为DockPanel。

如何使用WPF应用程序中心的按钮创建全宽工具栏？

1 个答案: