突出显示WPF中的整个TreeViewItem行

如果我设置TreeViewItem背景,它只突出显示标题.我怎样才能突出整条线？

我发现了一个几乎解决问题的帖子http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/b04f73e2-0b10-4d97-a6da-64df2e30c21d/

但是存在一些问题:1.它没有突出整行2.树在Vista上有XP风格.我希望它在Vista上的外观和原来一样,但如果用户将主题更改为XP - 它应该是XP方式.这么多XAML ......

任何想法,我应该寻找什么？

在这里,我们去了,第三次魅力.如果你想要这样的东西.

这个需要更多的工作.我确信有很多方法可以做到这一点,但是这个方法使用Length Converter和TreeViewItem扩展方法来获得深度.这两者都与TreeViewItem可视化树紧密耦合,因此如果您开始搞乱模板,那么您可能会遇到麻烦.同样,这是重要的部分,下面是完整的代码.

TreeViewDepth扩展

public static class TreeViewItemExtensions
{
    public static int GetDepth(this TreeViewItem item)
    {
        TreeViewItem parent;
        while ((parent = GetParent(item)) != null)
        {
            return GetDepth(parent) + 1;
        }
        return 0;
    }

    private static TreeViewItem GetParent(TreeViewItem item)
    {
        var parent = VisualTreeHelper.GetParent(item);
        while (!(parent is TreeViewItem || parent is TreeView))
        {
            parent = VisualTreeHelper.GetParent(parent);
        }
        return parent as TreeViewItem;
    }
}

LeftMarginMultiplierConverter

public class LeftMarginMultiplierConverter : IValueConverter
{
    public double Length { get; set; }

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var item = value as TreeViewItem;
        if (item == null)
            return new Thickness(0);

        return new Thickness(Length * item.GetDepth(), 0, 0, 0);
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new System.NotImplementedException();
    }
}

控制

完整的TreeViewItem样式

TreeViewItem标题不会拉伸？

出现此问题的原因是WPF的默认模板TreeViewItem设置为3列2行Grid.第一行用于"标题"(实际上是a Border),第二行用于ItemsPresenter.根据需要使两行可见或隐藏,以便在单击小三角形时实现树展开 - 它占据了零的三角形Grid.

这两行实际上只需要一个额外的列.例如,在第二行中,我们必须在col-0,row-1处没有任何内容,因为当空白时,该空白部分应缩进IsExpanded.但是当我们注意到ItemsPresenter基于第1行第1行的指定时,这个谜就开始了Grid.ColumnSpan=2.

不幸的是,在顶行中,Border保存标题的设置为Grid.Column=1...但没有ColumnSpan.由于COL-2的Grid已Width=*这意味着页眉/边界不会水平地伸展.

换句话说,我似乎没有任何目的,除了专门防止标头拉伸.据我所知,一个简单的2x2安排会更灵活[编辑:见脚注#2],并通过常规对齐机制支持全拉伸或 '锯齿'标头非拉伸WPF.

理想情况下,我们将更Grid改为只有2列而不是3.因为这不是那么容易,而是我们将使标题跨越2列,就像那样ItemsPresenter.

好的,这是一个小型的,完整的,独立的(仅限XAML)工作程序,它演示并修复了这个问题:

如果您运行此程序如图所示,您将看到类似这样的内容.这是固定行为,它允许您重新获得对TreeViewItem标头的拉伸行为的完全控制:

注意BEGIN/END部分在XAML源中带有虚线.基本上,我只是设置Grid.ColumnSpan=2了违规Border,以便它将填充拉伸的宽度Grid.该元素是由发射TreeViewItem模板,所以我发现,以改变其性能的有效方法是通过靶向Style在资源字典中的TreeViewItem的Style.是的,令人困惑.这Style是通过访问TreeViewItem.ItemContainerStyle.

要查看(现有的)损坏行为,您可以注释掉虚线之间的部分:

您也可以在某些资源字典中设置这些样式,而不是ItemContainerStyle像我在这里一样使用该属性.我这样做是因为它最小化了修复的范围,因此Border不会影响不相关的控件.如果你确实需要一种更具辨别力的方法来定位这个控件,你可能能够利用它具有的事实Name='Bd'.

[编辑:] 这个解决方案并没有使用反射!不要被无意义的演示数据吓到 - 它与此问题无关; 它只是获取一些分层数据用于演示目的的最简单方法,同时保持整个程序很小.

[编辑#2:]我刚刚意识到设计师试图通过3x2网格布置避免的是以下难看的效果(通过缩小的屏幕截图在这里夸大).因此,如果您采用此页面中的一个解决方案,请预先警告您可能不需要此:

如果你的意思是这样的截图

全宽TreeViewItem http://www.bendewey.com/code/treeViewFullWidth2.png

更新 如上所述,这个例子的缩写是在子项目上缩进

全宽TreeViewItem http://www.bendewey.com/code/treeViewFullWidth2a.png

那么这应该对你有所帮助.它也基于http://msdn.microsoft.com/en-us/library/ms788727.aspx你可以将TreeViewItem的模板更改为StackPanel并将ItemsPanel左边距设置为19.然后在TreeView中设置Horizo​​ntalContentAlignment = "伸展".我在下面附上了整个资源,但这里是重要的部分.

控制

资源