Automatically Resizing Column Height in GridDataControl

[Ari Case]

I have a GridDataControl in which 2 columns contain a TextBox with their "TextWrapping" property set to "Wrap".

The problem is the height of the columns do not automatically increase as I add more text to the fields.

I have the columns' AutoFit property set to true so I don't know what I'm doing wrong.

Thanks!

[Saravanan M]

Hi Ari,
Thank you for contacting Syncfusion support,
We have analyzed your query. You can adjust the ColumnHeader Height based on the content present in the ColumnHeader using ResizeRowToFit method in ModelLoaded event. Please refer the below code snippet.
Code snippet[c#]:

void syncgrid_ModelLoaded(object sender, EventArgs e)

{

   this.syncgrid.Model.HeaderStyle.TextWrapping = TextWrapping.Wrap;

   this.syncgrid.Model.HeaderStyle.TextTrimming = TextTrimming.None;

   this.syncgrid.Model.ResizeRowsToFit(GridRangeInfo.Row(0), GridResizeToFitOptions.NoShrinkSize);

        
}  

You can also set the HeaderRow height using DefaultHeaderRowHeight property. Please refer the below code snippet.
Code snippet[XAML]:

<syncfusion:GridDataControl Name="syncgrid"

                            DefaultHeaderRowHeight="70"

                            AutoPopulateColumns="False"

                            ItemsSource="{Binding GDCSource}"

                            NotifyPropertyChanges="True"

                            ShowAddNewRow="False"
                            />

We have prepared the sample based on your requirement and you can download it from below location,
Sample Location: GridDataControl_Sample
Please let us know if you have any other queries,
Regards,
Saravanan.M

[Ari Case]

Hi,

But this only resizes the header, not the actually rows that contains the data.

When I tried implementing what you provided the column header had a larger height and the cells in the grid didn't automatically resize when I entered more data into them.

[Akila Rajaram]

Hi Ari ,
 
Sorry about the inconvenience caused .

In our previous updated sample , we have provided the solution for Header Rows only. You can also wrap the content of GridCell by using the same ResizeRowsToFit() method.You can pass the parameter as GridRangeInfo.Table() instead of rows. We have prepared the sample to achieve your requirement . Please find the sample from the following location ,

Sample : http://www.syncfusion.com/downloads/support/forum/119291/ze/GridDataControlsample__119291-315145167

Please refer the following code example :

XAML :

<syncfusion:GridDataVisibleColumn Width="200"

                                  HeaderText="Name  List   Details -   Wrapped HeaderText column"

                                  MappingName="Name">

    <syncfusion:GridDataVisibleColumn.ColumnStyle>

        <syncfusion:GridDataColumnStyle TextWrapping="Wrap" />

    </syncfusion:GridDataVisibleColumn.ColumnStyle>
</syncfusion:GridDataVisibleColumn>

C#:

void grid_Loaded(object sender, RoutedEventArgs e)

{

    this.grid.Model.ResizeRowsToFit(GridRangeInfo.Table(), GridResizeToFitOptions.NoShrinkSize);
}  

Please let us know if this solution helps you .

Regards,
Akila R.

[Ari Case]

The example you provided also doesn't work:

The "CustomerName" Column doesn't wrap or readjust, it just keeps adding text in the same line.

[Ari Case]

Hi,

I just saw that you posted something at 9:14 AM,

I implemented your change and it doesn't solve the row height resizing. What it did solve was allowing the cell to wrap the text as I entered more data, but that actual cell's row height remained the same.

[Saravanan M]

Hi Ari,
We have analyzed your query, you need to call ResizeRowsToFit method in CurrentCellEditingComplete event to achieve your requirement. Please refer the below code snippet.
Code snippet[C#]:

void grid_CurrentCellEditingComplete(object sender,SyncfusionRoutedEventArgs args)

 {

   this.grid.Model.ResizeRowsToFit(GridRangeInfo.Table(), GridResizeToFitOptions.NoShrinkSize);

            //throw new NotImplementedException();
 }

We have modified the sample based on this and you can download it from following location,
Sample Location: GridDataControlsample_Modified
Please let us know if you have any other queries,
Regards,
Saravanan.M

[Ari Case]

Hi,

I was hoping that it would resize the row height as the entered text wrapped rather than after the current cell's editing was complete, BUT this solution does work.

Thanks

[Saranya CJ]

Hi Ari,
Thank you for your update. Please let us know if you require any other assistance.
Regards,
Saranya

[Ari Case]

Hi, unfortunately I was wrong about this working completely.

The issue is with the text wrapping, the text in the cell continues in a straight line no matter how much I type and when I'm done the row does resize but it doesn't always look the way I desired it to look.

I've implemented the this.grid.Model.ResizeRowsToFit(GridRangeInfo.Table(),GridResizeToFitOptions.NoShrinkSize); in my CurrentCellEditingComplete event, that seems to be ok. It's just the wrapping that seems to be the issue.

Here's a snippet of the 2 text fields on my grid I'm trying to get the wrapping to work for:

 <syncfusion:GridDataVisibleColumn DataType="String" HeaderText="Hello" MappingName="comment1"  MaximumWidth="300" MinimumWidth="300" AllowResize="True">

                    <syncfusion:GridDataVisibleColumn.ColumnStyle>

                        <syncfusion:GridDataColumnStyle CellTypeEnum="TextBox" HorizontalAlignment="Left" ReadOnly="False" TextWrapping="Wrap">

                        </syncfusion:GridDataColumnStyle>

                    </syncfusion:GridDataVisibleColumn.ColumnStyle>

                </syncfusion:GridDataVisibleColumn>

                <syncfusion:GridDataVisibleColumn DataType="String" HeaderText="GoodBye" MappingName="comment2" AutoFit="True" Width="300" AllowResize="True">

                    <syncfusion:GridDataVisibleColumn.ColumnStyle>

                        <syncfusion:GridDataColumnStyle CellTypeEnum="TextBox" HorizontalAlignment="Left" ReadOnly="False" TextWrapping="Wrap">

                        </syncfusion:GridDataColumnStyle>

                    </syncfusion:GridDataVisibleColumn.ColumnStyle>

[Jai Ganesh S]

Hi Ari ,

We are sorry about the inconvenience caused .

We  analyzed your query . By default, in GridDataControl the  text will wrapped   based on the whitespace  and special characters (dot(.), separator(,)). So, the input text will  not be wrapped if  you enter the character without whitespace in GridDataControl . You can overcome this by including appropriate input with  whitespace . Here if you would like to achieve your requirement without using whitespace or special character, you can achieve the same requirement with our SfDataGrid control like GridDataControl and its having AutoRowHeight feature to achieve the same in SfDataGrid control.

But when compared to GridDataControl, SfDataGrid has a better performance and flexibility. SfDataGrid assists you to create entirely customizable and highly interactive features used to display and manipulate the huge amount of data. So, we suggest you to use SfDataGrid instead of GridDataControl. Also we have already marked GridDataControl  as a classic.

Please refer the following UG link for SfDataGrid.

UG Links: http://help.syncfusion.com/ug/wpf/index.html#!Documents/choosebetweendifferentgrids.htm

                    http://help.syncfusion.com/ug/wpf/index.html#!Documents/overview19.htm

Also we have prepared the sample for your AutoRowHeight requirement and you can download the sample from following location,

Sample: http://www.syncfusion.com/downloads/support/directtrac/135742/ze/AutoRowHeightDemo-982551612

Please refer the below UG link for AutoRowHeight in SfDataGrid,

http://help.syncfusion.com/ug/wpf/index.html#!Documents/autorowheight.htm

Regards,

Jai Ganesh S

[Ari Case]

I typed the following text into the text field in the grid (the width is 300):

"sds sdjasds dajsd das dasd jdas dsada asdasj das dasj dasj das sjsd asd jasds asdas jsadasd jasdas jsdasd asdasj dasdasj dasdsaj dasdsaj dasdasj dasdsajd asjdasd awj"

This didn't cause any TextWrapping a majority of the time in the GridDataControl even with the whitespaces. 

In some cases this did wrap but most of the time it didn't, it doesn't seem to consistently wrap.

Lastly the solution you provided came with some errors regarding not finding the EmployeeInfoViewModel and QueryRowHeightBehavior in the "clr-namespace:AutoRowHeightDemo".

So a majority of the events in the QueryRowHeightBehaviour.cs file can't be found.

[Saravanan M]

Hi Ari,

As we mentioned in our last update , you can use our SfDataGrid to achieve your requirement. We have checked with our sample and we could not get any errors as you mentioned. Could you please confirm your Essential Studio Product? We have provided AutoRowHeight feature from Essential Studio version 12.4.0.24?If you are using our earlier version, could you please upgrade to our latest version to achieve your requirement.

Please let us know if you have any other queries,

Regards,

Saravanan.M