ListBox/Прямоугольник Поле, Изменение Look выбранного элемента, Связующее для выбранного элемента

Question

Несколько вопросов относительно ListBox здесь (3) на самом деле

1. ListBoxItem/Полей Прямоугольника

С изображение, я думаю, что поля неровные, слева кажется, что у него больше поля. И это, когда мои поля уже установлено в

<ListBox.ItemTemplate> 
    <DataTemplate> 
     <Rectangle Width="20" Height="20" Margin="1,2,2,2"> 
      <Rectangle.Fill> 
       <SolidColorBrush Color="{Binding}" /> 
      </Rectangle.Fill> 
     </Rectangle> 
    </DataTemplate> 
</ListBox.ItemTemplate> 

2. Как я могу изменить выбранный элемент Посмотрите?

Мне не нужен этот синий фон, могу ли я просто иметь границу?

Я попробовал пример из Change WPF DataTemplate for ListBox item if selected

с этим кодом

<ListBox.ItemContainerStyle> 
    <Style TargetType="ListBoxItem"> 
     <Setter Property="ContentTemplate"> 
      <Setter.Value> 
       <DataTemplate> 
        <Rectangle Width="20" Height="20" Margin="1,2,3,2"> 
         <Rectangle.Fill> 
          <SolidColorBrush Color="{Binding}" /> 
         </Rectangle.Fill> 
        </Rectangle> 
       </DataTemplate> 
      </Setter.Value> 
     </Setter> 
     <Style.Triggers> 
      <Trigger Property="IsSelected" Value="True"> 
       <Setter Property="ContentTemplate"> 
        <Setter.Value> 
         <DataTemplate> 
          <Border BorderBrush="DarkGray" BorderThickness="1"> 
           <Rectangle Width="20" Height="20" Margin="1,2,3,2"> 
            <Rectangle.Fill> 
             <SolidColorBrush Color="{Binding}" /> 
            </Rectangle.Fill> 
           </Rectangle> 
          </Border> 
         </DataTemplate> 
        </Setter.Value> 
       </Setter> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 
</ListBox.ItemContainerStyle> 

и получил что-то вроде

3. Связывание для выбранного элемента

Я пытаюсь привязать выбранный цвет к свойству модели представления. Если цвет в модели просмотра не существует в списке цветов, цвет не должен быть выбран. Подумайте об этом как альтернативном способе выбора цвета, у меня есть выбор цветов с помощью ползунков RGB/HSB. Я попытался

<ListBox ItemsSource="{Binding ThemeColors}" SelectedValue="{Binding Color}" SelectionChanged="ListBox_SelectionChanged" ... 

затем в C#

private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e) 
{ 
    var listBox = (ListBox)sender; 
    if (listBox.SelectedValue != null) 
     Color = (Color)listBox.SelectedValue; 
} 

Но после того, когда я пытаюсь выбрать цвета с ползунками, я получаю некоторые странные подергивания, а иногда и цвет всегда щелкнет назад к цвету выбранного из в поле списка. Но иногда это прекрасно работает, я довольно смущен.

Answer 1

1.ListBoxItem поставляется с по умолчанию «2,0,0,0», поэтому маржа кажется. Это может быть изменено в ItemContainerStyle в ListBox

<ListBox.ItemContainerStyle> 
    <Style TargetType="{x:Type ListBoxItem}"> 
     <Setter Property="Padding" Value="0,0,0,0"/> 
    </Style> 
</ListBox.ItemContainerStyle> 

(Хотя я, кажется, чтобы получить лучший результат с Перетяжка 1,0,0,0. Не могу объяснить, что ..)

2. Чтобы удалить фон и отобразить только границу, я думаю, вам придется перемотать элемент ListBoxItem и изменить триггеры, чтобы использовать BorderBrush вместо Background for the Border.

<ListBox.ItemContainerStyle> 
    <Style TargetType="{x:Type ListBoxItem}"> 
     <Setter Property="Padding" Value="0,0,0,0"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type ListBoxItem}"> 
        <Border x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1" Padding="{TemplateBinding Padding}"> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
        </Border> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsSelected" Value="true"> 
          <Setter Property="BorderBrush" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> 
          <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/> 
         </Trigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="Selector.IsSelectionActive" Value="false"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="BorderBrush" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> 
          <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
         </MultiTrigger> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</ListBox.ItemContainerStyle> 

Для 3. Я не уверен, я понимаю, что вы хотите сделать