Koder Hack

WPF/Silverlight Content Ticker/News Ticker Control

2011-05-19T05:48:00.000-07:00

WPF includes the Canvas control that allows you to place elements using exact coordinates. To position an element on the Canvas, you set the attached Canvas.Left and Canvas.Top properties. Canvas.Left sets the number of units between the left edge of your element and the left edge of the Canvas. Canvas.Top sets the number of units between the top of your element and the top of the Canvas. Although the Canvas control has a definite visible area determined by the Height and Width properties of the control, it allows child controls to be virtually placed at any coordinates. We can use this particular feature of Canvas control to achieve the ticking/sliding effect by continuously changing the coordinates of the content.

Demo application screenshot.

ContentTicker control derives from WPF ContentControl. The ControlTemplate is defined to place the content in a Canvas control. Also a double animation is defined that is started on loading of the control. The animation target property is set to the attached property (Canvas.Left) of the content.

    public class ContentTicker : ContentControl
    {
        Storyboard _ContentTickerStoryboard = null;
        Canvas _ContentControl = null;
        ContentPresenter _Content = null;

        static ContentTicker()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(ContentTicker), new FrameworkPropertyMetadata(typeof(ContentTicker)));
        }

        public ContentTicker()
        {
            this.Loaded += new RoutedEventHandler(ContentTicker_Loaded);
        }

        ..
    }

The ContentTicker control defines two additional dependency properties for defining the rate (speed) of ticking and direction (east or west). The rate is used to calculate the duration of the animation, the time required to complete one cycle of the animation.

        public double Rate
        {
            get { return (double)GetValue(RateProperty); }
            set { SetValue(RateProperty, value); }
        }

        public static readonly DependencyProperty RateProperty =
            DependencyProperty.Register("Rate", typeof(double), typeof(ContentTicker), new UIPropertyMetadata(60.0));

        public TickerDirection Direction
        {
            get { return (TickerDirection)GetValue(DirectionProperty); }
            set { SetValue(DirectionProperty, value); }
        }

        public static readonly DependencyProperty DirectionProperty =
            DependencyProperty.Register("Direction", typeof(TickerDirection), typeof(ContentTicker), new UIPropertyMetadata(TickerDirection.West));

The Canvas size is adjusted while loading the control and Content is vertically aligned in the canvas according to the user specified settings. Further the animation parameters are adjusted according to the Width of Canvas and Content controls. The animation is dependent on the Width of the Canvas and the content so the animation details are updated every time the size of these are changed.

        void UpdateAnimationDetails(double holderLength, double contentLength)
        {
            DoubleAnimation animation = 
                _ContentTickerStoryboard.Children.First() as DoubleAnimation;
            if (animation != null)
            {
                bool start = false;
                if (IsStarted)
                {
                    Stop();
                    start = true;
                }

                double from = 0, to = 0, time = 0;
                switch (Direction)
                {
                    case TickerDirection.West:
                        from = holderLength;
                        to = -1 * contentLength;
                        time = from / Rate;
                        break;
                    case TickerDirection.East:
                        from = -1 * contentLength;
                        to = holderLength;
                        time = to / Rate;
                        break;
                }

                animation.From = from;
                animation.To = to;
                TimeSpan newDuration = TimeSpan.FromSeconds(time);
                animation.Duration = new Duration(newDuration);

                if (start)
                {
                    TimeSpan? oldDuration = null;
                    if (animation.Duration.HasTimeSpan)
                        oldDuration = animation.Duration.TimeSpan;
                    TimeSpan? currentTime = _ContentTickerStoryboard.GetCurrentTime(_ContentControl);
                    int? iteration = _ContentTickerStoryboard.GetCurrentIteration(_ContentControl);
                    TimeSpan? offset = 
                        TimeSpan.FromSeconds(
                        currentTime.HasValue ? 
                        currentTime.Value.TotalSeconds % (oldDuration.HasValue ? oldDuration.Value.TotalSeconds : 1.0) : 
                        0.0);
                    
                    Start();

                    if (offset.HasValue &&
                        offset.Value != TimeSpan.Zero &&
                        offset.Value < newDuration)
                        _ContentTickerStoryboard.SeekAlignedToLastTick(_ContentControl, offset.Value, TimeSeekOrigin.BeginTime);
                }
            }
        }

The ContentTicker control is generic control to slide the content. It can be used as a news ticker, thumbnails slider, RSS feed slider etc., depending on the requirement. The Start/Stop and Pause/Resume methods can be used to dynamically change the behavior of the sliding content. The demo application uses the control as a text ticker and provides the interfaces to change the speed, content and direction at run time.

Download Source

Converting Colored Image to Grayscale using C#

2011-05-04T00:55:00.000-07:00

Grayscale images also known as black-and-white images carry only intensity information and composed exclusively of shades of gray, varying from black at the weakest intensity and white at the strongest. To convert any color to a grayscale representation of its luminance, first one must obtain the values of its red, green, and blue (RGB) primaries in linear intensity encoding, by gamma expansion. Then, add together 30% of the red value, 59% of the green value, and 11% of the blue value (these weights depend on the exact choice of the RGB primaries, but are typical).

In C#, a colored image can be converted to grayscale by drawing an image using a Graphics object and rendering it with attributes whose color matrix is set to calculate the color intensities of each pixel according to the grayscale distribution mentioned earlier.

public Bitmap ConvertToGrayscale(Bitmap original)
{
    // Create the grayscale ColorMatrix
    ColorMatrix colorMatrix = new ColorMatrix(
        new float[][] 
        {
            new float[] {.3f, .3f, .3f, 0, 0},           // 30% Red
            new float[] {.59f, .59f, .59f, 0, 0},        // 59% Green
            new float[] {.11f, .11f, .11f, 0, 0},        // 11% Blue
            new float[] {0, 0, 0, 1, 0},                 // Alpha scales to 1
            new float[] {0, 0, 0, 0, 1}                  // W is always 1
        });

    ImageAttributes attributes = new ImageAttributes();
    attributes.SetColorMatrix(colorMatrix);

    // Create a blank bitmap the same size as original and draw
    // the source image at it using the grayscale color matrix.    
    using (Graphics g = Graphics.FromImage(new Bitmap(original.Width, original.Height))
    {
        g.DrawImage(original, new Rectangle(0, 0, original.Width, original.Height),
           0, 0, original.Width, original.Height, GraphicsUnit.Pixel, attributes);
    }
    return newBitmap;
}

Parallel Programming using Microsoft .NET Framework 4.0

2011-05-01T02:24:00.000-07:00

Wikipedia defines Parallel Computing as a form of computation in which many calculations are carried out simultaneously, operating on the principle that large problems can often be divided into smaller ones, which are then solved concurrently ("in parallel"). In the past concurrency was virtually achieved by time slicing the processor, i.e., OS would rapidly switch between running programs after a fixed interval called time slice. That would enable the OS to execute multiple programs simultaneously. These days most computers have more than one cores/CPUs that enable multiple threads to execute simultaneously. Using these cores you can parallelize your code to distribute work across multiple processors.

Microsoft has introduced a new set of libraries, diagnostic tools and runtime in .NET Framework 4.0 to enhance support for parallel computing. The main objective of these features is to simplify parallel development, i.e., writing parallel code in a natural idiom without having to work directly with threads. These include Task Parallel Library (TPL), Parallel LINQ, and new data structures.

Task Parallel Library

Task Parallel Library (TPL) is a set of types and APIs that simplifies adding parallelism and concurrency to the applications. It handles the partitioning of the work, scheduling of the threads on the ThreadPool, cancellation support, state management and other low level details. TPL introduces the concept of Data Parallelism, scenarios in which the same operation is performed concurrently on elements in a source collection or array. Parallel.For and Parallel.ForEach methods in the System.Threading.Tasks namespace are used for this purpose. For example, the following statement is used to concurrently process the items in a source collection;

Parallel.ForEach(sourceCollection, item => Process(item));

Both these methods have several overloads to let you stop or break loop execution, monitor the state of the loop on other threads, maintain thread-local state, finalize thread-local objects, control the degree of concurrency, and so on.

TPL provides other methods and data types to implicitly or explicitly executes tasks concurrently. The Parallel.Invoke method is used to execute any number of arbitrary statements concurrently. The method accepts variable no. of Action delegates as argument and executes these concurrently. The easiest way to create the Action delegates is to use lambda expressions. For example;

Parallel.Invoke(() => DoSomeWork(), () => DoSomeOtherWork());

If a greater control over task execution is required, or you need to return a value from the task TPL includes System.Threading.Tasks.Task and System.Threading.Tasks.Task<TResult> classes this purpose. The Task object handles the infrastructure details and provides methods/properties for controlling its execution and observing its status. For example, the Status property of a Task determines whether a task has started running, ran to completion, was cancelled, or has thrown an exception. The Task object accepts a delegate (named, anonymous or a lambda expression) as argument at initialization time. Calling the method Start on the Task object starts execution of the provided delegate.

// Create a task and provide a user delegate.
var task = new Task(() => Console.WriteLine("Hello from task."));

// Start the task.
taskA.Start();

The Task object contains a static property Factory that returns an object of the TaskFactory class that provides support for creating and scheduling Task objects.

// Create and start the task in one operation.
var taskA = Task.Factory.StartNew(() => Console.WriteLine("Hello from taskA."));

The Task class provides many other options to control the execution of operations assigned to the task. The Task.ContinueWith method let you specify a task to be started when the antecedent task completes. The user code executed using a Task can create nested detached and child Tasks. The child tasks are created when the TaskCreationOptions.AttachedToParent is specified while creating the Task. In case of child tasks, the parent task implicitly waits for all child tasks to complete.The Task class provides support to explicitly wait for a single or an array of tasks. The Task.Wait method let you wait for a task to complete. The Task.WaitAny and Task.WaitAll methods let you wait for any or all tasks in an array to complete. When a Task throws one or more exceptions, these are wrapped in an AggregateException and is propagated back to the joining thread. Also the Task class supports cooperative cancellation. The Task class takes a cancellation token as argument at initialization and user can issue cancellation request at some later time.

Parallel LINQ

Parallel LINQ is the parallel implementation of LINQ to objects. PLINQ implements the full set of LINQ standard query operators as extension methods and defines additional operators for parallel operations. PLINQ queries operate on any in-memory IEnumerable/IEnumerable<T> data source and have deferred execution. It partitions the data source into segments, and then executes the query on each segment on separate worker threads in parallel. The System.Linq.ParallelEnumerable exposes PLINQ's functionality and implements all the standard LINQ operators in addition with operators specific to parallel execution.

A query is executed in parallel when user calls the AsParallel extension method. All the subsequent operations are bound to the ParallelEnumerable implementation.

var source = Enumerable.Range(1, 10000);

// Opt-in to PLINQ with AsParallel
var evenNums = from num in source.AsParallel()
               where Compute(num) > 0
               select num;

PLINQ infrastructure analyzes the overall structure of a query at runtime and executes the query in parallel or sequentially based on the analysis. You can use the WithExecutionMode<TSource> and ParallelExecutionMode enumeration to enforce the PLINQ to use the parallel algorithm. Although PLINQ query operators revert to sequential mode automatically when required, for user-defined query operators the AsSequential operator can be used to revert back to sequential mode

In order to preserve the order of the source sequence in the results PLINQ provides the AsOrdered extension method for this purpose. The sequence is still processed in parallel but the results are buffered to maintain the order. This extra maintenance causes an ordered query to be slow compared to the default AsUnordered<TSource> sequence.

evenNums = from num in numbers.AsParallel().AsOrdered()
           where num % 2 == 0
           select num;

PLINQ queries use deferred execution and the operations are not executed until query is enumerated using a foreach. However, foreach itself does not run in parallel and requires the output from all parallel tasks be merged back into the thread on which the loop is running. For faster query execution when order preservation is not required, PLINQ provides the ForAll operator to parallelize processing of the results from query.

var nums = Enumerable.Range(10, 10000);

var query = from num in nums.AsParallel()
            where num % 10 == 0
            select num;

// Process the results as each thread completes
// and add them to a System.Collections.Concurrent.ConcurrentBag(Of Int)
// which can safely accept concurrent add operations
query.ForAll((e) => concurrentBag.Add(Compute(e)));

PLINQ queries also support cancellation as is supported by Task. The WithCancellation operator accepts the cancellation token instance as argument. When the IsCancellationRequested property is set on the token, PLINQ will stop processing on all threads and throw an OperationCancelledException.

PLINQ wraps the exceptions thrown by multiple threads while executing a query into an AggregateException type and marshals the exception back to the calling thread. Only one try-catch block is required on the calling thread.

Data Structures for Parallel Programming

The .NET Framework 4.0 introduces several new types that are useful in parallel programming including a set of concurrent collection classes, lightweight synchronization primitives, and types for lazy initialization.

The collection types in the System.Collections.Concurrent namespace provide thread-safe add and remove operations that avoid locks wherever possible and use fine-grained locking where locks are necessary. These include BlockingCollection<T>, ConcurrentBag<T>, ConcurrentDictionary<TKey, TValue>, ConcurrentQueue<T>, and ConcurrentStack<T>. Each of these collection types as compared to the types in System.Collections.Generic namespace provides the thread-safety while performing related operations,e.g., multiple threads can add/remove items from a ConcurrentBag.

In addition with concurrent collections, Microsoft has introduced a new set of fine-grained and performance efficient synchronization primitives in the .NET Framework 4.0. Some of the new types have no counterparts in earlier versions of .NET Framework. These types are defined in System.Threading namespace and include Barrier, CountdownEvent, ManualResetEventSlim, SemaphoreSlim, SpinLock and SpinWait.

The .NET Framework 4.0 also includes classes for initializing objects lazily, i.e., the memory for an object is not allocated until it is needed. Lazy initialization can improve performance by spreading object allocations evenly across the lifetime of a program. The System.Lazy<T>, System.Threading.ThreadLocal<T> and System.Threading.LazyInitializer are the classes used for this purpose.

Conclusion

The Task Parallel Library and Parallel LINQ uses System.Threading.ThreadPool for executing the operations concurrently. The thread pool allocates a pool of threads at the start of an application and manages the threads in a very efficient and intelligent manner. Still it has its own limitations which can affect the choice between a dedicated thread instead of a thread from the thread pool. When a foreground thread is required in an application, all the threads allocated in the pool are marked as background threads. Foreground threads have a priority over background threads and a few CPU intensive foreground threads can starve the background threads for their share of the processor which might result in unexpected performance degradation. Therefore one should consider the overall structure and working of the application while making use of TPL and PLINQ.

Priority Queue and Multi Value Sorted Dictionary in C#

2011-04-26T10:14:00.000-07:00

Microsoft .NET Framework contains a rich set of collection types including generic, non-generic and specialized and almost every kind of requirement can be handled using these collections. The introduction of concurrent collections in .NET Framework 4.0 has even closed the gap for writing custom thread safe collections. Concurrent collections provide the thread safety where multiple threads can access the collections concurrently and work on.

In one of my projects I required to use Priority Queue where I could sort the items according to a certain priority and retrieve the item with highest priority. Unfortunately .NET Framework does not include a specific collection type that provides this particular functionality. Searching the web I found multiple implementations of the data structure here on CodeProject and a third party library PowerCollections that included a number of other collection types. Although I could use any of these, I just wanted a wrapper over one of the .NET Framework collections instead.

Microsoft .NET Framework generic collections includes the sorted dictionary that represents a collection of key/value pairs sorted on the key. A priority queue can be thought of as a sorted dictionary but it includes multiple values for one key whereas sorted dictionary allows only one value per key. So the idea is to implement a multi value sorted dictionary and then wrap that collection to provide the interfaces for manipulating the Queue functionality.

The MultiValueSortedDictionary is a wrapper over the SortedDictionary and implements the generic and non-generic versions of IDictionary, ICollection and IEnumerable interfaces as are implemented by SortedDictionary. The class uses SortedDictionary in a composition relationship instead of inheriting to avoid tightly coupling it to the collection type and to encapsulate the multi value handling. The multiple values for a key are saved in a List collection and added to the dictionary.

public class MultiValueSortedDictionary<TKey, TValue> : 
                IDictionary<TKey, TValue>, ICollection<KeyValuePair<TKey, TValue>>, 
                IEnumerable<KeyValuePair<TKey, TValue>>, 
                IDictionary, ICollection, IEnumerable
    {
        private SortedDictionary<TKey, List<TValue>> _SortedDictionary;
        private int _Count;
        private bool _IsModified;

        ...
        ...
    }

The class uses the IComparer implementation provided to sort the keys. In-case none is provided then it uses the default IComparer implementation associated with the key. The class also accepts a generic dictionary list to copy the elements.

public MultiValueSortedDictionary()
        {
            _SortedDictionary = new SortedDictionary<TKey, List<TValue>>();
        }

        public MultiValueSortedDictionary(IComparer<TKey> comparer)
        {
            _SortedDictionary = new SortedDictionary<TKey, List<TValue>>(comparer);
        }

        public MultiValueSortedDictionary(IDictionary<TKey, TValue> dictionary)
            : this()
        {
            if (dictionary == null) throw new ArgumentNullException("dictionary");

            foreach (KeyValuePair<TKey, TValue> pair in dictionary)
                this.Add(pair.Key, pair.Value);
            _IsModified = false;
        }

        public MultiValueSortedDictionary(IDictionary<TKey, TValue> dictionary, IComparer<TKey> comparer)
            : this(comparer)
        {
            if (dictionary == null) throw new ArgumentNullException("dictionary");

            foreach (KeyValuePair<TKey, TValue> pair in dictionary)
                this.Add(pair.Key, pair.Value);
            _IsModified = false;
        }

While adding an item to the collection with a specified key and value, it first checks whether the specified key has already an associated list of values and adds the value to the list. Otherwise it creates a new instance of List<T> collection type, add the value to the list and sets it as the value of the provided key in the sorted dictionary.

public void Add(TKey key, TValue value)
        {
            if (key == null) throw new ArgumentNullException("key");
            
            List<TValue> values;

            if (!_SortedDictionary.TryGetValue(key, out values))
            {
                values = new List<TValue>();
                _SortedDictionary[key] = values;
            }

            values.Add(value);
            ++_Count;
            _IsModified = true;
        }

The class implements the indexed property to access the values using array like notation and key as index. It returns the first value in the associated list of values for the key when used as getter and adds the value at the end of list of values associated with the provided key when used as setter.

public TValue this[TKey key]
        {
            get
            {
                if (key == null) throw new ArgumentNullException("key");

                List<TValue> values;
                if (!_SortedDictionary.TryGetValue(key, out values))
                    throw new KeyNotFoundException();
                TValue value = default(TValue);
                if (values != null)
                    value = values[0];
                return value;
            }
            set
            {
                if (key == null) throw new ArgumentNullException("key");

                Add(key, value);
            }
        }

The class also implements two methods to remove a key and its associated values from the dictionary or a specific value associated with a key. The method to remove all the associated values of a key accepts the key as parameter and removes the associated list. The method to remove a key/value pair retrieves the list of values associated with the key and deletes the first instance of the value from the list. If the list contains no further values then the key is also removed from the dictionary.

public bool Remove(TKey key)
        {
            if (key == null) throw new ArgumentNullException();

            bool removed = false;
            List<TValue> values;
            if (_SortedDictionary.TryGetValue(key, out values) &&
                _SortedDictionary.Remove(key))
            {
                _Count -= values.Count;
                _IsModified = removed = true;
            }
            return removed;
        }

        public bool Remove(KeyValuePair<TKey, TValue> item)
        {
            if (item.Key == null ||
                item.Key == null)
                throw new ArgumentException();

            bool removed = false;
            List<TValue> values;
            if (_SortedDictionary.TryGetValue(item.Key, out values) &&
                values.Remove(item.Value))
            {
                --_Count;
                if (values.Count == 0)
                    _SortedDictionary.Remove(item.Key);
                removed = true;
                _IsModified = true;
            }
            return removed;
        }

Similarly it provides interfaces to safely retrieve a single value or the list of values associated with a key. The two overloads of TryGetValue method are used for this purpose.

public bool TryGetValue(TKey key, out TValue value)
        {
            if (key == null) throw new ArgumentNullException();

            value = default(TValue);
            bool found = false;
            List<TValue> values;
            if (_SortedDictionary.TryGetValue(key, out values))
            {
                value = values[0];
                found = true;
            }
            return found;
        }

        public bool TryGetValue(TKey key, out IEnumerable<TValue> values)
        {
            if (key == null) throw new ArgumentNullException();

            values = null;
            bool found = false;
            List<TValue> valuesList;
            if (_SortedDictionary.TryGetValue(key, out valuesList))
            {
                values = valuesList;
                found = true;
            }
            return found;
        }

Further the class defines an inner structure that implements the enumeration interfaces. The enumerator is basically a wrapper over the SortedDictionary and the List enumerators. The MoveNext method iterates recursively over both the enumerators to retrieve the next available key/value pair.

public struct Enumerator : 
            IEnumerator<KeyValuePair<TKey, TValue>>, IDisposable, IDictionaryEnumerator, IEnumerator
        {
            private readonly KeyValuePair<TKey, TValue> DefaultCurrent;
            private MultiValueSortedDictionary<TKey, TValue> _Dictionary;
            private IEnumerator<KeyValuePair<TKey, List<TValue>>> _Enumerator1;
            private IEnumerator<TValue> _Enumerator2;
            private KeyValuePair<TKey, TValue> _Current;

            public bool MoveNext()
            {
                //if (_Disposed)
                //    throw new InvalidOperationException("The enumerator has already been disposed.");

                if (_Dictionary._IsModified)
                    throw new InvalidOperationException("The collection was modified after the enumerator was created.");

                if (!_Valid) return false;
                TKey key = default(TKey);
                TValue value = default(TValue);
                if (_Enumerator2 == null)
                {
                    if (_Enumerator1.MoveNext())
                    {
                        if (_Enumerator1.Current.Value != null)
                            _Enumerator2 = _Enumerator1.Current.Value.GetEnumerator();
                    }
                    else
                        _Valid = false;
                }

                if (!_Valid) return false;

                key = _Enumerator1.Current.Key;
                if (_Enumerator2 != null)
                {
                    if (_Enumerator2.MoveNext())
                        value = _Enumerator2.Current;
                    else
                    {
                        _Enumerator2 = null;
                        return MoveNext();
                    }
                }
                _Current = new KeyValuePair<TKey, TValue>(key, value);
                return true;
            }
        }

Once the MultiValueSortedDictionary is implemented, it can be used directly as a priority queue or a wrapper class can be defined that provides the interface for using the collection as a queue.

public class PriorityQueue<TPriority, TItem> : 
        IDictionary<TPriority, TItem>, IEnumerable<KeyValuePair<TPriority, TItem>>, IDictionary, ICollection, IEnumerable
    {
        MultiValueSortedDictionary<TPriority, TItem> _Dictionary;

        ...
        ...

        public void Enqueue(TPriority priority, TItem item)
        {
            if (priority == null)
                throw new ArgumentNullException("priority");
            _Dictionary.Add(priority, item);
        }

        public TItem Dequeue()
        {
            if (Count == 0)
                throw new InvalidOperationException("The KoderHack.Collections.PriorityQueue<TPriority, TItem> is empty.");

            KeyValuePair<TPriority, TItem> pair = _Dictionary.First();
            _Dictionary.Remove(pair);
            return pair.Value;
        }

        public TItem Peek()
        {
            if (Count == 0)
                throw new InvalidOperationException("The KoderHack.Collections.PriorityQueue<TPriority, TItem> is empty.");

            return _Dictionary.First().Value;
        }
    }

That is all implementing a priority queue. I hope this helps!

Download Source

WPF / Silverlight Countdown Timer and Time Ticker TextBlock

2011-04-21T13:14:00.000-07:00

In one of my applications I had to display a timer for all the items in a ListView, i.e., given the last update time of an item I required to display the time elapsed since the update time and update it after every second. In a classic application the solution would have been to add a timer control to the host form and update each elapsed time value at each tick (second) of the timer.

However in WPF/Silverlight we can easily achieve this by creating a custom control inheriting it from the TextBlock control. The custom control defines a TimeSpan property that holds the time elapsed (or time remaining in case of count down) and binds it to the TextBlock.Text property. The TimeSpan is updated every second and thus the Text property displays the updated value.

Image: Countdown Timer and Time Ticker Demo using TimerTextBlock control.

The control uses System.Threading.Timer object for providing updates. The control initializes a static Timer object with an interval of one second and the TimerCallback delegate that is raised after the provided interval. Also the control defines a private static event OnTick that is raised in the callback method.

        private static event EventHandler OnTick;
        private static Timer _UpdateTimer = new Timer(new TimerCallback(UpdateTimer), null, 1000, 1000);

        private static void UpdateTimer(object state)
        {
            EventHandler onTick = OnTick;
            if (onTick != null)
                onTick(null, EventArgs.Empty);
        }

The control subscribes the OnTick event while loading to receive the event and unsubscribes the event while unloading. Also the control binds the TimeSpan property with TextBlock.Text property. Thus the TextBlock.Text property displays the updated TimeSpan value formatted according to the provide TimeFormat.

        private void Init()
        {
            Loaded += new RoutedEventHandler(TimerTextBlock_Loaded);
            Unloaded += new RoutedEventHandler(TimerTextBlock_Unloaded);
        }


        void TimerTextBlock_Loaded(object sender, RoutedEventArgs e)
        {
            Binding binding = new Binding("TimeSpan");
            binding.Source = this;
            binding.Mode = BindingMode.OneWay;
            binding.StringFormat = TimeFormat;

            SetBinding(TextProperty, binding);           

            _UpdateTimeInvoker = new Invoker(UpdateTime);

            OnTick += new EventHandler(TimerTextBlock_OnTick);
        }

        void TimerTextBlock_Unloaded(object sender, RoutedEventArgs e)
        {
            OnTick -= new EventHandler(TimerTextBlock_OnTick);
        }

The TimeSpan is updated in the OnTick event handler.

        void TimerTextBlock_OnTick(object sender, EventArgs e)
        {
            Dispatcher.Invoke(_UpdateTimeInvoker);
        }

        private void UpdateTime()
        {
            if (IsStarted)
            {
                TimeSpan step = TimeSpan.FromSeconds(1);
                if (IsCountDown)
                {
                    if (TimeSpan >= TimeSpan.FromSeconds(1))
                    {
                        TimeSpan -= step;
                        if (TimeSpan.TotalSeconds <= 0)
                        {
                            TimeSpan = TimeSpan.Zero;
                            IsStarted = false;
                            NotifyCountDownComplete();
                        }
                    }
                }
                else
                {
                    TimeSpan += step;
                }
            }
        }

        private void NotifyCountDownComplete()
        {
            EventHandler handler = OnCountDownComplete;
            if (handler != null)
                handler(this, EventArgs.Empty);
        }

The control defines additional properties for manipulating and customizing the output. The dependecy property IsStarted is used to start/stop the timer. The dependency property IsCountDown is used to specify the behavior whether to increase or decrease the TimeSpan at each tick. Also the control defines the dependency property TimeFormat for displaying the time elapsed in a specific format. The TimeSpan class accepts 'c', 'g' and 'G' as standard format specifiers and formats the output using the common specifier 'c' if none is provided. Also the control defines an event OnCountDownComplete that is raised when the IsCountDown property is set and the TimeSpan value reaches zero.

In order to use the control from XAML, declare the custom XAML namespace and map it to the library that defines the control.

xmlns:kh="clr-namespace:KoderHack.WPF.Controls;assembly=KoderHack.WPF.Controls"

Once the library is available, you can declare the type as follows;

<kh:TimerTextBlock x:Name="ttbCountDown" IsCountDown="True" TimeSpan="00:00:59" IsStarted="True" Width="180" HorizontalAlignment="Center" TextAlignment="Center" FontSize="24" Padding="10" OnCountDownComplete="ttbCountDown_OnCountDownComplete" />

Download Demo and Source