Можно ли эмулировать коллапс границы (аля CSS) в WPF ItemsControl? - PullRequest
Новая
       40

Можно ли эмулировать коллапс границы (аля CSS) в WPF ItemsControl?

11 голосов
/ 01 января 2011

Я оформляю элементы в WPF ListBox и хочу поставить рамку вокруг каждого элемента.Например, если для BorderThickness установлено значение 1, верхние и нижние границы между соседними элементами нарисованы и поэтому выглядят «толще» боковых границ, как показано:

ListBoxItem border example

Шаблон элемента, который производит эти ListBoxItems: 

<DataTemplate>
  <Border BorderThickness="1" BorderBrush="DarkSlateGray" Background="DimGray" Padding="8 4 8 4">        
    <TextBlock Text="{Binding Name}" FontSize="16"/>
  </Border>
</DataTemplate>

Я бы хотел "свернуть" эти смежные границы, как можно, например, через CSS .Мне известно, что BorderThickness может быть определено отдельно для левой / правой / верхней / нижней границ, но это также влияет на границу первого или последнего элемента, что нежелательно.

IsЕсть ли способ сделать это с WPF?Свойство Border мне не хватает, или оно требует другого подхода к созданию границ?

Ответы [ 3 ]

9 голосов
/ 02 января 2011

Используйте BorderThickness="1,0,1,1" и DataTrigger, который проверяет, является ли RelativeSource={RelativeSource Mode=PreviousData} значением null для установки BorderThickness="1,1,1,1": 

<Window x:Class="CollapseBordersDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:sys="clr-namespace:System;assembly=mscorlib"
        Title="MainWindow" Height="239" Width="525">
  <Window.Resources>
    <x:Array x:Key="ListBoxItems" Type="{x:Type sys:String}">
      <sys:String>Alice</sys:String>
      <sys:String>Bob</sys:String>
      <sys:String>Colleen</sys:String>
    </x:Array>
    <DataTemplate x:Key="ListBoxTemplate">
      <Border x:Name="Border" BorderThickness="1,0,1,1" BorderBrush="DarkSlateGray" Background="LightGray" Padding="8 4 8 4">
        <TextBlock Text="{Binding}" FontSize="16"/>
      </Border>
      <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=PreviousData}}" Value="{x:Null}">
          <Setter TargetName="Border" Property="BorderThickness" Value="1,1,1,1"/>
        </DataTrigger>
      </DataTemplate.Triggers>
    </DataTemplate>
  </Window.Resources>
  <Grid>
    <ListBox ItemsSource="{StaticResource ListBoxItems}" ItemTemplate="{StaticResource ListBoxTemplate}" HorizontalContentAlignment="Stretch" />
  </Grid>
</Window>
1 голос
/ 01 января 2011

Одна вещь, которая приходит на ум, - это использовать AlternationIndex.Это потребует от вас установить что-то вроде AlternationCount="10000" в ListBox.После этого вы можете установить BorderThickess="1,0,1,1" и использовать DataTrigger, чтобы найти первый ListBoxItem 

<DataTemplate>
  <Border x:Name="border" BorderThickness="1,0,1,1" BorderBrush="DarkSlateGray" Background="DimGray" Padding="8 4 8 4">        
    <TextBlock Text="{Binding Name}" FontSize="16"/>
  </Border>
  <DataTemplate.Triggers>
    <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}},
                                   Path=(ItemsControl.AlternationIndex)}"
                 Value="0">
      <Setter TargetName="border" Property="BorderThickness" Value="1,1,1,1"/>
    </DataTrigger>
  </DataTemplate.Triggers>
</DataTemplate>
0 голосов
/ 02 января 2011

Вы можете добавить 

 Margin="0,0,0,-1" SnapsToDevicePixels="True"

к определению границы

...