1

(VS 2010を使用)私はWPFが初めてで、2つの画像とテキストを表示するTreeViewItemを作成しようとしています。これを行うには、StackPanel を使用しています。モデル プロパティの変更に応じて最初の画像を表示/非表示にしたいので、幅を 0 に設定するトリガーを追加しました。

 <TreeView.ItemTemplate>
            <HierarchicalDataTemplate ItemsSource="{Binding Children}">

                <StackPanel Orientation="Horizontal" Margin="2" SnapsToDevicePixels="True" Width="Auto">
                    <Image Width="16" Height="16">
                        <Image.Style>
                            <Style TargetType="{x:Type Image}">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding LinkType}" Value="Co">
                                        <Setter Property="Source" Value="/Images/Image1.png"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding LinkType}" Value="Post">
                                        <Setter Property="Width" Value="0"/>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Image.Style>
                    </Image>

                    <Image Source="/Images/Image2.png"
                        Width="15"
                        Height="15"
                        SnapsToDevicePixels="True" Margin="3,0"/>
                    <TextBlock Text="{Binding Name}" Margin="5,0" />
                </StackPanel>



            </HierarchicalDataTemplate>
        </TreeView.ItemTemplate>

これにより、実際には画像が非表示になりますが、空のギャップが残ります。スタックパネルの残りのアイテムは、最初の画像の「削除」を考慮して左にスライドしません。Visibility へのトリガーも試してみましたが、同じ結果が得られました。

StackPanel の項目を追加/削除、表示/非表示、または幅 = 0 などに変更して、残りの項目がそれに応じて位置を再調整できるようにする方法はありますか? または、これにはstackpanelよりも優れたコンテナがありますか?

4

1 に答える 1

1

はい。TreeView を使用している場合、TreeView の直接の「子」は実際には Image コントロールではありません。Image コントロールは TreeViewItem コントロール内に含まれています。これらは自動的に生成され、TreeView がその子をより直感的な方法で処理できるようにします (すべてのコントロールに TreeView の子に必要なプロパティ/関数を強制的に実装する必要はありません)。

これらの TeeViewItems をカスタマイズするのは簡単です。これらは画像と同じ DataContext を共有するため、次のように TreeView.ItemContainerStyle を設定できます。

<TreeView>
    <TreeView.ItemContainerStyle>
        <Style TargetType="{x:Type TreeViewItem}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding LinkType}" Value="Post">
                    <Setter Property="Visibility" Value="Collapsed"/>
                </DataTrigger>
            </Style.Triggers> 
        </Style>
    </TreeView.ItemContainerStyle>
</TreeView>
于 2012-09-10T14:44:55.830 に答える