Question

我有一个RadDataGrid，用于显示一些业务数据。除了一列之外的所有列都是一个集合大小，因此有一个应该扩展以填补空白。当页面展开时，网格会展开，一列会随之增长。当我尝试缩小页面时，网格保持相同的大小，页面变为滚动条。如果我非常缓慢地缩小页面，我可以让它缩小，但是一旦鼠标加速，它就会松开并停止收缩。我尝试将它包装在网格或RelativePanel中，但两者都没有区别。

我查看了使用网格的示例代码和Enterprise Contorso演示，他们似乎可以根据需要进行扩展和缩小。

示例XAML：

<Page x:Class="RadDataGridTest.MainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="using:RadDataGridTest"
  xmlns:Grid="using:Telerik.UI.Xaml.Controls.Grid"
  xmlns:telerikGridPrimitive="using:Telerik.UI.Xaml.Controls.Grid.Primitives"
  xmlns:Primitives="using:Telerik.UI.Xaml.Controls.Primitives"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  mc:Ignorable="d"
  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

<Grid>
    <Grid:RadDataGrid ItemsSource="{x:Bind DataItems, Mode=OneWay}"
                      UserGroupMode="Disabled"
                      UserFilterMode="Disabled"
                      UserColumnReorderMode="None"
                      UserSortMode="None"
                      AutoGenerateColumns="False"
                      GridLinesVisibility="Horizontal">
        <Grid:RadDataGrid.Columns>
            <Grid:DataGridNumericalColumn Header="1"
                                          PropertyName="Key"
                                          SizeMode="Auto" />
            <Grid:DataGridTextColumn Header="2"
                                     PropertyName="First"
                                     SizeMode="Auto" />
            <Grid:DataGridTextColumn Header="3"
                                     PropertyName="Second"
                                     SizeMode="Auto" />
            <Grid:DataGridTextColumn Header="Stretchy"
                                     PropertyName="Stretch" />
            <Grid:DataGridTextColumn Header="5"
                                     PropertyName="SecondLast"
                                     SizeMode="Auto" />
            <Grid:DataGridTextColumn Header="6"
                                     PropertyName="Last"
                                     SizeMode="Auto" />
            <Grid:DataGridNumericalColumn Header="7"
                                          PropertyName="Count"
                                          SizeMode="Auto" />
        </Grid:RadDataGrid.Columns>
    </Grid:RadDataGrid>
</Grid>

对我可能做错的任何帮助？

Answer 1

我能够重现这一点。您没有做错任何事情，当窗口大小发生变化时，中心列应调整大小。

我已将其添加到待办事项中，您可以在此反馈门户项目中进行投票和关注：

https://feedback.telerik.com/Project/167/Feedback/Details/250207-datagrid-when-start-and-end-columns-are-auto-sized-the-middle-stretch-sized-col

当您订阅时，您会在项目状态发生变化时收到通知。

解决方法

有一种解决方法，你可以试试。如果您将Stretchy列SizeMode设置为Fixed，则可以在DataGrid的大小更改时手动调整其大小。

第1步 - 订阅DataGrid.SizedChanged并将 Stretchy 列SizeMode设置为Fixed

<grid:RadDataGrid SizeChanged="DataGrid_OnSizeChanged" ...>
    <grid:RadDataGrid.Columns>
        ...
        <grid:DataGridTextColumn Header="Stretchy"
                                 PropertyName="Stretch"
                                 SizeMode="Fixed"
                                 Width="200"/>
        ...
    </grid:RadDataGrid.Columns>
</grid:RadDataGrid>

第2步 - 在OnSizeChanged中，使用可用空间更新Stretchy列的宽度（请参阅我的代码注释）

private void DataGrid_OnSizeChanged(object sender, SizeChangedEventArgs e)
{
    // for performance improvement only do this when the resize is larger than 1 px
    if (e.NewSize.Width - e.PreviousSize.Width > 1)
        return;

    if (sender is RadDataGrid dg && dg.Columns.Count > 0)
    {
        var middleColumn = dg.Columns[3];

        if (middleColumn == null)
            return;

        double autoColumnsWidthTotal = 0;

        // iterate over all the other columns and add the total width
        foreach (var column in dg.Columns)
        {
            if (column != middleColumn)
            {
                autoColumnsWidthTotal = autoColumnsWidthTotal + column.Width;
            }
        }

        // Get the remaining with available for the "Stretchy" column
        var remainingSpace = e.NewSize.Width - autoColumnsWidthTotal;

        // Set the Stretchy column's width using the remaingin space
        // IMPORTANT: You need to set the column's SizeMode to Fixed in order for it to respect the Width value.
        middleColumn.Width = remainingSpace;
    }
}

Answer 2

以防其他人想看看我是如何接受Lance的回答并让它按照我的需要运作的：

    private void OnLayoutUpdated(object sender, object e)
    {
        if (agendaDataGrid == null || agendaDataGrid.Columns.Count <= 0
            || ItemNameColumn == null)
        {
            return;
        }

        // iterate over all the other columns and add the total width
        double autoColumnsWidthTotal = agendaDataGrid.Columns.Sum(c => c.ActualWidth)
            - ItemNameColumn.ActualWidth;

        if (autoColumnsWidthTotal < 10)
            return;

        // Get the remaining with available for the "Stretchy" column
        double remainingSpace = agendaDataGrid.ActualWidth
            - agendaDataGrid.Margin.Left - agendaDataGrid.Margin.Right
            - agendaDataGrid.Padding.Left - agendaDataGrid.Padding.Right
            - autoColumnsWidthTotal - 5;

        if (remainingSpace < 100)
        {
            remainingSpace = 100;
        }

        // Set the Stretchy column's width using the remaining space
        // IMPORTANT: You need to set the column's SizeMode to Fixed
        // in order for it to respect the Width value.
        ItemNameColumn.Width = remainingSpace;
    }

UWP Telerik RadDataGrid随页面扩展，但不会缩小

2 个答案:

解决方法