Articles → LIGHT SWITCH 2011 → Convert UTC To Local Date And Time In Datagrid In Lightswitch 2011

Convert UTC To Local Date And Time In Datagrid In Lightswitch 2011






Software Requirement




  1. Visual studio 2010 is installed on your machine.
  2. Visual Studio 2010 service pack 1 is installed on your machine.
  3. Microsoft Visual Studio Light switch 2011 is installed on your machine.

Prerequisite Knowledge




  1. Basics about lightswitch.
  2. How to create screens in lightswitch?
  3. How to create tables in lightswitch?
  4. What is ControlAvailable event in lightswitch?
  5. What are data templates in silverlight?
  6. What are converters (IValueConverter) in silverlight?

Steps Of Execution




  1. Create a new project
  2. Create new table
  3. Create new screens
  4. Add data to the screen
  5. Add new column in the grid



Create A New Project




Picture showing the sample lightswitch application
Click to Enlarge


Create New Table




Picture showing the table designer in lightswitch application
Click to Enlarge


Create A New Screen




Picture showing the project structure after adding screen and table
Click to Enlarge


Add Data To The Screen




Picture showing the editable data screen with data
Click to Enlarge


Add New Column In The Grid




using System;
using Microsoft.LightSwitch.Presentation;
using Microsoft.LightSwitch.Presentation.Extensions;
using System.Windows.Controls;
using System.Text;
using System.Windows.Controls.Primitives;
using System.Windows;
using System.Windows.Markup;
using System.Windows.Data;

namespace LightSwitchApplication {
  public partial class EditableUserProfilesGrid {
    partial void EditableUserProfilesGrid_Created() {
      // Write your code here.
      this.FindControl("grid").ControlAvailable += new EventHandler < ControlAvailableEventArgs > (EditableUserProfilesGrid_ControlAvailable);
    }

    void EditableUserProfilesGrid_ControlAvailable(object sender, ControlAvailableEventArgs e) {
      if (e.Control is DataGrid) {
        DataGrid _grid = (DataGrid) e.Control;
        _grid.Columns.Insert(3, GetLocalTimeColumns("DOJ", "DOJ"));
      }
    }
    private DataGridColumn GetLocalTimeColumns(string headerName, string bindingColumnName) {
      //  Declaration
      StringBuilder sbDataGridHeader;
      StringBuilder sbDataGridCell;
      DataGridTemplateColumn column;

      //  Initialization
      sbDataGridHeader = new StringBuilder(string.Empty);
      sbDataGridCell = new StringBuilder(string.Empty);
      column = new DataGridTemplateColumn();

      //  Create data template for grid column
      sbDataGridHeader.Append(@"<DataTemplate xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'>");
      sbDataGridHeader.Append(string.Format("<TextBlock Text='{0}'/>", headerName));
      sbDataGridHeader.Append(@"</DataTemplate>");

      //  Create data template for grid cell
      sbDataGridCell.Append(@"<DataTemplate xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'");
      sbDataGridCell.Append(" xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'");
      sbDataGridCell.Append(" xmlns:local='clr-namespace:LightSwitchApplication;assembly=convert_to_local_datetime_demo.Client;'>");

      sbDataGridCell.Append("<Grid>");
      sbDataGridCell.Append("<Grid.Resources>");
      sbDataGridCell.Append("<local:DateTimeUtc2LocalValueConverter x:Key='DateTimeUtc2LocalValueConverter' />");
      sbDataGridCell.Append("</Grid.Resources>");

      sbDataGridCell.Append("<TextBlock Text='{Binding ");
      sbDataGridCell.Append(bindingColumnName);
      sbDataGridCell.Append(", Converter={StaticResource DateTimeUtc2LocalValueConverter}}'/>");
      sbDataGridCell.Append("</Grid>");
      sbDataGridCell.Append(@"</DataTemplate>");

      //  Assign data template to header
      Style headerStyle = new Style(typeof(DataGridColumnHeader));
      headerStyle.Setters.Add(new Setter {
        Property = DataGridColumnHeader.ContentTemplateProperty,
        Value = (DataTemplate) XamlReader.Load(sbDataGridHeader.ToString())
      });
      column.HeaderStyle = headerStyle;

      //  Assign data template to grid cell
      column.CellTemplate = XamlReader.Load(sbDataGridCell.ToString()) as DataTemplate;

      //  Return value
      return column;

    }
  }
  public class DateTimeUtc2LocalValueConverter: IValueConverter {
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) {
      return string.Format("{0} {1}", System.Convert.ToDateTime(value).ToLocalTime().ToShortDateString(), System.Convert.ToDateTime(value).ToLocalTime().ToLongTimeString());
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) {
      throw new NotImplementedException();
    }
  }
}



Code Explanation




  1. EditableUserProfilesGrid
  2. DateTimeUtc2LocalValueConverter




  1. EditableUserProfilesGrid_Created
  2. EditableUserProfilesGrid_ControlAvailable
  3. GetLocalTimeColumns








<DataTemplate
    xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'>
    <TextBlock  Text='DOJ'/>
</DataTemplate>






<DataTemplate
    xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'
    xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'
    xmlns:local='clr-namespace:LightSwitchApplication;assembly=convert_to_local_datetime_demo.Client;'>
    <Grid>
        <Grid.Resources>
            <local:DateTimeUtc2LocalValueConverter x:Key='DateTimeUtc2LocalValueConverter' />
        </Grid.Resources>
        <TextBlock Text='{Binding DOJ, Converter={StaticResource DateTimeUtc2LocalValueConverter}}'/>
    </Grid>
</DataTemplate>





Output




Picture showing the time in grid when timezone is UTC+05:30
Click to Enlarge



Picture showing the time in grid when timezone is UTC-12:00
Click to Enlarge



Picture showing the time in grid when timezone is UTC+13:00
Click to Enlarge


Posted By  -  Karan Gupta
 
Posted On  -  Friday, March 1, 2013

Query/Feedback


Your Email Id
 
Subject
 
Query/FeedbackCharacters remaining 250