Row content not visible entirely on resizing the data grid

[Anupama Kesari]

I want the rows to resize themselves so that the entire content is visible. The code is as follows:

<syncfusion:SfDataGrid x:Name="dataGrid1"
                               AutoGenerateColumns="True"
                               AllowResizingColumns="True"
                               AllowDraggingColumns="True"
                               ItemsSource="{Binding Requirements}"
                               ColumnSizer="Star"
                               BorderBrush="Transparent"
                               Margin="30,0,0,0">

                    <syncfusion:SfDataGrid.Columns>

                        <!-- Column 1 -->
                        <syncfusion:GridTextColumn HorizontalHeaderContentAlignment="Left" TextWrapping="Wrap" AllowFocus="False" HeaderText="Requirement Types" MappingName="RequirementTypes">
                            <syncfusion:GridTextColumn.CellTemplate>
                                <DataTemplate>
                                    <Grid Margin="5,0,0,0">
                                        <TextBlock Text="{Binding Path=RequirementTypes}"
                                         VerticalAlignment="Center"
                                         HorizontalAlignment="Left"/>
                                    </Grid>
                                </DataTemplate>
                            </syncfusion:GridTextColumn.CellTemplate>
                        </syncfusion:GridTextColumn>

                        <!-- Column 2 -->
                        <syncfusion:GridTextColumn AllowFocus="False" HeaderText="Recommended" MappingName="Recommended">
                            <syncfusion:GridTextColumn.CellTemplate>
                                <DataTemplate>
                                    <Grid>
                                        <TextBlock Text="{Binding Path=Recommended}"
                                         VerticalAlignment="Center"
                                         HorizontalAlignment="Center"
                                         FontWeight="SemiBold"/>
                                    </Grid>
                                </DataTemplate>
                            </syncfusion:GridTextColumn.CellTemplate>
                        </syncfusion:GridTextColumn>

                        <!-- Column 3 -->
                        <syncfusion:GridTextColumn AllowFocus="False" HeaderText="Override Value" MappingName="OverrideValue">
                            <syncfusion:GridTextColumn.CellTemplate>
                                <DataTemplate>
                                    <Grid>
                                        <editors:SfNumericUpDown x:Name="numericUpDown"
                                                                 HorizontalAlignment="Center"
                                                                 VerticalAlignment="Center"
                                                                 Width="200"
                                                                 Value="{Binding Path=OverrideValue}"
                                                                 SpinButtonsAlignment="Both"
                                                                 AccentBrush="Gray"/>
                                    </Grid>
                                </DataTemplate>
                            </syncfusion:GridTextColumn.CellTemplate>
                        </syncfusion:GridTextColumn>

                        <!-- Column 4 -->
                        <syncfusion:GridTextColumn TextWrapping="Wrap" AllowFocus="False" HeaderText="Comments" MappingName="Comments">
                            <syncfusion:GridTextColumn.CellTemplate>
                                <DataTemplate>
                                    <Grid>
                                        <TextBlock Text="{Binding Path=Comments}"
                                         VerticalAlignment="Center"
                                         HorizontalAlignment="Left"
                                           TextWrapping="Wrap"/>
                                    </Grid>
                                </DataTemplate>
                            </syncfusion:GridTextColumn.CellTemplate>
                        </syncfusion:GridTextColumn>

                    </syncfusion:SfDataGrid.Columns>

                </syncfusion:SfDataGrid>

I am adding the screenshot for reference.

Thanks in advance.

Attachment: screenshot_2faa7bf8.zip

[Jai Ganesh S]

Hi Anupama, 

 

You can automatically resize a row when you type multi-line text in SfDataGrid by using the QueryRowHeight event. 

 

this.sfGrid.QueryRowHeight += SfGrid_QueryRowHeight; 

 

 

        private void SfGrid_QueryRowHeight(object sender, QueryRowHeightEventArgs e) 

        { 

            if (this.sfGrid.GridColumnSizer.GetAutoRowHeight(e.RowIndex, gridRowResizingOptions, out autoHeight)) 

            { 

                if (autoHeight > this.sfGrid.RowHeight) 

                { 

                    e.Height = autoHeight; 

                    e.Handled = true; 

                } 

            } 

        } 

 

And the column can be defined as follows, 

 

  <syncfusion:GridTextColumn MappingName="Name" TextWrapping="Wrap" > 

 

  </syncfusion:GridTextColumn> 

 

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/UWP-1701515111.zip 

 

In the above sample, the row height is automatically increased based on the “Name” column value. 

 

Regards, 

Jai Ganesh S