WinUI DataGrid (CommunityToolkit.WinUI.UI.Controls) - Resize of height is not working when user shrink or expand column

Chirag R. Pandya 0

  <ctWinUI:DataGrid x:Name="DataGrid"
                    AutoGenerateColumns="False"
                    CanUserSortColumns="True"
                    GridLinesVisibility="All"
                    Sorting="DataGrid_Sorting"
                    Grid.Row="1">
      <ctWinUI:DataGrid.Resources>
          <SolidColorBrush x:Key="DataGridColumnHeaderBackgroundBrush"
                           Opacity=".5" />
          <Style TargetType="TextBlock" x:Key="WrapText">
              <Setter Property="TextWrapping" Value="Wrap"/>
          </Style>
      </ctWinUI:DataGrid.Resources>
      <ctWinUI:DataGrid.Columns>
          <ctWinUI:DataGridTextColumn Header="Rank"
                                      Binding="{Binding Rank}"
                                      Tag="Rank" />
          <ctWinUI:DataGridComboBoxColumn Header="Mountain"
                                          Binding="{Binding Mountain}"
                                          Tag="Mountain" />
          <ctWinUI:DataGridTextColumn Header="Height (m)"
                                      Binding="{Binding Height_m}"
                                      Tag="Height_m" />
          <ctWinUI:DataGridTextColumn Header="Range"
                                      Binding="{Binding Range}"
                                      Tag="Range" />
          <ctWinUI:DataGridTextColumn Header="Parent Mountain"
                                      Binding="{Binding Parent_mountain}" ElementStyle="{StaticResource WrapText}"
                                      Tag="Parent_mountain" />
      </ctWinUI:DataGrid.Columns>
  </ctWinUI:DataGrid>

I have set Wrap data for "Parent Mountain" column and if user resize (shrink) column (first snapshot) and then expand column (2nd Snapshot). Datagrid row height is not refreshing based on content and you can see height of column is more even data is less. Could you please help me to fix it?

Jeanine Zhang-MSFT 9,431 Reputation points Microsoft Vendor

2024-01-16T07:47:47.66+00:00

According to the description, it is related to CommunityToolkit, I suggest you could post the issue to the Github for better help.

1 answer

Peter Fleischer (former MVP) 19,306

Hi,
in WPF DataGrid you can set RowHeight to double.NaN. May be it works in CommunityToolkit.

<Window x:Class="WpfApp1.Window056"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp056"
        xmlns:sys="clr-namespace:System;assembly=mscorlib"
        mc:Ignorable="d"
        Title="Window056" Height="450" Width="800">
  <Window.DataContext>
    <local:ViewModel/>
  </Window.DataContext>
    <Grid>
    <DataGrid ItemsSource="{Binding View}" AutoGenerateColumns="False" RowHeight="{x:Static sys:Double.NaN}">
      <DataGrid.Columns>
        <DataGridTextColumn Header="ID" Binding="{Binding ID}"/>
        <DataGridTextColumn Header="LongText" Binding="{Binding LongText}" Width="200">
          <DataGridTextColumn.ElementStyle>
            <Style>
              <Setter Property="TextBlock.TextWrapping" Value="Wrap" />
            </Style>
          </DataGridTextColumn.ElementStyle>
        </DataGridTextColumn>
      </DataGrid.Columns>
    </DataGrid>
    </Grid>
</Window>

Result:

Chirag R. Pandya 0

<ctWinUI:DataGrid
    x:Name="DataGrid"
    AutoGenerateColumns="False"
    CanUserSortColumns="True"
    controls:Grid.Row="1"
    GridLinesVisibility="All"
    Sorting="DataGrid_Sorting">
    <ctWinUI:DataGrid.Resources>
        <SolidColorBrush x:Key="DataGridColumnHeaderBackgroundBrush" Opacity=".5" />
        <Style x:Key="WrapText" TargetType="TextBlock">
            <Setter Property="TextWrapping" Value="Wrap" />
        </Style>
    </ctWinUI:DataGrid.Resources>
   <ctWinUI:DataGrid.RowStyle>     
   <Style TargetType="ctWinUI:DataGridRow">         
   <Setter Property="Height" Value="auto"/>      
   </Style> 
   </ctWinUI:DataGrid.RowStyle>
    <ctWinUI:DataGrid.Columns>
        <ctWinUI:DataGridTextColumn
            Binding="{Binding Rank}"
            Header="Rank"
            Tag="Rank" />
        <ctWinUI:DataGridComboBoxColumn
            Binding="{Binding Mountain}"
            Header="Mountain"
            Tag="Mountain" />
        <ctWinUI:DataGridTextColumn
            Binding="{Binding Height_m}"
            Header="Height (m)"
            Tag="Height_m" />
        <ctWinUI:DataGridTextColumn
            Binding="{Binding Range}"
            Header="Range"
            Tag="Range" />
        <ctWinUI:DataGridTextColumn
            Binding="{Binding Parent_mountain}"
            ElementStyle="{StaticResource WrapText}"
            Header="Parent Mountain"
            Tag="Parent_mountain" />
    </ctWinUI:DataGrid.Columns>
</ctWinUI:DataGrid>

public HomePage()
{
    this.InitializeComponent();
    this.Loaded += HomePage_Loaded;
}

private async void HomePage_Loaded(object sender, RoutedEventArgs e)
{
    DataGrid.ItemsSource = await _dataSource.GetDataAsync();
    DataGrid.Columns[0].SortDirection = ctWinUI.DataGridSortDirection.Ascending;

    DataGrid.RowHeight = double.NaN;
}

Still my output is same and its not working.

Chirag R. Pandya 0 Reputation points

2024-01-16T13:47:51.4033333+00:00

Please see my response above. its not working.

Share via

WinUI DataGrid (CommunityToolkit.WinUI.UI.Controls) - Resize of height is not working when user shrink or expand column

1 answer