Set column width in sfdatagrid

[Karla Franke]

I am trying to find how to set the width of the columns in my Syncfusion:SfDataGrid.

The Binding evaluationCategories object has four columns: CategoryID, CategoryName, Score and IsActive

Thanks

This is my XAML:

    <Page.Resources>

        <Style x:Key="HeaderStyle" TargetType="Syncfusion:GridHeaderCellControl">

            <Setter Property="Background" Value = "LightBlue" />

            <Setter Property="Foreground" Value="Black" />

            <Setter Property="FontWeight" Value = "Bold"  />

            <Setter Property="Width" Value="150" />

        </Style>

        <Style x:Key="AlternateRowStyle" TargetType="Syncfusion:VirtualizingCellsControl">

            <Setter Property="Background" Value = "LightGray" />

        </Style>

    </Page.Resources>

    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" >

        <Grid>

            <Grid.RowDefinitions>

                <RowDefinition Height="Auto" />

                <RowDefinition Height="Auto" />

                <RowDefinition Height="*" />

            </Grid.RowDefinitions>

            <Label  x:Name="lblTitle" HorizontalAlignment="Center" Margin="0,13,0,0" Grid.Row="1" VerticalAlignment="Top">

                <AccessText TextWrapping="Wrap" Text="Call Evaluation Category Maintenance" FontSize="15" FontWeight="Bold" Foreground="#FF076583" Height="Auto" Width="Auto" />

            </Label>

            <Syncfusion:SfDataGrid x:Name="lvCategories" Height="Auto" Margin="10,100,0,0" Grid.Row="1" VerticalAlignment="Top" Width="Auto" HorizontalAlignment="Center" 

                                   SelectionUnit="Cell" SelectionMode="Single"  

                                   HorizontalContentAlignment="Right"

                                   ShowGroupDropArea="False"

                                   AllowFiltering="False"

                                   AllowEditing="True"

                                   EditTrigger="OnTap"

                                   EditorSelectionBehavior="SelectAll"

                                   AllowSorting="False"

                                   AlternatingRowStyle="{StaticResource AlternateRowStyle}"

                                   HeaderStyle="{StaticResource HeaderStyle}"

                                   CurrentCellValueChanged="LvCategories_CurrentCellValueChanged"

                                   CurrentCellEndEdit="LvCategories_CurrentCellEndEdit"

                                   AutoGeneratingColumn="dataGrid_AutoGeneratingColumn"

                                   ItemsSource="{Binding evaluationCategories}">

            </Syncfusion:SfDataGrid>

            <Label Content="Total Score" HorizontalContentAlignment="Right" HorizontalAlignment="Left" Height="24" Margin="624,34,0,0" Grid.Row="2" VerticalAlignment="Top" Width="74"/>

            <TextBox x:Name="txtTotalScore" IsReadOnly="True" IsTabStop="False" VerticalContentAlignment="Center" HorizontalContentAlignment="Right" HorizontalAlignment="Left" Height="24" Margin="698,34,0,0" Grid.Row="2" TextWrapping="NoWrap" Text="" VerticalAlignment="Top" Width="30"/>

            <Button x:Name="btnSubmit" Content="Submit Updates" HorizontalAlignment="Left" Margin="765,93,0,0" Grid.Row="2" VerticalAlignment="Top" Width="141" Height="35" Click="Submit_Click"/>

        </Grid>

    </ScrollViewer>

Here is my AutoGenerationColumn module in XAML.cs:

private void dataGrid_AutoGeneratingColumn(object sender, AutoGeneratingColumnArgs e)

        {

            // todo validate

            if (e.Column.MappingName == "CategoryID") { e.Column = new GridTextColumn() { MappingName = "CategoryID", AllowEditing = false, IsReadOnly = true }; }

            //if (e.Column.MappingName == "Score") totalScore += 

            if (mw.isAdminGroup == false)

            {

                if (e.Column.MappingName == "CategoryName") { e.Column = new GridTextColumn() { MappingName = "CategoryName", AllowEditing = false, IsReadOnly = true }; }

                if (e.Column.MappingName == "Score") { e.Column = new GridTextColumn() { MappingName = "Score", AllowEditing = false, IsReadOnly = true }; }

                if (e.Column.MappingName == "IsActive") { e.Column = new GridTextColumn() { MappingName = "IsActive", AllowEditing = false, IsReadOnly = true }; }

            }

        }

[Mohanram Anbukkarasu]

Hi Karla, 

Thanks for contacting Syncfusion support. 

You can set the width of the columns in SfDataGrid within the AutoGeneratingColumn event as shown in the following code example. 

Code example :  

<syncfusion:SfDataGrid Name="dataGrid" 

                               ItemsSource="{Binding OrdersListDetails}" 

                               AutoGeneratingColumn="DataGrid_AutoGeneratingColumn"/> 

private void DataGrid_AutoGeneratingColumn(object sender, Syncfusion.UI.Xaml.Grid.AutoGeneratingColumnArgs e) 

{ 

    if (e.Column.MappingName == "OrderID") 

    { 

        e.Column = new GridTextColumn() { MappingName = "OrderID", AllowEditing = false, IsReadOnly = true, Width = 500 }; 

    } 

} 

Sample link : https://www.syncfusion.com/downloads/support/directtrac/general/ze/SfDataGrid_WPF_AutoGeneration1844428408  

Please let us know if you require further assistance from us.  

Regards, 

Mohanram A.