Friday, May 17, 2013

What is DispatcherTimer in wpf?

DispatcherTimer

When you want to set a timer working with GUI, you always come across threading problem. The problem is that if you want to send some changes to UI that is constantly/continuously changing then that will make your UI unresponsive or in other words it will hang your UI.

To overcome from this situation, WPF gives us DispatcherTimer threading functionality that will take care of such continuously changing processing on UI thread and that will not hang your UI.
We can accomplish same scenario in Win Form, through System.Windows.Forms.Timer and in WPF it is System.Windows.Threading.DispatcherTimer.

Difference between DispatcherTimer and Regular timer (System.Timers.Timer)

DispatcherTimer is the regular timer. It fires its Tick event on the UI thread, you can do anything you want with the UI.
System.Timers.Timer is an asynchronous timer, its Elapsed event runs on a thread pool thread.
You have to be very careful in your event handler, you are not allowed to touch any UI component.
And you'll need to use the lock statement where ever you access class members that are also used on the UI thread.

Example

Here, I am posting an example how to use DispatcherTimer.
The example is to show counter that starts counting from 0. We have Start and Stop buttons to start counting and stop counting.

XAML code for UI:

<Window x:Class="DispatcherTimerExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="95" Width="525">
    <Grid Margin="10">
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="Auto" />
      <ColumnDefinition Width="*" />
      <ColumnDefinition Width="Auto" />
      <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>   
    <TextBlock Grid.Column="0"
               Height="23"
               HorizontalAlignment="Left"
               Margin="5"
               Name="textBlock1"
               Text="Timer Value:"
               VerticalAlignment="Top" />
    <TextBox Grid.Column="1"
             x:Name="txtStatus"
             IsReadOnly="True"
             Background="AliceBlue"
             Foreground="Red"
             Height="23"
             HorizontalAlignment="Left"
             Margin="5,5,0,0"
             VerticalAlignment="Top"
             Width="233"
             Text="Press start to count."/>
    <Button Content="Start"
            Grid.Column="2"
            Height="23"
            HorizontalAlignment="Left"
            Margin="5"
            Name="btnStart"
            VerticalAlignment="Top"
            Width="75"
            Click="btnStart_Click" />
    <Button Content="Stop"
            Grid.Column="3"
            Height="23"
            HorizontalAlignment="Left"
            Margin="5"
            Name="btnStop"
            VerticalAlignment="Top"
            Width="75"
            Click="btnStop_Click" />
  </Grid>
</Window>

Code behind for this application which contains use of DispatcherTimer.

Code C#:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Windows.Threading;

namespace DispatcherTimerExample
{
  /// <summary>
  /// Interaction logic for MainWindow.xaml
  /// </summary>
  public partial class MainWindow : Window
  {
   
    DispatcherTimer _timer;
    int count = 0;

    public MainWindow()
    {
      InitializeComponent();
      //Create new instance of DispaterTimer
      _timer = new DispatcherTimer();

      //The continuously changing properties should go under the Tick event handler
      //so that it could be taken into UI thread and UI stays responsive.
      _timer.Tick += new EventHandler(_timer_Tick);
    }
   
    void _timer_Tick(object sender, EventArgs e)
    {
      //Assigns count to the textblock.
      txtStatus.Text = (count++).ToString();
    }

    /// <summary>
    /// Starts the counting.
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void btnStart_Click(object sender, RoutedEventArgs e)
    {
      // Set the Interval
      _timer.Interval = TimeSpan.FromMilliseconds(Convert.ToDouble(1));
      // Start the timer
      _timer.Start();
      txtStatus.Text = "Started";
    }

    /// <summary>
    /// Stops the counting.
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void btnStop_Click(object sender, RoutedEventArgs e)
    {
      // Stop the timer
      _timer.Stop();
      txtStatus.Text = "Stopped at : " + count.ToString();
    }
  }
}

Use of DispatcherTimer

Other use of DispatcherTimer is ProgressBar functionality where you can show progress on certain property changes. I will try to post ProgressBar functionality of Start and End date.

How to make Glossy Button usercontrol in WPF?

Searching on internet I found one interesting usercontrol which gives a look and feel like a Vista window button.
However, the user control XAML code is as follows:

<UserControl x:Class="UserControls.ucGlossyButton"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignHeight="300" d:DesignWidth="300">
  <Grid>
    <!-- Background Layer -->
    <!--<Ellipse Fill="{TemplateBinding Background}"/>-->
    <!-- Refraction Layer -->
   
    <Ellipse x:Name="RefractionLayer">
      <Ellipse.Fill>
        <RadialGradientBrush GradientOrigin="0.496,1.052">
          <RadialGradientBrush.RelativeTransform>
            <TransformGroup>
              <ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="1.5" ScaleY="1.5"/>
              <TranslateTransform X="0.02" Y="0.3"/>
            </TransformGroup>
          </RadialGradientBrush.RelativeTransform>
          <GradientStop Offset="1" Color="#00000000"/>
          <GradientStop Offset="0.4" Color="#FFFFFFFF"/>
        </RadialGradientBrush>
      </Ellipse.Fill>
    </Ellipse>
    <!-- Reflection Layer -->
    <Path x:Name="ReflectionLayer" VerticalAlignment="Top" Stretch="Fill">
      <Path.RenderTransform>
        <ScaleTransform ScaleY="0.5" />
      </Path.RenderTransform>
      <Path.Data>
        <PathGeometry>
          <PathFigure IsClosed="True" StartPoint="98.999,45.499">
            <BezierSegment Point1="98.999,54.170" Point2="89.046,52.258" Point3="85.502,51.029"/>
            <BezierSegment
                                    IsSmoothJoin="True"
                                    Point1="75.860,47.685"
                                    Point2="69.111,45.196"
                                    Point3="50.167,45.196"/>
            <BezierSegment Point1="30.805,45.196" Point2="20.173,47.741" Point3="10.665,51.363"/>
            <BezierSegment
                                    IsSmoothJoin="True"
                                    Point1="7.469,52.580"
                                    Point2="1.000,53.252"
                                    Point3="1.000,44.999"/>
            <BezierSegment Point1="1.000,39.510" Point2="0.884,39.227" Point3="2.519,34.286"/>
            <BezierSegment
                                    IsSmoothJoin="True"
                                    Point1="9.106,14.370"
                                    Point2="27.875,0"
                                    Point3="50,0"/>
            <BezierSegment Point1="72.198,0" Point2="91.018,14.466" Point3="97.546,34.485"/>
            <BezierSegment
                                    IsSmoothJoin="True"
                                    Point1="99.139,39.369"
                                    Point2="98.999,40.084"
                                    Point3="98.999,45.499"/>
          </PathFigure>
        </PathGeometry>
      </Path.Data>
      <Path.Fill>
        <RadialGradientBrush GradientOrigin="0.498,0.526">
          <RadialGradientBrush.RelativeTransform>
            <TransformGroup>
              <ScaleTransform
                                       CenterX="0.5"
                                       CenterY="0.5"
                                       ScaleX="1"
                                       ScaleY="1.997"/>
              <TranslateTransform X="0" Y="0.5"/>
            </TransformGroup>
          </RadialGradientBrush.RelativeTransform>
          <GradientStop Offset="1" Color="#FFFFFFFF"/>
          <GradientStop Offset="0.85" Color="#92FFFFFF"/>
          <GradientStop Offset="0" Color="#00000000"/>
        </RadialGradientBrush>
      </Path.Fill>
    </Path>
    <!-- ContentPresenter -->
    <ContentPresenter Margin="0,2,0,0" HorizontalAlignment="Center" VerticalAlignment="Center"/>


  </Grid>
</UserControl>



You can uncomment first 3 line of the usercontrol body if you are using ControlTemplate in Resouces.

Wednesday, May 15, 2013

How to sort List of objects on it's property?

Guys, sometimes, in .Net, we stuck in a weird situation where we need to sort List based on property.
Here, we can argue on Enumerable OrderBy() method to sort the list on property value.

//
    // Summary:
    //     Sorts the elements of a sequence in ascending order according to a key.
    //
    // Parameters:
    //   source:
    //     A sequence of values to order.
    //
    //   keySelector:
    //     A function to extract a key from an element.
    //
    // Type parameters:
    //   TSource:
    //     The type of the elements of source.
    //
    //   TKey:
    //     The type of the key returned by keySelector.
    //
    // Returns:
    //     An System.Linq.IOrderedEnumerable<TElement> whose elements are sorted according
    //     to a key.
    //
    // Exceptions:
    //   System.ArgumentNullException:
    //     source or keySelector is null.
public static IOrderedEnumerable<TSource> OrderBy<TSource, TKey>(this IEnumerable<TSource> source, Func<TSource, TKey> keySelector);


But, here the point to be noted is that OrderBy() sorts list alphabetically not alphanumerically. (see example below).
If we want to sort our list alphanumerically, then we need to implement a class implemented IComparer interface.
Below is the class that compares property bit by bit and returns integer value depending on the compare result.

namespace SortingList
{
  /// <summary>
  /// Compares two strings, taking numeric chunks into account.  For
  /// example, "Hotel2" will be less than "Hotel-10";  Case-sensitivity
  /// is considered if and only if the strings are equivalent without regard to case.
  /// </summary>
  /// <returns>
  ///   Less than 0 if s1 is less than s2;
  ///   0 if s1 and s2 are equivalent;
  ///   Greater than 0 if s1 is greater than s2.
  /// </returns>
  public class LogicalHotelCompare : IComparer<Hotel>
  {
    public int Compare(Hotel x, Hotel y)
    {
      return DoCompare(x.Name, y.Name);
    }
    /// <summary>
    /// Compares two string alphanumerically. Case-sensitivity
    /// is considered if and only if the strings are equivalent without regard to case.
    /// </summary>
    /// <param name="s1">First String</param>
    /// <param name="s2">Second String</param>
    /// <returns>0 if strings are equal, negative value if s2 is bigger, possitive value if s1 is bigger.</returns>
    public static int DoCompare(string s1, string s2)
    {
      int c = DoCompare(s1, s2, true);
      if (c != 0) return c;
      return DoCompare(s1, s2, false);
    }

    public static int DoCompare(string s1, string s2, bool ignoreCase)
    {
      int i1 = 0;
      int i2 = 0;
      while (true)
      {
        string c1 = ReadNextChunk(s1, ref i1);
        string c2 = ReadNextChunk(s2, ref i2);
        if (c1 == null)
          return (c2 == null) ? string.Compare(s1, s2, ignoreCase) : -1;
        if (c2 == null) return 1;
        int c = CompareChunk(c1, c2, ignoreCase);
        if (c != 0) return c;
      }
    }

    static bool IsDigit(char c)
    {
      // We don't use Char.IsDigit because it includes some non-ASCII Unicode digits.
      return ('0' <= c) && (c <= '9');
    }

    static string ReadNextChunk(string s, ref int i)
    {
      if ((s == null) || (i >= s.Length)) return null;
      int start = i;
      bool isDigit = IsDigit(s[i++]);
      while ((i < s.Length) && IsDigit(s[i]) == isDigit) i++;
      return s.Substring(start, i - start);
    }

    static int CompareChunk(string c1, string c2, bool ignoreCase)
    {
      if (IsDigit(c1[0]))
      {
        if (!IsDigit(c2[0])) return -1;
        string s1 = StripLeadingZeros(c1);
        string s2 = StripLeadingZeros(c2);
        int c = s1.Length - s2.Length;
        if (c != 0) return c;
        return string.CompareOrdinal(s1, s2);
      }
      if (IsDigit(c2[0])) return 1;
      return string.Compare(c1, c2, ignoreCase);
    }

    static string StripLeadingZeros(string s)
    {
      if (s[0] != '0') return s;
      for (int i = 1; i < s.Length; i++)
        if (s[i] != '0') return s.Substring(i);
      return "";
    }
  }
}


Below is the example how we can see exact difference between OrderBy() and Sort() with IComparer methods. You can download example from here.
Example:
Hotel class that we will add into the list and will sort on property “Name”.

namespace SortingList
{
  /// <summary>
  /// Hotel class the we will use for sorting.
  /// </summary>
  public class Hotel
  {
    public string Name { get; set; }
    public int Rooms { get; set; }

    public Hotel(string name, int rooms)
    {
      this.Name = name;
      this.Rooms = rooms;
    }
  }
}

Program class have Main() method that will create different Hotel instances with different names and will add to the list.
Then we will use OrderBy() and our Sort() methods to sort the same list. Will use Display() method to display the sorted list.

namespace SortingList
{
  class Program
  {

    static void Main(string[] args)
    {
      List<Hotel> _hotelList = new List<Hotel>();
      List<Hotel> _hotelOrderBy;
      List<Hotel> _hotelSortWithCompare = new List<Hotel>();

      Hotel hotel1 = new Hotel("Hotel01", 50);
      Hotel hotel2 = new Hotel("Hotel2", 50);
      Hotel hotel3 = new Hotel("Hotel10", 50);
      Hotel hotel4 = new Hotel("Hotel11", 50);
      Hotel hotel5 = new Hotel("Hotel3", 50);

      _hotelList.Add(hotel1);
      _hotelList.Add(hotel2);
      _hotelList.Add(hotel3);
      _hotelList.Add(hotel4);
      _hotelList.Add(hotel5);

      //using order by
      _hotelOrderBy = _hotelList.OrderBy(s => s.Name).ToList();
      Console.WriteLine("OrderBy() Method ");
      Console.WriteLine("*******************");
      Display(_hotelOrderBy);
      Console.WriteLine("*******************");
      Console.WriteLine();
      Console.WriteLine();

      //using Sort
      LogicalHotelCompare lc = new LogicalHotelCompare();
      _hotelSortWithCompare.AddRange(_hotelList);
      _hotelSortWithCompare.Sort(lc);
      Console.WriteLine("Sort() with Comparer");
      Console.WriteLine("*******************");
      Display(_hotelSortWithCompare);
      Console.WriteLine("*******************");

      Console.ReadKey();
    }

    static void Display(List<Hotel> list)
    {
      foreach (var item in list)
      {
        Console.WriteLine(item.Name);
      }
    }
  }
}


Result :


You can clearly see the difference of different sorting in above result.
Enjoy!