2013-04-29 72 views
1

我有一個帶有UniformGrid的ListBox作爲其ItemsPanel。基本上,我不想將項目顯示爲帶有邊框的矩形。我使用UniformGrid作爲ItemsPanel,我可以控制通過綁定顯示的行數和列數。合併包含在列表框中的項目的邊框

我正在使用ListBox的ItemContainerStyle設置每個項目的邊框。我可以指定BorderThickness,它確實出現在列表中的所有項目周圍。問題是,邊界不合併爲給予「雙邊框」對相鄰的項目相鄰的項目。我如何控制每件商品的邊框,使每件商品都有獨特的厚度,即使它們可能有相鄰的商品。

這裏是縮小代碼

<ListBox x:Name="lstGroups" ItemsSource="{Binding Groups}" Grid.Row="1" Style="{StaticResource RelayDispositionStyle}" 
        SelectedItem="{Binding SelectedGroup}" gs:DragDropExtension.ScrollOnDragDrop="True" 
        ItemContainerStyle="{StaticResource ItemContainerStyle}" 
        > 
</ListBox> 

<Style x:Key="RelayDispositionStyle" TargetType="{x:Type ListBox}" BasedOn="{StaticResource {x:Type ListBox}}"> 
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/> 

    <Setter Property="ItemsPanel"> 
     <Setter.Value> 
      <ItemsPanelTemplate> 
       <UniformGrid Rows="{Binding ElementName=Racks, Path=SelectedItem.NoOfRows}" 
            Columns="{Binding ElementName=Racks, Path=SelectedItem.GroupsPerRow}" 
            HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,10,0,0"> 
       </UniformGrid> 
      </ItemsPanelTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 


<Style x:Key="RelayDispositionItemContainerStyle" TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource {x:Type ListBoxItem}}"> 
    <Setter Property="BorderThickness" Value="1"/> 
    <Setter Property="BorderBrush" Value="MidnightBlue"/> 
</Style> 
+0

可能,''爲項目併爲整個列表框設置左側和頂部邊框? – Vladimir 2013-04-29 12:17:30

+0

隨着值=「0,0,1,1」,相鄰的單元具有正確邊界的厚度,但在頂行中的細胞失去它們的上緣,並在最左邊的列中的單元失去其左邊界! – Jatin 2013-04-29 12:22:38

+0

嘗試換用UniformGrid邊界,這'了borderThickness = 「1,1,0,0」'。 – Vladimir 2013-04-29 12:32:37

回答

1

您可以使用切緣陰性一招:
1.設置網格利潤率<UniformGrid Margin="1,11,0,0">。然後左邊和頂部還有1px,這是項目邊框的粗細。
2.將項目邊距設置爲<Setter Property="Margin" Value="-1,-1,0,0"/>。更正確或更偏向於的項目將與鄰居重合。最左邊和最上面的項目填充1px的網格邊距。

0

我碰到與TabControl/TabItem相同的問題,但問題是相同的。我通過retemplating的TabItem的解決這個問題(在你的情況下,它會是一個ListBoxItem)將觸發改變邊界(首先注意到的ControlTemplateTrigger)。

爲了使其工作,你必須讓你的第一個項目不知何故diffrent ...我選擇將我的第一個項目的標籤設置爲「第一」以觸發觸發器。 (TabControl.Item [0] = .TAG 「第一」 填充的TabControl之後)

<Style x:Key="styleTabItemMetro" TargetType="{x:Type TabItem}"> 
     <Setter Property="Background" Value="Transparent" /> 
     <Setter Property="Foreground" Value="Green" /> 
     <Setter Property="Margin" Value="0 0 0 0" /> 
     <Setter Property="Padding" Value="5 2" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type TabItem}"> 
        <Grid Margin="{TemplateBinding Margin}" 
          Background="{TemplateBinding Background}"> 
         <Border Margin="0 4" 
           Name="borderBorder" 
           BorderBrush="#FF8C8E94" BorderThickness="1 0 0 0" CornerRadius="0" /> 
         <Grid Cursor="Hand" Margin="{TemplateBinding Padding}"> 
          <ContentPresenter x:Name="ContentSite" 
               ContentSource="Header" 
               Margin="12,2" 
               RecognizesAccessKey="True"> 
           <ContentPresenter.Resources> 
            <Style TargetType="{x:Type TextBlock}"> 
             <Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type TabItem}}, Path=Foreground}" /> 
            </Style> 
           </ContentPresenter.Resources> 
          </ContentPresenter> 
         </Grid> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <DataTrigger Binding="{Binding Path=Tag, RelativeSource={RelativeSource Mode=Self}}" Value="First"> 
          <Setter TargetName="borderBorder" Property="BorderThickness" Value="0"/> 
         </DataTrigger> 
         <Trigger Property="IsSelected" Value="True"> 
          <Setter Property="Background" Value="#FFF9F9F9" /> 
          <Setter Property="Padding" Value="0 1 0 0" /> 
          <Setter Property="Margin" Value="0 0 0 0" /> 
          <Setter Property="Panel.ZIndex" Value="100" /> 
         </Trigger> 
         <Trigger Property="IsMouseOver" Value="True"> 
          <Setter Property="Background" Value="Green" /> 
          <Setter Property="Foreground" Value="White"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
     <Style.Triggers> 
      <Trigger Property="IsSelected" Value="True"> 
       <Setter Property="Background" Value="{StaticResource ResourceKey=brushHeaderBackground}" /> 
       <Setter Property="Foreground" Value="White"/> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 
相關問題