Skip to content

Commit 01a1c20

Browse files
committed
update images
1 parent 1f1e131 commit 01a1c20

34 files changed

+13
-32
lines changed

controls/datagrid/columns/width.md

Lines changed: 7 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: Columns Width
3-
page_title: .NET MAUI DataGrid Documentation - Columns Width
3+
meta_title: .NET MAUI DataGrid Documentation - Columns Width
44
description: Check our "Columns Width" documentation article for Telerik DataGrid for .NET MAUI.
55
position: 4
66
previous_url: /controls/datagrid/columns/datagrid-columns-width
@@ -11,14 +11,14 @@ slug: datagrid-columns-width
1111

1212
This article describes how to set a width to the [.NET MAUI DataGrid]({%slug datagrid-overview%}) column using the `SizeMode` and `Width` properties.
1313

14-
* `SizeMode`(`DataGridColumnSizeMode`)—Defines the `DataGridColumnSizeMode` value that controls how the column and its associated cells are sized horizontally.
14+
* `SizeMode` (`DataGridColumnSizeMode`)—Defines the `DataGridColumnSizeMode` value that controls how the column and its associated cells are sized horizontally.
1515
* `Fixed`—The column has a fixed width as defined by its Width property.
1616
* `Stretch`—The column is stretched to the available width proportionally to its desired width.
1717
* `Auto`—The columns is sized to its desired width. That is the maximum desired width of all associated cells.
18-
* `Width`(`double`)—Specifies the fixed width for the column. Applicable when the `SizeMode` property is set to `DataGridColumnSizeMode`.Fixed.
19-
* `MinimumWidth`(`double`)—Specifies the minimum width of a column. This property is applicable when setting `SizeMode` column property to `Fixed`. When `MinimumWidth` is set, you can not reduce the width of the column to a value lower than the `MinimumWidth`.
18+
* `Width` (`double`)—Specifies the fixed width for the column. Applicable when the `SizeMode` property is set to `DataGridColumnSizeMode.Fixed`.
19+
* `MinimumWidth` (`double`)—Specifies the minimum width of a column. This property is applicable when setting `SizeMode` column property to `Fixed`. When `MinimumWidth` is set, you can not reduce the width of the column to a value lower than the `MinimumWidth`.
2020

21-
* `ActualWidth` (double): Gets the actual width of the column.
21+
* `ActualWidth` (`double`)—Gets the actual width of the column.
2222

2323
## Example
2424

@@ -58,10 +58,6 @@ xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
5858

5959
>important The `Width` property of columns will apply only when `SizeMode="Fixed"`.
6060
61-
The first and second columns have set widths of 100 and 200, respectively:
62-
63-
![DataGrid Fixes Column Size](../images/datagrid-columns-width-fixed.png)
64-
6561
### Second Scenario when SizeMode="Stretch":
6662

6763
```XAML
@@ -79,17 +75,13 @@ Where the `telerik` namespace is the following:
7975
xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
8076
```
8177

82-
The columns take all the available space proportionally. The Width property is ignored.
83-
84-
![DataGrid Stretch Column Size](../images/datagrid-columns-width-stretch.png)
85-
8678
### Third Scenario when SizeMode="Auto":
8779

8880
```XAML
8981
<telerik:RadDataGrid x:Name="grid" AutoGenerateColumns="False">
9082
<telerik:RadDataGrid.Columns>
91-
<telerik:DataGridTextColumn PropertyName="Country" HeaderText="Country" Width="100" SizeMode="Auto"/>
92-
<telerik:DataGridTextColumn PropertyName="Capital" HeaderText="Capital" Width="200" SizeMode="Auto"/>
83+
<telerik:DataGridTextColumn PropertyName="Country" HeaderText="Country" SizeMode="Auto"/>
84+
<telerik:DataGridTextColumn PropertyName="Capital" HeaderText="Capital" SizeMode="Auto"/>
9385
</telerik:RadDataGrid.Columns>
9486
</telerik:RadDataGrid>
9587
```
@@ -100,10 +92,6 @@ Where the `telerik` namespace is the following:
10092
xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
10193
```
10294

103-
The columns take only as much space as they need. The Width property is ignored.
104-
105-
![DataGrid Auto Column Size](../images/datagrid-columns-width-auto.png)
106-
10795
### Fourth Scenario with different SizeMode values
10896

10997
Lastly, lets use three columns to fully clarify the `SizeMode` behavior:
@@ -124,10 +112,6 @@ Where the `telerik` namespace is the following:
124112
xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
125113
```
126114

127-
The first and the third columns each have a fixed size of 100 and the second column takes all the available space because of SizeMode="Stretch":
128-
129-
![DataGrid SizeMode](../images/datagrid-columns-width.png)
130-
131115
## See Also
132116

133117
- [Picker Column]({%slug datagrid-columns-picker-column %})
-30.1 KB
Loading
9.28 KB
Loading
-19.8 KB
Loading
-9.27 KB
Binary file not shown.
-11.2 KB
Binary file not shown.
-9.49 KB
Binary file not shown.
-13.6 KB
Binary file not shown.
-40.5 KB
Binary file not shown.
-13.3 KB
Binary file not shown.

0 commit comments

Comments
 (0)