2017-11-06 13 views
2

ObservableCollection<ElementType>コレクションにバインドするComboBoxがあります。名前とタイプの両方のプロパティがnullに設定されている選択できないセパレータが必要です。 nameが文字列に設定され、Typeがnullの場合、選択不可能なヘッダー/タイトルにします。そうでなければ、要素を選択可能な要素にしたいが、わずかなマージンを持たせたい。ComboBox要素のスタイリング

私がこれまでしています場所です:

enter image description here

私の二つの問題があります:

  • 選択項目は、完全な名前空間ではなく、名前の文字列でのElementTypeオブジェクトとして示されています。
  • 有効になっている要素の強調表示がMouseOverに表示されなくなりました。

XAML:

<ComboBox Grid.Column="1" Grid.Row="2" Style="{StaticResource ElementTypeComboBoxStyle}" 
      ItemsSource="{Binding Path=Element.ElementTypeList}" 
      SelectedItem="{Binding Path=Element.SelectedElementType}"> 
    <ComboBox.Resources> 
     <converters:NullToBooleanConverter x:Key="NullToBooleanConverter" /> 
    </ComboBox.Resources> 
    <ComboBox.ItemContainerStyle> 
     <Style TargetType="{x:Type ComboBoxItem}"> 
      <Style.Triggers> 
       <MultiDataTrigger> 
        <MultiDataTrigger.Conditions> 
         <Condition Binding="{Binding Path=Name, Converter={StaticResource NullToBooleanConverter}}" Value="True" /> 
         <Condition Binding="{Binding Path=Type, Converter={StaticResource NullToBooleanConverter}}" Value="True" /> 
        </MultiDataTrigger.Conditions> 
        <Setter Property="IsEnabled" Value="False" /> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type ComboBoxItem}"> 
           <Separator HorizontalAlignment="Stretch" /> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </MultiDataTrigger> 
       <MultiDataTrigger> 
        <MultiDataTrigger.Conditions> 
         <Condition Binding="{Binding Path=Name, Converter={StaticResource NullToBooleanConverter}}" Value="False" /> 
         <Condition Binding="{Binding Path=Type, Converter={StaticResource NullToBooleanConverter}}" Value="True" /> 
        </MultiDataTrigger.Conditions> 
        <Setter Property="IsEnabled" Value="False" /> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type ComboBoxItem}"> 
           <TextBlock Text="{Binding Path=Name}" /> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </MultiDataTrigger> 
       <MultiDataTrigger> 
        <MultiDataTrigger.Conditions> 
         <Condition Binding="{Binding Path=Name, Converter={StaticResource NullToBooleanConverter}}" Value="False" /> 
         <Condition Binding="{Binding Path=Type, Converter={StaticResource NullToBooleanConverter}}" Value="False" /> 
        </MultiDataTrigger.Conditions> 
        <Setter Property="IsEnabled" Value="True" /> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type ComboBoxItem}"> 
           <TextBlock Text="{Binding Path=Name}" Margin="10,0,0,0" /> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </MultiDataTrigger> 
      </Style.Triggers> 
     </Style> 
    </ComboBox.ItemContainerStyle> 
</ComboBox> 

のC#:

public class ElementType { 
    public ElementType(string name, Type type) { 
     Name = name; 
     Type = type; 
    } 
    public string Name { get; private set; } 
    public Type Type { get; private set; } 
} 

private static ObservableCollection<ElementType> _elementTypeList = new ObservableCollection<ElementType> { 
    // Controls 
    new ElementType("Controls:", null), 
    new ElementType("Analog Output Slider", typeof(AnalogOutputSliderControl)), 
    new ElementType("Digital Output Button", typeof(DigitalOutputButtonControl)), 

    new ElementType(null, null), // Separator 

    // Indicators 
    new ElementType("Indicators:", null), 
    new ElementType("Numeric Value", typeof(NumericValueIndicator)), 
    new ElementType("ROV Illustration", typeof(RovIllustration)), 
    new ElementType("Trend Graph", typeof(TrendGraphIndicator)), 

    new ElementType(null, null), // Separator 

    // Generic element 
    new ElementType("None", typeof(Element)) 
}; 
[XmlIgnore] 
public static ObservableCollection<ElementType> ElementTypeList { get { return _elementTypeList; } } 
+1

テキストのために、ドロップダウンのために異なるテンプレートを使用することにより解決することができる最初の問題は、([この質問]を参照してくださいhttps://stackoverflow.com/q/4672867/1997232)。もう一つは、あなたが望むものがはっきりしない。また、このソリューションは矢印キーの選択(ドロップダウンなし)でどのように機能しますか? – Sinatr

+0

@SinatrはこれがTemplate Selectorの完璧なシナリオであると指摘しています。 – XAMlMAX

+1

ハイライトを維持する最も簡単な方法は、何も無効にしないでください。セパレータは検証中に 'SelectedItem'として設定されます。それは矢印キーでも動作します。 – Sinatr

答えて

0

私はそれが私のニーズのために少し重いと考えられているので、私は、テンプレートセレクタのために行くことはない選びました。私はXAMLの問題を回避する方法を見つけ、次の結果を得ました。セパレータとヘッダは無効になっているため、矢印キーも使用できます。ヘッダーのグレー色は「問題」だけですが、今のままにしておきます。

enter image description here

XAML:

<ComboBox Grid.Column="1" Grid.Row="2" Style="{StaticResource ElementTypeComboBoxStyle}" 
      ItemsSource="{Binding Path=Element.ElementTypeList}" 
      SelectedItem="{Binding Path=Element.SelectedElementType}"> 
    <ComboBox.Resources> 
     <converters:NullToBooleanConverter x:Key="NullToBooleanConverter" /> 
    </ComboBox.Resources> 
    <ComboBox.ItemTemplate> 
     <DataTemplate> 
      <TextBlock Text="{Binding Path=Name}" /> 
     </DataTemplate> 
    </ComboBox.ItemTemplate> 
    <ComboBox.ItemContainerStyle> 
     <Style TargetType="{x:Type ComboBoxItem}"> 
      <Setter Property="IsEnabled" Value="False" /> 
      <Style.Triggers> 
       <MultiDataTrigger> 
        <MultiDataTrigger.Conditions> 
         <Condition Binding="{Binding Path=Name, Converter={StaticResource NullToBooleanConverter}}" Value="True" /> 
         <Condition Binding="{Binding Path=Type, Converter={StaticResource NullToBooleanConverter}}" Value="True" /> 
        </MultiDataTrigger.Conditions> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type ComboBoxItem}"> 
           <Separator HorizontalAlignment="Stretch" /> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </MultiDataTrigger> 
       <MultiDataTrigger> 
        <MultiDataTrigger.Conditions> 
         <Condition Binding="{Binding Path=Name, Converter={StaticResource NullToBooleanConverter}}" Value="False" /> 
         <Condition Binding="{Binding Path=Type, Converter={StaticResource NullToBooleanConverter}}" Value="False" /> 
        </MultiDataTrigger.Conditions> 
        <Setter Property="IsEnabled" Value="True" /> 
        <Setter Property="Padding" Value="10,0,0,0" /> 
       </MultiDataTrigger>        
      </Style.Triggers> 
     </Style> 
    </ComboBox.ItemContainerStyle> 
</ComboBox> 
関連する問題