15

WPF のマルチカラム ツリー ビューのようなコントロールをどこで取得できるか知っている人はいますか?

4

3 に答える 3

11

SharpDevelopには、探していることを行うListViewサブクラスが呼び出されます。SharpTreeView

SharpDevelop の「ウォッチ」ウィンドウで、このコントロールの実際の例を確認できます。

SharpTreeView の例

ウォッチ ウィンドウで使用される XAML (5.1.0 ベータ版と同様):

<tv:SharpGridView x:Key="variableGridView" AllowsColumnReorder="False">
    <GridView.Columns>
        <GridViewColumn Header="{core:Localize MainWindow.Windows.Debug.LocalVariables.NameColumn}" Width="200">
            <GridViewColumn.CellTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <tv:SharpTreeNodeView />
                        <local:AutoCompleteTextBox x:Name="name" Margin="-6 0 0 0"  MinWidth="100" Text="{Binding Node.Name}" IsEditable="{Binding Node.CanSetName}">
                            <local:AutoCompleteTextBox.ContextMenu>
                                <MultiBinding Converter="{StaticResource menuBuilder}">
                                    <Binding Path="Node.ContextMenuAddInTreeEntry" />
                                    <Binding Path="Node" />
                                </MultiBinding>
                            </local:AutoCompleteTextBox.ContextMenu>
                        </local:AutoCompleteTextBox>
                    </StackPanel>
                </DataTemplate>
            </GridViewColumn.CellTemplate>
        </GridViewColumn>
        <GridViewColumn Header="{core:Localize MainWindow.Windows.Debug.LocalVariables.ValueColumn}" Width="200">
            <GridViewColumn.CellTemplate>
                <DataTemplate>
                    <local:AutoCompleteTextBox
                        MinWidth="100"
                        Text="{Binding Node.Value}"
                        IsEditable="{Binding Node.CanSetValue}">
                        <local:AutoCompleteTextBox.ContextMenu>
                            <MultiBinding Converter="{StaticResource menuBuilder}">
                                <Binding Path="Node.ContextMenuAddInTreeEntry" />
                                <Binding Path="Node" />
                            </MultiBinding>
                        </local:AutoCompleteTextBox.ContextMenu>
                    </local:AutoCompleteTextBox>
                </DataTemplate>
            </GridViewColumn.CellTemplate>
        </GridViewColumn>
        <GridViewColumn Header="{core:Localize MainWindow.Windows.Debug.LocalVariables.TypeColumn}" Width="200">
            <GridViewColumn.CellTemplate>
                <DataTemplate>
                    <local:AutoCompleteTextBox MinWidth="100" Text="{Binding Node.Type}" IsEditable="False">
                        <local:AutoCompleteTextBox.ContextMenu>
                            <MultiBinding Converter="{StaticResource menuBuilder}">
                                <Binding Path="Node.ContextMenuAddInTreeEntry" />
                                <Binding Path="Node" />
                            </MultiBinding>
                        </local:AutoCompleteTextBox.ContextMenu>
                    </local:AutoCompleteTextBox>
                </DataTemplate>
            </GridViewColumn.CellTemplate>
        </GridViewColumn>
    </GridView.Columns>
</tv:SharpGridView>

リソースは、SharpTreeView コントロールの View プロパティに設定されます。

于 2012-06-13T10:56:40.993 に答える
9

古いブログ投稿hereに基づいてこれを実装しました。しかし、私の記憶が正しければ、物事を正しく機能させるために手作業をしなければなりませんでした。特にスクロールバーで。

しかし、それはあなたに良いスタートを与えるはずです。

于 2009-01-21T02:31:04.290 に答える
6

列ヘッダーが必要ない場合、これはかなり簡単です。アイテムコンテナテンプレートを提供し、右側に固定幅のグリッド列を追加して、アイテムの関連データにバインドするだけです。

TreeViewのデフォルトのアイテムコンテナには、次のように定義されたグリッドがあります(コメントが追加されています)。

    <Grid>
        <Grid.ColumnDefinitions>
            <!--Expander--><ColumnDefinition MinWidth="19" Width="Auto"/>
            <!--Item--><ColumnDefinition Width="Auto"/>
            <!--Overflow--><ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <!--Current Item--><RowDefinition Height="Auto"/>
            <!--Sub-items--><RowDefinition/>
        </Grid.RowDefinitions>
        <ToggleButton x:Name="Expander" ClickMode="Press" IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource ExpandCollapseToggleStyle}"/>
        <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Column="1" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
            <ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
        </Border>
        <ItemsPresenter x:Name="ItemsHost" Grid.ColumnSpan="2" Grid.Column="1" Grid.Row="1"/>
    </Grid>

したがって、このグリッドを拡張して、予測可能な幅の列を右側に含めるだけで、列が作成されます。

  • 新しい列の列定義を追加し、自動サイズ設定にします
  • 「ItemsHost」の列スパンを更新して、追加された列にまたがるようにします
  • その列に予測可能な幅のコントロールを追加します。

影響を受ける部分:

<Grid>
...
   <ColumnDefinition Width="Auto"/>
...
   <ItemsPresenter ... Grid.ColumnSpan="3" ... />
...
   <Border Grid.Column="3"><!--Add column data here--></Border>
...
</Grid>

追加された境界線がすべての行で同じ幅である場合、列のあるツリービューのように見えるビューが得られます。これは明らかに拡張性が高くありませんが、迅速で汚いソリューションが必要な場合は、外部コントロール/ライブラリの依存関係を追加せずに、数分でブレンドでこれを実行できるはずです。

私たちのニーズは急速に高まり、ツリーの外側に列ラベルを持つグリッドを追加し、そこにある列の幅をこれらの「列」の幅にデータバインドしました[実際には、自動サイズの列を使用して問題の列のスパニングコントロールの幅] それは機能します、それは私がその防衛で言うすべてです。

このアプローチは、すべての列にまたがる選択ボックス(「Bd」の境界線)を気にしない(または必要としない)場合は、アイテムコンテナーではなく、生成されたアイテムテンプレートで実行することもできます。

于 2013-03-14T13:55:56.670 に答える