How to resize Column at run time by mouse

[Cosyspro]

Dear Sir,

I used the following instructions to allow the user to resize "Column Width" by drag and move the column header but this does not work :

    gridGroupingControl.TableModel.Options.ResizeColsBehavior = GridResizeCellsBehavior.ResizeAll;

    gridGroupingControl.TableControl.AllowRowResizeUsingCellBoundaries = true;

    gridGroupingControl.TableControl.AllowColumnResizeUsingCellBoundaries = true;

    gridGroupingControl.TableModel.Options.MinResizeColSize = 0;

Best regards

[Arulpriya Ramalingam]

Hi Cosyspro, 

 

Thanks for contacting Syncfusion support. 

 

We have analyzed the reported scenario at our end. As per the GridGroupingControl current support, the width of the columns will be set through the GridColumnDescriptor collection whereas, the width for the columns will be set through the table model while resizing the columns. In order to set the width while resizing the columns, the TableControlResizingColumns event can be handled. In that event, the width for the columns can be resized based on the conditions. We created a simple sample as per your requirement. Please make use of the below code and sample, 

 

Code example 

 

//Resize behavior 

gridGroupingControl1.TableModel.Options.ResizeColsBehavior = GridResizeCellsBehavior.ResizeAll; 

gridGroupingControl1.TableControl.AllowColumnResizeUsingCellBoundaries = true; 

 

//Event triggering 

this.gridGroupingControl1.TableControlResizingColumns += GridGroupingControl1_TableControlResizingColumns; 

 

//Event customization 

private void GridGroupingControl1_TableControlResizingColumns(object sender, GridTableControlResizingColumnsEventArgs e) 

{ 

    if(e.Inner.Reason == GridResizeCellsReason.MouseUp && e.TableControl.Model.Options.ResizeColsBehavior == GridResizeCellsBehavior.ResizeAll) 

    { 

        e.Inner.Cancel = true; 

        int index = this.gridGroupingControl1.TableDescriptor.ColIndexToField(e.Inner.Columns.Right); 

        GridColumnDescriptor column = this.gridGroupingControl1.TableDescriptor.Columns[index]; 

        int frozencount = e.TableControl.InternalGetFrozenCols(); 

        int frozen = e.TableControl.Model.ColWidths.GetTotal(0, frozencount); 

        //To claculate the extended width of column 

        int extendedPoints = (e.Inner.Point.X - frozen) % column.Width; 

        //To get the resized column width 

        int width = column.Width + extendedPoints; 

        foreach (GridColumnDescriptor col in this.gridGroupingControl1.TableDescriptor.Columns) 

        { 

            //To set the column width for each cells 

            this.gridGroupingControl1.TableDescriptor.Columns[col.Name].Width = width; 

        } 

    } 

} 

 

Sample link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/CS264293618  

 

Note 

Please let us know that, if you have any concerns on using the above solution. 

 

Regards, 

Arulpriya 

[Cosyspro]

Thank you for the reponse.

But I want resize one column not all columns at the same time. It is possible to do it without handled-event like microsoft's DataGridView ?

Best Regards

[Arulpriya Ramalingam]

Hi Cosyspro, 

 

Thanks for your update. 

 

We could understand your scenario. By default, the columns can be resized at run time by dragging the column header cell and the default value of ResizeColsBehavior is (ResizeSingle | OutlineBounds | OutlineHeaders). So, the current column will be resized based on original cell bound of tracked column. Moreover, to enable the resize of columns at run time for a single column, the ResizeColsBehavior can be set as ResizeSingle and AllowColumnResizeUsingCellBoundaries can be enabled to resize the columns on cell boundaries. Please refer to the below code and sample, 

 

Code example 

 

//Resize behavior for single column 

gridGroupingControl1.TableModel.Options.ResizeColsBehavior = GridResizeCellsBehavior.ResizeSingle; 

//enable resize on cell boundaries 

gridGroupingControl1.TableControl.AllowColumnResizeUsingCellBoundaries = true; 

 

Sample link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/CS_(2)-917291058  

 

Note 

If still the issue occurs, we suspect that the issue might be occurred due to the customization of your code part. So, please refer the attached sample and let us know that, if we missed anything from your customization which causes the issue. So that, we could analyze further to provide you a better solution at the earliest. Also, please ensure that the ResizeColsBehavior was not set to None in anywhere in your project. 

 

Regards, 

Arulpriya 

[Cosyspro]

Thanks for your response.

Yes, I already did that but it works with the first two columns. 

When I move a column to the first or the second position, it works with that culomn.

Here is the initialization of the GridGroupingControl, named GGCElements:

//Begin

             //

            //Configuration GridGroupingControl

            //

            //Style Metro

            GGCElements.GridVisualStyles = GridVisualStyles.Metro;

            // Modify title, text of drag ....

            GGCElements.Table.TableDescriptor.Name = MyName;

            GGCElements.GridGroupDropArea.DragColumnHeaderText = MyMessage;

            // Disables editing in GridGroupingControl

            GGCElements.ActivateCurrentCellBehavior = GridCellActivateAction.None;

            //

            //Resize behavior 

            //

            GGCElements.TableModel.Options.ResizeColsBehavior = GridResizeCellsBehavior.ResizeSingle;

            GGCElements.TableControl.AllowColumnResizeUsingCellBoundaries = true;

            //Make all cell to read only

            foreach (GridColumnDescriptor col in GGCElements.TableDescriptor.Columns)

                col.Appearance.AnyRecordFieldCell.ReadOnly = true;

            // Enables the DisableCounters, VirtualMode and RecordsAsDisplayElements optimizations.

            GGCElements.AllowedOptimizations = Syncfusion.Grouping.EngineOptimizations.All;

            // Applies back color for alternative records in the Grid.

            GGCElements.Appearance.AlternateRecordFieldCell.BackColor = Color.FromArgb(244, 244, 244);

            //

            //GroupDropArea

            //

            GGCElements.ShowGroupDropArea = true;

            GGCElements.HierarchicalGroupDropArea = true;

            GGCElements.GridGroupDropArea.BackColor = Color.FromArgb(238, 248, 224);

            GGCElements.GridGroupDropArea.ForeColor = Color.Black;

            GGCElements.GridGroupDropArea.AllowRemove = true;

            //Supports switching tree line placement to the top and bottom between hierarchy levels.

            GGCElements.GridGroupDropArea.TreeLinePlacement = TreeLinePlacement.Bottom;

            //Supports resizing GroupDropArea dynamically up to the last level of the hierarchy.

            GGCElements.GridGroupDropArea.DynamicResizing = true;

            //Supports setting tree lines to a desired color.

            GGCElements.GridGroupDropArea.TreeLineColor = Color.Black;

            //Navigation bar

            GGCElements.ShowNavigationBar = true;

            GGCElements.RecordNavigationBar.Label = "Item";

            //

            //selection Mode 

            //

            GGCElements.TableOptions.ListBoxSelectionMode = SelectionMode.MultiExtended;

            GGCElements.TableOptions.ListBoxSelectionColorOptions = GridListBoxSelectionColorOptions.ApplySelectionColor;

            GGCElements.TableModel.Options.ExcelLikeSelectionFrame = true;//Enable the Excel-like selection frame.

            GGCElements.TableModel.Options.ExcelLikeCurrentCell = true;//Enable the Excel-like current cell.

            GGCElements.TableOptions.ListBoxSelectionColorOptions = GridListBoxSelectionColorOptions.ApplySelectionColor;

    

            //Enable touch mode

            GGCElements.EnableTouchMode = true;

            //Enable intelligent Mouse scroll

            GGCElements.IntelliMousePanning = true;

            // Enables Horizontal ScrollBar

            GGCElements.TableControl.HScroll = true;

            GGCElements.TableControl.HScrollBehavior = GridScrollbarMode.Enabled;

            // Enables Vertical ScrollBar

            GGCElements.TableControl.VScroll = true;

            GGCElements.TableControl.VScrollBehavior = GridScrollbarMode.Enabled;

            //Show filter bar

            GGCElements.TopLevelGroupOptions.ShowFilterBar = true;

            GGCElements.NestedTableGroupOptions.ShowFilterBar = true;

            GGCElements.ChildGroupOptions.ShowFilterBar = true;

            GridDynamicFilter dynamicFilter = new GridDynamicFilter();

            dynamicFilter.WireGrid(GGCElements);

            //Splitter color

            GGCElements.Splitter.BackColor = Color.Green;

            //Others Parameters

            GGCElements.TopLevelGroupOptions.ShowAddNewRecordAfterDetails = false;

            GGCElements.TopLevelGroupOptions.ShowAddNewRecordBeforeDetails = false;

            GGCElements.ChildGroupOptions.ShowAddNewRecordAfterDetails = false;

            GGCElements.ChildGroupOptions.ShowAddNewRecordBeforeDetails = false;

            GGCElements.NestedTableGroupOptions.ShowAddNewRecordAfterDetails = false;

            GGCElements.NestedTableGroupOptions.ShowAddNewRecordBeforeDetails = false;

            GGCElements.ThemesEnabled = true;

            GGCElements.GridOfficeScrollBars = OfficeScrollBars.Metro;

            //Code to disable/enable the multi column sort.

            GGCElements.Table.TableOptions.AllowMultiColumnSort = true;

            //Style info cell

            GridStyleInfo cellFloat, cellInt, cellDate;

            cellFloat = new GridStyleInfo();

            cellFloat.Format = "N" + nbrChiffreApresVirgule.ToString();

            cellFloat.TextAlign = GridTextAlign.Right;

            cellInt = new GridStyleInfo();

            cellInt.Format = "N0";

            cellInt.TextAlign = GridTextAlign.Right;

            cellDate = new GridStyleInfo();

            cellDate.Format = "dd/MM/yyyy HH:mm:ss";

            cellDate.TextAlign = GridTextAlign.Default;

            Type t;

            foreach (GridColumnDescriptor col in GGCElements.TableDescriptor.Columns)

            {

                col.HeaderText = (col.Name.Select(c => char.IsUpper(c) ? string.Concat(" ", c.ToString()) : c.ToString())).Aggregate((a, b) => a + b);

                col.AllowFilter = true;

                //Value Format

                t = col.Appearance.AnyRecordFieldCell.CellValueType;

                if ((t == typeof(float)) || (t == typeof(double)) || (t == typeof(decimal)))

                {

                    col.Appearance.AnyRecordFieldCell.Format = cellFloat.Format;

                    col.Appearance.AnyRecordFieldCell.Text = cellFloat.Text;

                }

                if ((t == typeof(short)) || (t == typeof(int)) || (t == typeof(long)))

                {

                    col.Appearance.AnyRecordFieldCell.Format = cellInt.Format;

                    col.Appearance.AnyRecordFieldCell.Text = cellInt.Text;

                }

                if (t == typeof(DateTime?))

                {

                    col.Appearance.AnyRecordFieldCell.Format = cellDate.Format;

                    col.Appearance.AnyRecordFieldCell.Text = cellDate.Text;

                }

            }

//End

Best regards

[Arulpriya Ramalingam]

Hi Cosyspro, 

 

Thanks for your update. 

 

We have analyzed the provided code part at our end and the columns are resizing properly. Please refer to the attached video and sample. Moreover, in your project, you have enabled the AllowedOptimization as All and the DisableCounters option is applicable for the browse only grids (i.e. for non-filter, non-sorting and non-grouped columns). However, the DynamicFilter is enabled for the GridColumns. So, enabling this property might be the cause for the reported issue at your end. So, we would suggest you to set the AllowedOptimization as none to avoid the painting issue at run time for the filter enabled grids. Since, we are unable to reproduce the issue at our end with the provided grid settings, please confirm us the below details which will be more helpful for us to provide you a better solution at the earliest? 

 

• The product version of Syncfusion EssentialStudio and .NetFrameWork version.
• Customization based on column width in QueryColWidth event or Resizingcolumns event, if any.
• Refer to the attached sample and let us know that if we missed anything from your customization which causes the issue.
• The way of populating the data for the grid.

 

Sample link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/ColumnResizing299813595  

 

Regards, 

Arulpriya 

[Cosyspro]

Hi Arulpriya,

Thanks for your response.

I'm using The Syncfusion EssentialStudio v15.4.0.17. and NetFrameWork version 4.6 with Visual Studio 2017 version 15.4.X.

I did not customize the both QueryColWidth event and/or Resizingcolumns event.

How I can use Virtual mode, DynamicFilter and resize columns by mouse at the same time ? The virtual mode is essential to avoid the slow loading of data.

Regards  

[Piruthiviraj Malaimelraj]

Hi Cosyspro, 

Thanks for your update. 

We have checked deeply your reported scenario. As we updated earlier, the GridGroupingControl have the default support for resizing particular column alone by dragging column header and we have tried to reproduce your issue at our end, but unfortunately, we could not able to reproduce it. Please provide us with your minimal sample with issue reproducible, so that we can analyze further on this and able to provide exact solution at the earliest. 

Thanks for your understandings. 

Regards, 

Piruthiviraj 

[Cosyspro]

Dear Sir,

I find the solution.

The problem comes when I fixe the following parameters before populate the gridGroupingControl1:

           // Initialize the Zooming to GridGroupingControl     

            ZoomGroupingGrid zoom = new ZoomGroupingGrid(this.gridGroupingControl1);

            ZoomGroupingGrid.zoomCell = false;

            zoom.ZoomSize = new Size(100, 100);

            zoom.ZoomBorderSize = 5;

            zoom.ZoomFactor = 1.5f; 

Thank you very much for your support.

Can you guide me for customize the textual menu of the dynamic filter. I want translate it to others languages ?

Best regards.

[Arulpriya Ramalingam]

Hi Cosyspro,   

   

Thanks for your update.   

   

Query	Response
I find the solution.    The problem comes when I fixe the following parameters before populate the gridGroupingControl1:                   // Initialize the Zooming to GridGroupingControl                     ZoomGroupingGrid zoom = new ZoomGroupingGrid(this.gridGroupingControl1);                ZoomGroupingGrid.zoomCell = false;                zoom.ZoomSize = new Size(100, 100);                zoom.ZoomBorderSize = 5;                zoom.ZoomFactor = 1.5f;         Thank you very much for your support.	We are glad to hear that the workaround was find by yourself. Before populating the grid, the ColumnWidth will be set to its default width and when the columns are resized with Zooming, the width will be calculated based on the current percentage of the columns. Since, the default width set to the columns before, the issue might be occurred at your end. So, we would suggest you to enable the zoom for the grid after all the customization for the grid is done.
Can you guide me for customize the textual menu of the dynamic filter. I want translate it to others languages?	The GridGroupingControl, have the direct support to localize the strings of DynamicFilter and already we provided a sample to localize the strings. Please make use of the sample in the below location in your local machine,        Dashboard sample location: <Install_Location>\Syncfusion\EssentialStudio\<Prduct_Version>\Windows\Grid.Grouping.Windows\Samples\Localization Samples\Localization Demo\CS

   

Sample link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/CS1791427892    

   

Regards,   

Arulpriya