向列表框添加一个矩形

Question

我已经为我的WPF列表框定义了样式，但是在顶部手动添加了一个矩形......以任何方式将其构建到列表框本身？所以目前我写的XAML为一个矩形，然后添加一个列表框下方的最终效果：

样式列表框

<Style BasedOn="{StaticResource {x:Type ListBox}}" 
    TargetType="ListBox" 
    x:Key="PinnedList"> 
    <Setter Property="Background"> 
     <Setter.Value> 
      <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> 
       <LinearGradientBrush.GradientStops> 
        <GradientStop Offset="0.0" Color="#90DDDD" /> 
        <GradientStop Offset="1.0" Color="#5BFFFF" /> 
       </LinearGradientBrush.GradientStops> 
      </LinearGradientBrush> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="ListBox"> 
       <Border Name="Border" Background="{StaticResource WhiteSolid}" BorderBrush="{StaticResource GreatTeaHeaderBrush}" BorderThickness="4" CornerRadius="2"> 
        <ScrollViewer Margin="0" Focusable="false"> 
         <StackPanel Margin="2" IsItemsHost="True" /> 
        </ScrollViewer> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

我需要做的目前得到的效果是什么（矩形然后列表框）：

   <Rectangle Height="20" Width="20" Fill="{StaticResource GreenTeaBrush}" Margin="-7,37,129,0" VerticalAlignment="Top" x:Name="ui_recPinnedORGs"> 
       <Rectangle.LayoutTransform> 
        <RotateTransform Angle="-45"/> 
       </Rectangle.LayoutTransform> 
      </Rectangle> 
      <ListBox Style="{StaticResource PinnedList}" Height="Auto" MaxHeight="200" Visibility="Hidden" HorizontalAlignment="Left" Margin="-8,45,0,0" SelectionChanged="ui_lsbPinnedORGs_SelectionChanged" 
        SelectedItem="{Binding Path=SelectedPinnedORGsViewModel, UpdateSourceTrigger=PropertyChanged, NotifyOnSourceUpdated=True, NotifyOnTargetUpdated=True, Mode=TwoWay}" 
        SelectionMode="Single" ItemsSource="{Binding Path=ORGViewModels, UpdateSourceTrigger=PropertyChanged, NotifyOnSourceUpdated=True, NotifyOnTargetUpdated=True, Mode=TwoWay}" 
        ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" 
        VerticalAlignment="Top" Width="158" Name="ui_lsbPinnedORGs"> 
       <ListBox.ItemTemplate> 
        <HierarchicalDataTemplate> 
         <Label Content="{Binding Path=ORG.Acronym, UpdateSourceTrigger=PropertyChanged, NotifyOnSourceUpdated=True}" /> 
        </HierarchicalDataTemplate> 
       </ListBox.ItemTemplate> 
      </ListBox> 

Answer 1

如果您提取列表框模板样式，您可以修改它。例如：

<Page.Resources> 
    <SolidColorBrush x:Key="ListBorder" Color="#828790"/> 
    <Style x:Key="ListBoxStyle1" TargetType="{x:Type ListBox}"> 
     <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/> 
     <Setter Property="BorderBrush" Value="{StaticResource ListBorder}"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> 
     <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/> 
     <Setter Property="ScrollViewer.CanContentScroll" Value="true"/> 
     <Setter Property="ScrollViewer.PanningMode" Value="Both"/> 
     <Setter Property="Stylus.IsFlicksEnabled" Value="False"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type ListBox}"> 
        <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="1" SnapsToDevicePixels="true"> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="Auto"/> 
           <RowDefinition/> 
          </Grid.RowDefinitions> 
          <!-- here's a simple rectange --> 
          <Rectangle Height="5" Fill="Blue" /> 
          <ScrollViewer Grid.Row="1" Focusable="false" Padding="{TemplateBinding Padding}"> 
           <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
          </ScrollViewer> 
         </Grid> 
        </Border> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> 
         </Trigger> 
         <Trigger Property="IsGrouping" Value="true"> 
          <Setter Property="ScrollViewer.CanContentScroll" Value="false"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Page.Resources> 

<Grid> 
    <ListBox Style="{DynamicResource ListBoxStyle1}"/> 
</Grid>