DataTemplate с разделителем в StatusBar, который имеет ItemSource - PullRequest
0 голосов
/ 09 апреля 2020

Итак, у меня есть этот 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>

, который возвращает StatusBar, который начинается с разделителя и имеет один элемент

enter image description here

Теперь у меня есть другой StatusBar, который имеет динамический c список элементов с указанным c шаблоном.

  <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>

enter image description here

Это является результатом второй строки состояния. Сепараторы выглядят совершенно по-разному: один цвет - черный для разделителя «stati c», а для разделителя «dynamici c» - белый. Кроме того, высота отличается.

Есть ли способ, которым я могу сделать StatusBar, который имеет пользовательский контроль в качестве шаблона и добавить разделители между каждым элементом? Я попытался добавить разделитель внутри UserControl, но результат такой же, как вы можете видеть здесь, разделитель очень маленький и теперь принимает полную высоту StatusBar.

1 Ответ

1 голос
/ 09 апреля 2020

Есть ли способ, которым я могу создать StatusBar с пользовательским контролем в качестве шаблона и добавить разделители между каждым элементом?

Вы должны использовать 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>

Кроме того, я применил стиль StatusBar.Separator к Separator в ItemContainerStyle, чтобы получить строку состояния по умолчанию внешний вид разделителя.

Результат :

Result showing status bar separators

Вот ссылка на документы для дальнейшего ознакомления со стандартными стилями и шаблонами StatusBar.

...