1

Miller Columnインターフェイスを WPF に実装するのに苦労しており、誰かが私が借用できる実装を見たことがあるかどうか疑問に思っていました。私はいくつかの検索を行いましたが、自分で何も見つけることができません。

現在、TreeView に配置できるようにデータを階層に編成していますが、Miller 列ビューをプログラムのオプションとして追加したいと考えています。

4

2 に答える 2

1

更新こことここ にあるいくつかのブログ投稿でソリューションを強化しました。新しいバージョンでは、MVVMを使用したより一般的なアプローチが可能です。

考えられる解決策が思い浮かび、Philはそれが正しいアプローチであることを確認しました。水平StackPanelをItemsPanelとして使用するItemsControlを使用する必要があります。次に、データ型のDataTemplateを作成し、ItemsControlのItemTemplateに使用しました。

データテンプレート：

<DataTemplate x:Key="DataNodeStackedDataTemplate" DataType="my:DataNode">
    <ListBox ItemsSource="{Binding Children}"
             Style="{StaticResource StackedListBoxStyle}"/>
</DataTemplate>

ItemsControl：

<ItemsControl x:Name="MillerColumnsView" VerticalContentAlignment="Stretch"
              ItemTemplate="{StaticResource DataNodeStackedDataTemplate}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

コードビハインド：

private void StackedListBox_SelectionChanged(object sender,
                                             SelectionChangedEventArgs e)
{
    var lb = sender as ListBox;
    if (lb == null) return;
    var dn = lb.DataContext as DataNode;
    if (dn == null) return;
    int index = MillerColumnsView.Items.IndexOf(dn);
    if (index == -1) return;
    index++;
    while (MillerColumnsView.Items.Count > index)
        MillerColumnsView.Items.RemoveAt(index);
    if (dn.Children == null) return;
    // this Select() call performs some restructuring of the tree to 
    // appropriate display the correct nodes in the next ListBox
    dn.Select(dn.AvailableItems.ElementAt(lb.SelectedIndex));
    if (dn.Children.Count() == 0) return;
    MillerColumnsView.Items.Add(dn.Children.ElementAt(0));
}

これにより、選択レベルごとにリストボックスが自動的に削除および作成されます。少しスタイルを整えると、それもきれいに見えるかもしれません！

于 2012-05-23T13:14:37.897 に答える
1

Miller Columns の UI は、リンクされた複数の ListBox コントロールのように見えます。

例を次に示します: WPF MVVM 階層で選択された項目

于 2012-05-22T14:44:35.717 に答える