Click here to Skip to main content
15,886,067 members
Articles / Programming Languages / C#

Align Text in Autogenerated Column of Rad Silverlight Girdview and Silverlight Gridview

Rate me:
Please Sign up or sign in to vote.
4.80/5 (2 votes)
18 Jul 2012CPOL2 min read 23K   3   2
Align Text in Autogenerated Column of Rad Silverlight Girdview and Silverlight Gridview

In this article I am going to show how you can align data in autogenrated columns cell of Silverlight gridview and also of Rad Control Silverlight Gridview. In both of the below Example of Gridview I want to align the numeric data left in my cell and other except numeric remain in same format.

RAD Silverlight Gridview XAML code of Silverlight Gridview

<telerik:RadGridView  
         Name="clubsGrid" 
         ItemsSource="{Binding Clubs}"
 AutoGeneratingColumn="clubsGrid_AutoGeneratingColumn"
         Margin="5">
</telerik:RadGridView>
Thing to note down here in XAML code is I register AutoGeneratingColumn = "clubsGrid_AutoGeneratingColumn" event which is get called when Auto columns get generated for gridview.
private void clubsGrid_AutoGeneratingColumn(object sender, GridViewAutoGeneratingColumnEventArgs e)
{
 GridViewDataColumn column = e.Column as GridViewDataColumn;
        if (column.DataType == typeof(int)
           || column.DataType == typeof(decimal)
           || column.DataType == typeof(float)
                )
       {
           column.TextAlignment = TextAlignment.Right;
       }
 }

As you see in above code I attached event called AutoGeneratingColumn on gridview control and checking DataType of each column which in turn check the datatype of the property which going to be attached with that column. So when the DataType is int or decimal or float I set TextAlignment propery of column to Right so display numeric value in right.

Output

So the output shows the column with numeric value "StadiumCapacity" is align to right.

Silvelight SDK Gridview control

There are two way to achieve this in Silverlight gridview

     1) Setting cell style from code behind file but creating Style

     2) Setting cell style from code behind file but using resource 

XAML code of Silverlight Gridview

<sdk:DataGrid   IsReadOnly="True" 
       Name="mysGrid" 
      AutoGeneratingColumn="DataGrid_AutoGeneratingColumn"
       ItemsSource="{Binding Clubs, Mode=OneWay}">
</sdk:DataGrid>

Same as RAD Gridview here also wrote AutoGeneratingColumn="DataGrid_AutoGeneratingColumn" which take care of Autogenerated coulmn.

First Way : Creating Sytle

private void DataGrid_AutoGeneratingColumn(object sender, DataGridAutoGeneratingColumnEventArgs e)
{
   if (e.PropertyType == typeof(int)
       || e.PropertyType == typeof(decimal)
       || e.PropertyType == typeof(float)
      )
   {
       var rightCellStyle = new Style(typeof(DataGridCell));

       rightCellStyle.Setters.Add(new Setter(
            Control.HorizontalContentAlignmentProperty,
            HorizontalAlignment.Right));

       DataGridBoundColumn obj = e.Column as DataGridBoundColumn;
       obj.CellStyle = rightCellStyle;
    }}

As you see in above code same as RAD gridview control here e.PropertyType used to check the type of the autogenerated column but the change over here is need to create cell style and than assing the style to CellStyle property of gridview column.

Second Way : Using Resource

In this solution you need to register the style for the gridview cell as shown below and than you can use this to assign to CellStyle.

Resource in App.XAML

<Style x:Key="RightCellStyle" TargetType="sdk:DataGridCell">
    <Setter Property="HorizontalContentAlignment" Value="Right" />
</Style>
CodeBehind file
private void DataGrid_AutoGeneratingColumn(object sender, DataGridAutoGeneratingColumnEventArgs e)
{
    if (e.PropertyType == typeof(int)
        || e.PropertyType == typeof(decimal)
        || e.PropertyType == typeof(float)
       )
       {
           DataGridBoundColumn obj = e.Column as DataGridBoundColumn;
           var rightCellStyle = Application.Current.Resources["RightCellStyle"] as Style;
           obj.CellStyle = rightCellStyle;
       }
}

Now in this code you dont require to create any style you just need to fetch the resource that you register in the App.XAML file and need to convert in Style.

Output

So the output shows the column with numeric value "StadiumCapacity" is align to right.

Note : in both the way output remain same.

Source : http://pranayamr.blogspot.in/2012/07/align-text-in-autogenerated-column-of.html

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior)
India India

Microsoft C# MVP (12-13)



Hey, I am Pranay Rana, working as a Team Leadin MNC. Web development in Asp.Net with C# and MS sql server are the experience tools that I have had for the past 5.5 years now.

For me def. of programming is : Programming is something that you do once and that get used by multiple for many years

You can visit my blog


StackOverFlow - http://stackoverflow.com/users/314488/pranay
My CV :- http://careers.stackoverflow.com/pranayamr

Awards:



Comments and Discussions

 
GeneralMy vote of 4 Pin
Christian Amado31-Jul-12 14:13
professionalChristian Amado31-Jul-12 14:13 
GeneralMy vote of 4 Pin
Christian Amado27-Jul-12 11:00
professionalChristian Amado27-Jul-12 11:00 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.