WPF中GridView内嵌FrameworkElement：如何动态更新列宽？

嘿，这个场景我太熟了！之前帮团队做类似的自定义列自适应的时候踩过不少坑，核心就是要让GridViewColumn能实时感知到模板里CustomControl的宽度变化，然后自动调整到最宽的那个控件的宽度。给你几个实用的实现思路，按需选：

方法一：手动监听控件尺寸变化（简单直接） #

如果你的项目规模不大，或者只需要在某一个GridView里实现，直接给CustomControl绑定SizeChanged事件，然后在事件处理里遍历所有行的控件，找到最大宽度再更新列宽就行。

XAML 代码 #

<GridView x:Name="MyGridView" ItemsSource="{Binding DataList}">
    <GridViewColumn Header="自定义列">
        <GridViewColumn.CellTemplate>
            <DataTemplate>
                <!-- 给自定义控件绑定SizeChanged事件 -->
                <local:MyCustomControl SizeChanged="CustomControl_SizeChanged" />
            </DataTemplate>
        </GridViewColumn.CellTemplate>
    </GridViewColumn>
</GridView>

后台代码 #

private void CustomControl_SizeChanged(object sender, SizeChangedEventArgs e)
{
    var customCtrl = sender as MyCustomControl;
    if (customCtrl == null) return;

    // 从视觉树里找到对应的GridViewCell和列
    var gridCell = VisualTreeHelper.GetParent(customCtrl) as GridViewCell;
    var targetColumn = gridCell?.Column;
    if (targetColumn == null) return;

    double maxWidth = 0;
    // 遍历所有列表项，找到最宽的CustomControl
    foreach (var item in MyGridView.Items)
    {
        var listItem = MyGridView.ItemContainerGenerator.ContainerFromItem(item) as ListViewItem;
        if (listItem == null) continue;

        // 从模板里找到CustomControl实例
        var ctrl = listItem.ContentTemplate.FindName("MyCustomControl", listItem) as MyCustomControl;
        if (ctrl != null && ctrl.ActualWidth > maxWidth)
        {
            maxWidth = ctrl.ActualWidth;
        }
    }

    // 加上一点内边距，避免控件贴得太近
    targetColumn.Width = maxWidth + 10;
}

⚠️ 注意：如果你的ListView开启了虚拟化（默认可能开启），ItemContainerGenerator.ContainerFromItem可能会返回null（因为不可见的项不会生成容器）。这时候要么临时关闭虚拟化（VirtualizingStackPanel.IsVirtualizing="False"），要么监听ItemContainerGenerator.StatusChanged事件，等容器生成完再计算。

方法二：用附加属性封装（优雅复用） #

如果多个GridView都需要这个功能，把逻辑封装成附加属性会更优雅，不用重复写代码。下面是一个完整的实现：

附加属性代码 #

public static class GridViewColumnAutoFitHelper
{
    public static readonly DependencyProperty AutoFitToContentProperty =
        DependencyProperty.RegisterAttached(
            "AutoFitToContent", 
            typeof(bool), 
            typeof(GridViewColumnAutoFitHelper), 
            new PropertyMetadata(false, OnAutoFitToContentChanged));

    public static void SetAutoFitToContent(DependencyObject obj, bool value)
    {
        obj.SetValue(AutoFitToContentProperty, value);
    }

    public static bool GetAutoFitToContent(DependencyObject obj)
    {
        return (bool)obj.GetValue(AutoFitToContentProperty);
    }

    private static void OnAutoFitToContentChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        var column = d as GridViewColumn;
        if (column == null) return;

        var listView = FindParentListView(column);
        if (listView == null) return;

        if ((bool)e.NewValue)
        {
            // 监听容器生成状态，确保所有项都生成后再计算
            listView.ItemContainerGenerator.StatusChanged += Generator_StatusChanged;
            // 初始计算一次列宽
            UpdateColumnWidth(column, listView);
        }
        else
        {
            listView.ItemContainerGenerator.StatusChanged -= Generator_StatusChanged;
        }
    }

    private static void Generator_StatusChanged(object sender, EventArgs e)
    {
        var generator = sender as ItemContainerGenerator;
        if (generator.Status != GeneratorStatus.ContainersGenerated) return;

        var listView = generator.ItemsControl as ListView;
        var targetColumn = listView?.View as GridView?
            ?.Columns.FirstOrDefault(c => GetAutoFitToContent(c));

        if (targetColumn == null) return;

        // 给每个CustomControl绑定SizeChanged事件，实时更新列宽
        foreach (var item in listView.Items)
        {
            var listItem = generator.ContainerFromItem(item) as ListViewItem;
            if (listItem == null) continue;

            var customCtrl = FindVisualChild<MyCustomControl>(listItem);
            if (customCtrl != null)
            {
                customCtrl.SizeChanged += (s, args) => UpdateColumnWidth(targetColumn, listView);
            }
        }
    }

    private static void UpdateColumnWidth(GridViewColumn column, ListView listView)
    {
        double maxContentWidth = 0;
        foreach (var item in listView.Items)
        {
            var listItem = listView.ItemContainerGenerator.ContainerFromItem(item) as ListViewItem;
            if (listItem == null) continue;

            var customCtrl = FindVisualChild<MyCustomControl>(listItem);
            if (customCtrl != null && customCtrl.ActualWidth > maxContentWidth)
            {
                maxContentWidth = customCtrl.ActualWidth;
            }
        }

        // 计算列头的宽度，避免列宽比列头还窄
        double headerWidth = MeasureHeaderWidth(column);
        // 最终列宽取内容最大宽度和列头宽度的较大值，再加内边距
        column.Width = Math.Max(maxContentWidth + 10, headerWidth);
    }

    // 测量列头的所需宽度
    private static double MeasureHeaderWidth(GridViewColumn column)
    {
        if (column.HeaderTemplate != null)
        {
            var headerElement = column.HeaderTemplate.LoadContent() as FrameworkElement;
            headerElement.Measure(new Size(double.PositiveInfinity, double.PositiveInfinity));
            return headerElement.DesiredSize.Width;
        }
        // 如果没有模板，粗略估算文本宽度
        return column.Header.ToString().Length * 8;
    }

    // 视觉树查找子控件
    private static T FindVisualChild<T>(DependencyObject parent) where T : DependencyObject
    {
        for (int i = 0; i < VisualTreeHelper.GetChildrenCount(parent); i++)
        {
            var child = VisualTreeHelper.GetChild(parent, i);
            if (child is T target) return target;

            var result = FindVisualChild<T>(child);
            if (result != null) return result;
        }
        return null;
    }

    // 查找父级ListView
    private static ListView FindParentListView(DependencyObject obj)
    {
        while (obj != null && !(obj is ListView))
        {
            obj = VisualTreeHelper.GetParent(obj);
        }
        return obj as ListView;
    }
}

XAML 用法 #

<GridView ItemsSource="{Binding DataList}">
    <!-- 只需要给列加上这个附加属性就行 -->
    <GridViewColumn Header="自定义列" local:GridViewColumnAutoFitHelper.AutoFitToContent="True">
        <GridViewColumn.CellTemplate>
            <DataTemplate>
                <local:MyCustomControl />
            </DataTemplate>
        </GridViewColumn.CellTemplate>
    </GridViewColumn>
</GridView>

额外提示：MVVM场景的优化 #

如果你的CustomControl宽度变化是由ViewModel里的属性驱动的（比如绑定了一个ControlWidth属性），那可以直接监听ViewModel的属性变化，然后触发列宽更新，这样不用操作视觉树，更符合MVVM规范。比如在ViewModel里加一个PropertyChanged监听，当ControlWidth变化时，通知View重新计算列宽。

内容的提问来源于stack exchange，提问作者be_mi