1

Caliburn.MicroフレームワークでMVVMパターンを使用して、非常に複雑なComboBoxを持つはずのWPFでビューを構築しています。私はWPFとCaliburnにまったく慣れていないので、ここで正しい答えを見つけられることを願っています.

これは私が想像するものです：
拡張コンボボックス

ご覧のとおり、さまざまな種類のアイテムとさまざまな子レベルで構成されています。グループではなく、アイテムのみが選択可能です。それに加えて、選択したアイテムが属するアイテム グループに応じて、コンボ ボックスに 2 つの追加ボタンを表示したいと思います。
縮んだコンボボックス

私はできることを知っています：

  • このように XAML でコンボボックスをハードコードしますが、ビュー モデルにデータを含める必要があるため、実際には機能しません。
  • ビュー モデルでコントロール ツリーをプログラムで定義し、コンボボックスのコンテンツ プロパティをそれにバインドします。しかし、ビュー モデルでビジュアルを作成するのは少し間違っているようです。
  • コンボボックス項目のビュー モデル (およびビュー) を作成し、さまざまなプロパティを設定して、それぞれの外観を制御します。
  • ComboBox から派生したまったく新しいコントロールを作成し、これを何らかの方法で実装します。

2 つのボタンについては、おそらくコンボボックスの上に配置して、メイン ビュー モデルから表示を制御できます。

これらすべてのオプションを検討した結果、自分がここで何をしているのか、まだ確信が持てません。

4

1 に答える 1

3

テンプレートを使用して ComboBox のスタイルを変更し、目的の外観にすることができます。
簡単な例を次に示します。

XAML

<ComboBox Width="200" Height="30" ItemsSource="{Binding ItemList}">
    <ComboBox.ItemContainerStyle>
        <Style>
            <Setter Property="UIElement.IsEnabled" Value="{Binding IsSelectable}" />
        </Style>
    </ComboBox.ItemContainerStyle>
    <ComboBox.ItemTemplate>
        <DataTemplate >
            <StackPanel Orientation="Horizontal">
                <Image Name="ImageControl" Source="{Binding ImagePath}" Width="10" Height="10" />
                <Label Content="{Binding Name}" >
                    <Label.Style>
                        <Style TargetType="Label">
                            <Style.Triggers>
                                <Trigger Property="IsEnabled" Value="False">
                                    <Setter Property="Foreground" Value="Black" />
                                    <Setter Property="FontWeight" Value="Bold" />
                                </Trigger>
                            </Style.Triggers>
                        </Style>
                    </Label.Style>
                </Label>
            </StackPanel>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding IsSelectable}" Value="False">
                    <Setter TargetName="ImageControl" Property="Visibility" Value="Collapsed" />
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

C#

// A class to hold my data for the combobox
public class Item
{
    public string Name { get; set; }
    public bool IsSelectable { get; set; }
    public string ImagePath { get; set; }
}

// In your datacontext
public ObservableCollection<Item> ItemList { get; set; }

public ComboBoxFun()
{
    ItemList = new ObservableCollection<Item>()
    {
        new Item() { ImagePath=@"/images/up.png", Name="Item Group 1", IsSelectable=false},
        new Item() { ImagePath=@"/images/up.png", Name="Item 1", IsSelectable=true},
        new Item() { ImagePath=@"/images/up.png", Name="Item 2", IsSelectable=true},
        new Item() { ImagePath=@"/images/up.png", Name="Item 3", IsSelectable=true},
        new Item() { ImagePath=@"/images/up.png", Name="Item Group 2", IsSelectable=false},
        new Item() { ImagePath=@"/images/up.png", Name="Item 1", IsSelectable=true},
        new Item() { ImagePath=@"/images/up.png", Name="Item 2", IsSelectable=true},
        new Item() { ImagePath=@"/images/up.png", Name="Item 3", IsSelectable=true}
    };

唯一のトリッキーな部分は、項目を無効にすると、無効としてスタイルが設定されるため、選択できない項目をスタイルして、正常に表示されるようにする必要があることです。

ここに私の結果があります：

結果

非グループ項目を選択でき、通常の ComboBox のように機能します。ボタンに関しては、選択した項目のデータに基づいてボタンの表示を簡単に制御できます。

お役に立てれば。

于 2013-01-31T15:57:11.153 に答える