複数列をもつTreeViewについて

以前の記事でも書いた複数列を持つTreeViewについて、独自でいろいろと改良したコントロールをdllにして、プロジェクトに組み込んでいたが、dllでの利用がやはりなれないので、シンプルにしたものを作成した。（MultiColumnTreeView）
以前の記事：https://inakaprogrammer.blogspot.com/2017/10/treelistview.html

（参照元：https://www.codeproject.com/Articles/24973/TreeListView）




まずは展開・非展開のToggleButtonをよく見る「＋」「－」へ変更している。
あとは、カーソルのあるテキストボックスの背景色を変更するために、独自コントロールを作成し、DataTemplateとして指定できるようにしている。状況によってはコンボボックスやDatePickerなどを設置できるようにするべきかもしれない。

別プロジェクトとしてdllを作成するほどではないので、下記のサンプルプロジェクトの中では、TreeListViewフォルダをプロジェクト内に作成し、そのフォルダを別プロジェクトに移して、名前空間を修正したうえで、App.xamlに下記のソースを追加すれば使えるようになるはず。

<Application x:Class="MultiColumnTreeView.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:MultiColumnTreeView"
             StartupUri="MainWindow.xaml">
    <Application.Resources>

        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="TreeListView/TreeListViewStyle.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>

    </Application.Resources>
</Application>


各画面での利用例

       <TreeListView:TreeListView x:Name="treeView" Background="White" AllowsColumnReorder="True" ItemsSource="{Binding TreeRoot}" >
            <TreeListView:TreeListView.ItemTemplate>
                <HierarchicalDataTemplate ItemsSource="{Binding Children}" />
            </TreeListView:TreeListView.ItemTemplate>

            <TreeListView:TreeListView.Columns>

                <GridViewColumn Header="分類" Width="200">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <!-- Marginで左右から-6pxとしないとHearder部のタイトルとラインの位置がずれる.GridViewの既知の不具合 -->
                            <Border BorderBrush="Black"  BorderThickness="0,0,0.5,0" Margin="-6,0,-6,0">
                                <DockPanel   >
                                    <!--TreeListViewExpanderは必ず最初の列に設置-->
                                    <TreeListView:TreeListViewExpander Focusable="False"/>
                                    <TreeListViewSubControls:TreeListItemTextBox Text="{Binding Text}" VerticalContentAlignment="Center" VerticalAlignment="Stretch" Margin="2,2,2,2"
                                                                  HorizontalAlignment="Stretch" BorderThickness="0" Opacity="1"  TabIndex="1" />
                                </DockPanel>
                            </Border>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>

                <GridViewColumn Header="期限" Width="80">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <!-- Marginで左右から-6pxとしないとHearder部のタイトルとラインの位置がずれる.GridViewの既知の不具合 -->
                            <Border BorderBrush="Black"  BorderThickness="0,0,0.5,0" Margin="-6,0,-6,0">
                                <DockPanel   >
                                    <TreeListViewSubControls:TreeListItemTextBox Text="{Binding Limit}" VerticalContentAlignment="Center" VerticalAlignment="Stretch" Margin="2,2,2,2"
                                                                  HorizontalAlignment="Stretch"  HorizontalContentAlignment="Center" BorderThickness="0" Opacity="1"  TabIndex="1" />
                                </DockPanel>
                            </Border>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>

            </TreeListView:TreeListView.Columns>
        </TreeListView:TreeListView>

サンプルプロジェクト

＜DownLoad＞

https://sites.google.com/site/mmbloguserfile/wai-bufairu/20190704_MultiColumnTreeView.zip