BaseColumn.Width Property

Gets or sets the column width. This is a dependency property.

Namespace: DevExpress.Xpf.Grid

Assembly: DevExpress.Xpf.Grid.v23.2.Core.dll

NuGet Package: DevExpress.Wpf.Grid.Core

Declaration

C#

public GridColumnWidth Width { get; set; }

VB.NET

Public Property Width As GridColumnWidth

Property Value

Type	Description
GridColumnWidth	A GridColumnWidth object that is a column width.

Remarks

Xaml

<dxg:GridControl.Columns>
    <!-- Absolute width in pixels -->
    <dxg:GridColumn FieldName="Name" Width="150"/>
    <!-- Proportional (star) width -->
    <dxg:GridColumn FieldName="Birthday" Width="2*"/>
    <dxg:GridColumn FieldName="Visits" Width="*"/>
    <!-- Auto width -->
    <dxg:GridColumn FieldName="City" Width="Auto"/>    
</dxg:GridControl.Columns> 

C#

// Absolute width in pixels
grid.Columns["Name"].Width = 150;
// Proportional (star) width
grid.Columns["Birthday"].Width = new GridColumnWidth(2, GridColumnUnitType.Star);
grid.Columns["Visits"].Width = new GridColumnWidth(1, GridColumnUnitType.Star);
// Auto width
grid.Columns["City"].Width = new GridColumnWidth(0, GridColumnUnitType.Auto);

VB.NET

' Absolute width in pixels
grid.Columns("ProductName").Width = 150
' Proportional (star) width
grid.Columns("Country").Width = New GridColumnWidth(2, GridColumnUnitType.Star)
grid.Columns("OrderDate").Width = New GridColumnWidth(1, GridColumnUnitType.Star)
' Auto width
grid.Columns("UnitPrice").Width = New GridColumnWidth(0, GridColumnUnitType.Auto)

The BaseColumn.Width property specifies a column width.

If the total column width exceeds the grid width, a horizontal scrollbar is displayed that allows users to scroll grid columns. If you want a column (or columns) to always be visible, set its BaseColumn.Fixed property. For more information, see Fixed Columns and Bands.

Note

You cannot explicitly specify a band‘s width. The width of the GridControl‘s bands depends on the width of band columns.

Absolute Column Size

Set the BaseColumn.Width property to a value in pixels:

Xaml

<dxg:GridControl.Columns>
    <dxg:GridColumn FieldName="JobTitle" Width="150"/>
    <dxg:GridColumn FieldName="FullName" Width="150"/>
    <dxg:GridColumn FieldName="BirthDate" Width="50"/>
    <dxg:GridColumn FieldName="Country" Width="100"/>
    <dxg:GridColumn FieldName="Phone" Width="100"/>
</dxg:GridControl.Columns> 

Proportional (Star) Column Size

Set the BaseColumn.Width property to a weighted proportion of available space. Available space is distributed among columns by weighted proportions similar to the “star sizing” mechanism used by the standard WPF Data Grid.

XAML

<dxg:GridControl.Columns>
    <dxg:GridColumn FieldName="JobTitle" Width="3*"/>
    <dxg:GridColumn FieldName="FullName" Width="3*"/>
    <dxg:GridColumn FieldName="BirthDate" Width="*"/>
    <dxg:GridColumn FieldName="Country" Width="2*"/>
    <dxg:GridColumn FieldName="Phone" Width="2*"/>
</dxg:GridControl.Columns>

Note

• Proportional sizing works only when the GridControl has a finite width.
• Proportional sizing does not work in column bands.

Auto Column Size

Set a column’s BaseColumn.Width property to Auto to make the GridControl automatically recalculate the optimal width for this column:

Xaml

<dxg:GridControl.Columns>
    <dxg:GridColumn FieldName="JobTitle" Width="Auto"/>
    <dxg:GridColumn FieldName="FullName"/>
    <dxg:GridColumn FieldName="BirthDate"/>
    <dxg:GridColumn FieldName="Country"/>
    <dxg:GridColumn FieldName="Phone"/>
</dxg:GridControl.Columns>

The GridControl stops to recalculate the optimal width for a column if a user resizes this column. The BaseColumn.AllowResizing property allows you to specify whether users can change the column width.

Note

If the TableView.AutoWidth / TreeListView.AutoWidth property value is true, do not set a column’s width to Auto.

Best Fit

The GridControl can automatically calculate and apply the optimal width required for a column to completely display its contents. Refer to the Best Fit topic for more information.

Match the Total Column Width with the Grid Width

The GridControl can change column widths automatically to match the total columns’ width with the grid’s width. Set the TableView.AutoWidth / TreeListView.AutoWidth property to true to enable this behavior. In this case, changing the width of one column automatically changes the widths of other columns. To obtain the actual width of columns, use their BaseColumn.ActualWidth property.

To prevent the width of an individual column from being changed when resizing other columns, set its BaseColumn.FixedWidth property to true.

To specify the column’s minimum and maximum width, use the BaseColumn.MinWidth and BaseColumn.MaxWidth properties respectively.

Note

The TableView.AutoWidth / TreeListView.AutoWidth property works only when the GridControl has a finite width.

Related GitHub Examples

The following code snippets (auto-collected from DevExpress Examples) contain references to the Width property.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

XAML

wpf-data-grid-bind-to-infiniteasyncsource/CS/InfiniteAsyncSourceSample/MainWindow.xaml#L17

<dxg:GridControl.Columns>
    <dxg:GridColumn FieldName="Id" IsSmart="True" AllowEditing="True" Width="*"/>
    <dxg:GridColumn FieldName="Subject" IsSmart="True" AllowEditing="True" Width="2*"/>

wpf-data-grid-implement-crud-operations/CS/GridControlCRUDSimple/MainWindow.xaml#L14

<dxg:GridControl x:Name="grid" KeyDown="grid_KeyDown">
    <dxg:GridColumn FieldName="Name" Width="2*"/>
    <dxg:GridColumn FieldName="CategoryId" Header="Category" Width="*">

wpf-data-grid-bind-to-pagedasyncsource/CS/PagedAsyncSourceSample/MainWindow.xaml#L14

<dxg:GridControl.Columns>
    <dxg:GridColumn FieldName="Subject" IsSmart="True" Width="2*"/>
    <dxg:GridColumn FieldName="User" IsSmart="True" Width="*"/>

how-to-bind-to-odata/CS/MainWindow.xaml#L15

<dxg:GridControl.Columns>
    <dxg:GridColumn FieldName="ID" Width="70" FixedWidth="True">
        <dxg:GridColumn.EditSettings>

wpf-spreadsheet-bind-grid-control-to-worksheet-data/CS/WpfSpreadsheet_DataBinding/MainWindow.xaml#L36

<dxg:GridControl.Columns>
    <dxg:GridColumn FieldName="Column 0" Header="Operation Expenses" Width="218"/>
    <dxg:GridColumn FieldName="Column 1" Header="Q1" Width="117">