具有 ItemSsource 的状态栏中带有分隔符的 DataTemplate

Question

所以我有这个 StatusBar

  <StatusBar x:Name="RightSideStaticStatusBar" Grid.Column="2">
                <StatusBar.Background>
                    <SolidColorBrush Color="AliceBlue" Opacity="0.5"></SolidColorBrush>
                </StatusBar.Background>
                <Separator></Separator>
                <StatusBarItem HorizontalAlignment="Right" HorizontalContentAlignment="Stretch" Width="300">

                </StatusBarItem>
            </StatusBar>

其中 returns 一个以分隔符开头且有一项的 StatusBar

现在我有另一个 StatusBar，它有一个带有特定模板的动态项目列表。

  <StatusBar x:Name="StatusBar" ItemsSource="{Binding}" Grid.Column="1">
                <StatusBar.Background>
                    <SolidColorBrush Color="Red" Opacity="0.5"/>
                </StatusBar.Background>
                <StatusBar.ItemTemplate>
                    <DataTemplate>                    

                        <StackPanel Orientation="Horizontal">
                            <uc:StatusBarItem/>
                            <Separator>
                                <Separator.LayoutTransform>
                                    <RotateTransform Angle="90" />
                                </Separator.LayoutTransform>
                            </Separator>
                        </StackPanel>
                    </DataTemplate>
                </StatusBar.ItemTemplate>
            </StatusBar>

这是第二个状态栏的结果。分隔符的外观完全不同，"static" 分隔符的颜色为黑色，"dynamic" 分隔符的颜色为白色。而且身高也不一样

有没有办法制作一个以用户控件为模板的 StatusBar，并在每个项目之间添加分隔符？我尝试在 UserControl 中添加分隔符，但结果与您在此处看到的相同，分隔符非常小，现在占据了 StatusBar 的整个高度。

Answer 1

Is there a way I can make a StatusBar that has an usercontrol as template and add separators between each item?

您应该使用 ItemContainerStyle 以获得所需的结果：

<StatusBar.ItemContainerStyle>
    <Style TargetType="StatusBarItem" BasedOn="{StaticResource {x:Type StatusBarItem}}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="StatusBarItem">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="5"/>
                        </Grid.ColumnDefinitions>
                        <ContentPresenter />
                        <Separator Grid.Column="1"  Style="{StaticResource {x:Static StatusBar.SeparatorStyleKey}}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</StatusBar.ItemContainerStyle>

那么你的 ItemTemplate 就会变成：

<StatusBar.ItemTemplate>
    <DataTemplate>
        <uc:StatusBarItem/>
    </DataTemplate>
</StatusBar.ItemTemplate>

此外，我在 ItemContainerStyle 中的 Separator 上应用了 StatusBar.Separator 样式以获得默认的状态栏分隔符外观。

结果:

这里有 link 到 docs 供进一步阅读 StatusBar 默认样式和模板。

具有 ItemSsource 的状态栏中带有分隔符的 DataTemplate

DataTemplate With separator in StatusBar that has ItemSource

wpf

statusbar

itemscontrol