<?xml version="1.0" encoding="UTF-8" standalone="no"?><rss xmlns:atom="http://www.w3.org/2005/Atom" xmlns:blogger="http://schemas.google.com/blogger/2008" xmlns:gd="http://schemas.google.com/g/2005" xmlns:georss="http://www.georss.org/georss" xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" xmlns:openSearch="http://a9.com/-/spec/opensearchrss/1.0/" xmlns:thr="http://purl.org/syndication/thread/1.0" version="2.0"><channel><atom:id>tag:blogger.com,1999:blog-2748846470874858588</atom:id><lastBuildDate>Fri, 01 Nov 2024 06:46:48 +0000</lastBuildDate><category>Full Trust XBAP Application In WPF</category><category>Adorner</category><category>Attached Properties In WPF</category><category>DataBinding In WPF</category><category>Dependency Properties In WPF.</category><category>What is WPF And What It's Futures.</category><category>XML DataBinding In WPF</category><category>Binding Attached Property</category><category>Content Model</category><category>Coordinate Systems</category><category>Designer Support</category><category>Enum As ItemsSource</category><category>Focus Manager</category><category>Freezable Objects In WPF</category><category>Host WPF Controls In WinForms Application</category><category>ItemsPanelTemplate object reference</category><category>Layout's In WPF</category><category>MCTS</category><category>Resources In WPF</category><category>Routed Events In WPF</category><category>Silverlight Image Download Progress Indicator</category><category>System Brushes List</category><category>Threading</category><category>Timer and Dispatcher</category><category>ToolTip for Disabled Element in Silverlight</category><category>WCF Serivce Call</category><category>WPF Designer Load Failures</category><category>assembly sign</category><title>Venugopal on WPF and Silverlight</title><description>Right place to discuss about Silverlight and WPF. Lets join with me to share more information about this amazing technology.</description><link>http://venugopal-wpfandxaml.blogspot.com/</link><managingEditor>noreply@blogger.com (Venugopal)</managingEditor><generator>Blogger</generator><openSearch:totalResults>38</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>25</openSearch:itemsPerPage><language>en-us</language><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-3766571164037785043</guid><pubDate>Mon, 10 Oct 2011 07:20:00 +0000</pubDate><atom:updated>2011-10-10T03:27:03.434-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">MCTS</category><title>Microsoft Certified Technology Specialist (MCTS) Silverlight 4 Development</title><description>&lt;span style="font-family:verdana;font-size:85%;"&gt;I am really happy to share my first experience on MCTS exam. Yes, I successfully completed my Microsoft Certified Technology Specialist (MCTS) Silverlight 4 Development certification today. Really it was nice experience since it is first certification exam in my career. I just want to share some technical information about this exam. Hope following information will be useful to you guys when you plan for silverlight certification exam.&lt;br /&gt;&lt;/span&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;strong&gt;Here is the info:&lt;br /&gt;&lt;/strong&gt;&lt;/span&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;Total questions are 50 and given time was 2:20 hrs. Here are the section details. &lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;br /&gt;&lt;li&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;em&gt;10 questions from data model (MVVM) &lt;/em&gt;&lt;/span&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;em&gt;5 questions from WCF service reference. &lt;/em&gt;&lt;/span&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;em&gt;5 to 7 questions from templates and styles. &lt;/em&gt;&lt;/span&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;em&gt;2 questions from out of browser &lt;/em&gt;&lt;/span&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;em&gt;3 questions from Object tag in aspx file. &lt;/em&gt;&lt;/span&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;em&gt;10 questions from typical xaml and code behind logic such as event handler, background thread, dependency properties, etc. &lt;/em&gt;&lt;/span&gt;&lt;/li&gt;&lt;/ul&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;&lt;br /&gt;&lt;p&gt;&lt;/span&gt;&lt;/p&gt;&lt;span style="font-family:verdana;font-size:85%;"&gt;That’s all I could remember. However, people can pass this exam very easily if you have good experience on MVVM, control templates, styles, basic WCF configuration and deployment, dependency properties and custom controls.&lt;br /&gt;My transcript &lt;a href="https://mcp.microsoft.com/authenticate/ValidateMCP.aspx"&gt;link&lt;/a&gt;. (Transcript ID (982461) and the Access Code (12345678)&lt;br /&gt;Enjoy! &lt;/span&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2011/10/microsoft-certified-technology.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-5184749326907733238</guid><pubDate>Thu, 02 Dec 2010 07:20:00 +0000</pubDate><atom:updated>2010-12-01T23:23:07.337-08:00</atom:updated><title>Microsoft released free eBook for VS2010</title><description>&lt;span style="font-size:85%;"&gt;Hi All,&lt;br /&gt;&lt;br /&gt;Good news. Microsoft released free eBook for VS2010.&lt;br /&gt;Download from here.&lt;br /&gt;&lt;a href="http://blogs.msdn.com/b/microsoft_press/archive/2010/09/13/free-ebook-moving-to-microsoft-visual-studio-2010.aspx"&gt;http://blogs.msdn.com/b/microsoft_press/archive/2010/09/13/free-ebook-moving-to-microsoft-visual-studio-2010.aspx&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal. &lt;/span&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/12/microsoft-released-free-ebook-for.html</link><thr:total>1</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-701788723318212373</guid><pubDate>Fri, 12 Nov 2010 09:30:00 +0000</pubDate><atom:updated>2010-11-12T01:33:08.600-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">WCF Serivce Call</category><title>Solution for "The underlying provider failed on Open" exception.</title><description>As you guys know that I am posting enterprise architecture design article in code project &lt;a href="http://www.codeproject.com/KB/architecture/EnterpriseAppArch.aspx"&gt;here&lt;/a&gt;. While preparing third part, I started to implement simple tier application for demo. After completing server side implementation, I started to implement simple client for demo purpose. Once completed with client, i tried to run my demo application. But unfortunately I got the strange exception called "The underlying provider failed on Open". I googled more than an hour and found that most of the folks facing the same issue when they try to call the service which contains database access in local sql server through IIS. But no one is providing proper solution for this issue. Everyone says that IIS uses network credentials when it contacts sql server authentication process. So we should grant access to "NT AUTHORITY\NETWORK SERVICE" to your database.&lt;br /&gt;But this is not the right solution and no one is saying how to fix the issue. After spending some hours, found the solution and my app running without any issues.&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Here is the solution.&lt;br /&gt;&lt;br /&gt;As folks mentioned IIS user network service user credentials while trying to log in sql server. So just change the Application pool settings in your IIS.&lt;br /&gt;&lt;br /&gt;Step 1: Open Internet Information Service Manager&lt;br /&gt;Step 2: Click on Application Pools in left navigation tree.&lt;br /&gt;Step 3: Select your version Pool. In my case, I am using ASP .Net v4.0. If you dont have this version, select DefaultAppPool.&lt;br /&gt;Step 4: Right click on step 3, and select advanced settings.&lt;br /&gt;Step 5: Select Identity in properties window and click the button to change the value.&lt;br /&gt;Step 6: Select Local System in Built-in accounts combo box and click ok.&lt;br /&gt;That's it. Now run your application. Everything works well.&lt;br /&gt;&lt;br /&gt;Enjoy!!!.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/11/solution-for-underlying-provider-failed.html</link><thr:total>1</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-8299573186877793790</guid><pubDate>Tue, 05 Oct 2010 09:12:00 +0000</pubDate><atom:updated>2010-10-05T02:23:05.828-07:00</atom:updated><title>Enterprise Application Architecture: Designing Applications and Services in .Net - Part I</title><description>&lt;strong&gt;&lt;em&gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-family:verdana;"&gt;A guided tour of the distributed enterprise application design in .Net&lt;/span&gt; &lt;/span&gt;&lt;br /&gt;&lt;/em&gt;&lt;/strong&gt;&lt;h2&gt;Introduction&lt;/h2&gt;&lt;p&gt;&lt;span style="font-size:85%;"&gt;This article is an attempt to show how to implement distributed application in .Net framework from the scratch. Indeed I can share my experience which I hope will be useful for architects (Obviously beginners in architecture design) or a lead developer wants to become an architect to start with. The application will contain simple web client CustomerOrderManagement System with our own distributed application platform. &lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-size:85%;"&gt;The application will cover the following parts,&lt;/span&gt;&lt;/p&gt;&lt;ul&gt;&lt;li&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;Part 1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;strong&gt;&lt;span style="font-size:85%;"&gt; (Distributed Application Layers with project details):&lt;/span&gt;&lt;/strong&gt;&lt;span style="font-size:85%;"&gt; Learn about what is layered design in distributed environment and how we are going to name it while implementing the actual app. &lt;/span&gt;&lt;/li&gt;&lt;li&gt;&lt;span&gt;Part 2&lt;/span&gt;&lt;strong&gt;&lt;span style="font-size:85%;"&gt; (Database and Library Design):&lt;/span&gt;&lt;/strong&gt;&lt;span style="font-size:85%;"&gt; Learn about database design and implementing library which interacts with Edmx container. &lt;/span&gt;&lt;/li&gt;&lt;li&gt;&lt;span&gt;Part 3&lt;/span&gt;&lt;strong&gt;&lt;span style="font-size:85%;"&gt; (Engine and Service Managers design):&lt;/strong&gt; Learn how to implement the engine which has core business logic and implementing the actual WCF service with service contracts. And also how to test the service using test client. &lt;/span&gt;&lt;/li&gt;&lt;li&gt;&lt;span&gt;Part 4&lt;/span&gt;&lt;strong&gt;&lt;span style="font-size:85%;"&gt; (Client implementation):&lt;/strong&gt; Learn how to implement the actual client with MVVM pattern which invokes services. &lt;/span&gt;&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;&lt;span style="font-size:85%;"&gt;Follow my articles in &lt;/span&gt;&lt;a href="http://www.codeproject.com/KB/architecture/EnterpriseAppArch.aspx"&gt;&lt;span style="font-size:85%;"&gt;codeproject&lt;/span&gt; &lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-size:85%;"&gt;Thanks,&lt;br /&gt;Venugopal.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/10/enterprise-application-architecture.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-7680076619690652107</guid><pubDate>Wed, 25 Aug 2010 15:27:00 +0000</pubDate><atom:updated>2010-08-25T11:30:21.585-07:00</atom:updated><title>Lazy(Of T) class in .Net Framework4.0</title><description>&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;.Net Framework provides us with a new class called Lazy&amp;lt;T&amp;gt; which is used to initialize the object in lazy pace. It includes the ability to initialize the value types and to use null values. Using this class, we could implement complex navigation related applications very effectively with less memory use. For instance, consider the situation like I have a property which holds array of user controls(Approx 50 User Controls) in Silverlight application. In this instance, need to display five user controls in main page, but need to initiate all these fifty user controls to get the actual references while application load since I need to bind some elements between user controls. At the same time, rest of the user controls will be displayed when user navigate explicitly. &lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;If we implement such a application using typical .Net property declaration/initialization without using the Lazy class, all the user control will be initialized when we use new keyword while adding items in my array property. Below is the typical .Net initialization. &lt;/span&gt;&lt;/p&gt;&lt;table border="1" cellspacing="0" cellpadding="2" width="532"&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td valign="top" width="530"&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;color:#800000;"&gt;// Property declaration&lt;br /&gt;private UserControl[] loadMyUserControl;&lt;br /&gt;public UserControl[] LoadMyUserControl&lt;br /&gt;{&lt;br /&gt;get&lt;br /&gt;{&lt;br /&gt;return loadMyUserControl;&lt;br /&gt;}&lt;br /&gt;set&lt;br /&gt;{&lt;br /&gt;loadMyUserControl = value;&lt;br /&gt;}&lt;br /&gt;} &lt;/span&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;color:#800000;"&gt;// Initializing property.&lt;br /&gt;public MainPage()&lt;br /&gt;{ &lt;/span&gt;&lt;p&gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-family:c;"&gt;&lt;span style="color:#800000;"&gt;InitializeComponent();&lt;br /&gt;var userControls = new UserControl[]&lt;br /&gt;{&lt;br /&gt;new UserControl1(),&lt;br /&gt;new UserControl2(),&lt;br /&gt;new UserControl3()&lt;br /&gt;};&lt;br /&gt;}&lt;/span&gt; &lt;/span&gt;&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;In this approach, my application consumes unnecessary memory(Nearly 45 user control memory) when user open my application and closes without navigating into other pages.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;But Lazy initialization occurs the first time the &lt;/span&gt;&lt;a href="http://msdn.microsoft.com/en-us/library/dd642177.aspx"&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Lazy&amp;lt;T&amp;gt;.Value&lt;/span&gt;&lt;/a&gt;&lt;span style="font-family:c;font-size:85%;"&gt; property is accessed or the &lt;/span&gt;&lt;a href="http://msdn.microsoft.com/en-us/library/dd642266.aspx"&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Lazy&amp;lt;T&amp;gt;.ToString&lt;/span&gt;&lt;/a&gt;&lt;span style="font-family:c;font-size:85%;"&gt; method is called. For my scenario, five user controls instance and memory only created while loading my application. Rest of the user controls will be created when user navigate to the corresponding page through navigation link from my main page. Below is the code snippet for lazy load.&lt;/span&gt;&lt;/p&gt;&lt;table border="1" cellspacing="0" cellpadding="2" width="528"&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td valign="top" width="526"&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;color:#800000;"&gt;// Property declaration&lt;br /&gt;private Lazy&amp;lt;UserControl&amp;gt;[] loadMyUserControl;&lt;br /&gt;public Lazy&amp;lt;UserControl&amp;gt;[] LoadMyUserControl&lt;br /&gt;{&lt;br /&gt;get&lt;br /&gt;{&lt;br /&gt;return loadMyUserControl;&lt;br /&gt;}&lt;br /&gt;set&lt;br /&gt;{&lt;br /&gt;loadMyUserControl = value;&lt;br /&gt;}&lt;br /&gt;} &lt;/span&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;color:#800000;"&gt;// Initializing property.&lt;br /&gt;public MainPage()&lt;br /&gt;{&lt;br /&gt;InitializeComponent();&lt;br /&gt;LoadMyUserControl = new Lazy&amp;lt;UserControl&amp;gt;[]&lt;br /&gt;{&lt;br /&gt;new Lazy&amp;lt;UserControl&amp;gt;(() =&amp;gt; {return new UserControl1();&lt;br /&gt;}),&lt;br /&gt;new Lazy&amp;lt;UserControl&amp;gt;(() =&amp;gt; {return new UserControl2();&lt;br /&gt;}),&lt;br /&gt;new Lazy&amp;lt;UserControl&amp;gt;(() =&amp;gt; {return new UserControl3();&lt;br /&gt;})&lt;br /&gt;};&lt;br /&gt;}&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Now I am going to load my user controls based on navigation at runtime as below mentioned.&lt;/span&gt;&lt;/p&gt;&lt;table border="1" cellspacing="0" cellpadding="2" width="522"&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td valign="top" width="520"&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;color:#800000;"&gt;// Loading my fifth user control on button click&lt;br /&gt;private void Button_Click_1(object sender, RoutedEventArgs e)&lt;br /&gt;{&lt;br /&gt;if (!TopPanel.Children.Contains(LoadMyUserControl[5].Value))&lt;br /&gt;TopPanel.Children.Add(LoadMyUserControl[5].Value);&lt;br /&gt;}&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;&lt;/span&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;color:#800000;"&gt;&lt;/span&gt;&lt;/p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Note : TopPanel is the stack panel which is in main page of the application. See the demo sample for more idea.&lt;/span&gt; &lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Run the demo app and click “Status” button. Check the status of user controls. Still all the user controls are not loaded as shown in below mentioned snap. &lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;a href="http://lh6.ggpht.com/_w2vD5QILzU4/THU2cUwX7UI/AAAAAAAAApQ/BzlGYuyWQM4/s1600-h/InitialLoad%5B5%5D.png"&gt;&lt;span style="font-family:c;font-size:85%;"&gt;&lt;img style="BORDER-RIGHT-WIDTH: 0px; DISPLAY: inline; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px" title="InitialLoad" border="0" alt="InitialLoad" src="http://lh3.ggpht.com/_w2vD5QILzU4/THU2dh0HQAI/AAAAAAAAApU/x1VnCQZOzxg/InitialLoad_thumb%5B3%5D.png?imgmax=800" width="517" height="297" /&gt;&lt;/span&gt;&lt;/a&gt;&lt;span style="font-family:c;font-size:85%;"&gt; &lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Click “Load UserControl1” button and check the status. Now you could see, first user control loaded in view and status has been changed as True. What a great feature in framework4.0. :)&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;a href="http://lh4.ggpht.com/_w2vD5QILzU4/THU2eXgplyI/AAAAAAAAApY/DGeXfb24lw0/s1600-h/FirstLoaded%5B8%5D.png"&gt;&lt;span style="font-family:c;font-size:85%;"&gt;&lt;img style="BORDER-RIGHT-WIDTH: 0px; DISPLAY: inline; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px" title="FirstLoaded" border="0" alt="FirstLoaded" src="http://lh6.ggpht.com/_w2vD5QILzU4/THU2e0ZJWVI/AAAAAAAAApc/msMsKOFNhVE/FirstLoaded_thumb%5B6%5D.png?imgmax=800" width="519" height="279" /&gt;&lt;/span&gt;&lt;/a&gt;&lt;span style="font-family:c;font-size:85%;"&gt; &lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;You can refer &lt;/span&gt;&lt;a href="http://msdn.microsoft.com/en-us/vcsharp/bb870976.aspx"&gt;&lt;span style="font-family:c;font-size:85%;"&gt;this&lt;/span&gt;&lt;/a&gt;&lt;span style="font-family:c;font-size:85%;"&gt; in msdn documentation for more idea about Lazy class.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;a href="https://cid-b6892ce76c81ff21.office.live.com/self.aspx/LazyDemo/SilverlightApplication1.zip"&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Here&lt;/span&gt;&lt;/a&gt;&lt;span style="font-family:c;font-size:85%;"&gt; is the simple real time Silverlight sample which illustrates the same. &lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Enjoy :)&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Thanks,&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;Venugopal.&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="font-family:c;font-size:85%;"&gt;&lt;/span&gt;&lt;/p&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/08/lazyof-t-class-in-net-framework40.html</link><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" height="72" url="http://lh3.ggpht.com/_w2vD5QILzU4/THU2dh0HQAI/AAAAAAAAApU/x1VnCQZOzxg/s72-c/InitialLoad_thumb%5B3%5D.png?imgmax=800" width="72"/><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-236603887793540811</guid><pubDate>Wed, 04 Aug 2010 12:48:00 +0000</pubDate><atom:updated>2010-08-04T06:59:52.990-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Silverlight Image Download Progress Indicator</category><title>Silverlight Image download indicator with MVVM Pattern</title><description>&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:130%;"&gt;&lt;span style="color: rgb(0, 0, 0); font-weight: bold;font-family:verdana;" &gt;&lt;span style="line-height: 115%;"&gt;&lt;span style="font-size:100%;"&gt;Introduction&lt;/span&gt;
&lt;br /&gt;
&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(0, 0, 0);font-family:verdana;font-size:85%;"  &gt;Microsoft Silverlight provides a BitmapImage class, which supports a set of features for Image expression including some of the useful events such as &lt;span style="color: rgb(0, 0, 0);"&gt;DownloadProgress, ImageFailed and ImageOpened&lt;/span&gt; events. These events can be effectively used to have a UI with nice look and feel by displaying download progress in case the images are downloaded from the web dynamically.  &lt;!--[if !supportLineBreakNewLine]--&gt;  &lt;!--[endif]--&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%; color: rgb(0, 0, 0);font-size:85%;" &gt;Probably, some folks might already have solution for this scenario. But I hope many developers don’t think in the same way. So, have got something to share on this based on my experience. My approach involves simple SpinAnimation custom control implementation. Also there are chances that my solution may not be offering something of the expertise level but at least it can help to discover the approach&lt;/span&gt;&lt;span style="font-size:85%;"&gt; :)&lt;/span&gt;&lt;span style="line-height: 115%;font-size:85%;" &gt;. &lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="font-size:85%;"&gt;This post explores a number of concepts; first, it involves creating tiny custom SpinAnimation control with animation, next, implementing a View Model (To follow MVVM pattern) with necessary properties for indicating progress details to the View and finally, creating&lt;/span&gt;&lt;span style=";font-size:85%;" &gt;  &lt;/span&gt;&lt;span style="font-size:85%;"&gt;View to design the UI with Model property binding.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="font-weight: bold;font-size:130%;" &gt;&lt;span style="line-height: 115%;"&gt;SpinAnimationControl - &lt;/span&gt;&lt;/span&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="line-height: 115%; font-weight: bold;font-size:130%;" &gt;Custom  Silverlight control &lt;/span&gt;&lt;b style=""&gt;&lt;span style="line-height: 115%;"&gt;
&lt;br /&gt;&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt; &lt;span style="font-size:85%;"&gt;As there are more articles on how to create custom control in Silverlight, I am directly jumping on to the main code that is related to changing the visibility of the control based on download progress value. I know, you are asking now, why SpinAnimation control? &lt;/span&gt;&lt;/span&gt;&lt;span style="line-height: 115%;font-size:85%;" &gt;&lt;span style=""&gt;J&lt;/span&gt;&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="font-size:85%;"&gt; Can’t we change the visibility of the SpinAnimation Control based on model property value? Yes, we can change, but I want to do some operation when the visibility of animation element gets changed. Like stop and start the animation when element visibility value gets changed. Both WPF and SL do not provide the Visibility property changed callback by default. But you could achieve using property metadata override logic in WPF. Unfortunately Silverlight doesn’t have feature to override the property metadata like WPF does.&lt;/span&gt;&lt;span style=";font-size:85%;" &gt;  &lt;/span&gt;&lt;span style="font-size:85%;"&gt;So we can go ahead with generic solution which works both in SL and WPF. Let's start with SpinAnimation control constructor, which is pretty basic:&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="margin-bottom: 0.0001pt; line-height: normal;font-family:verdana;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-weight: bold;"&gt;Setting default style key for custom control.&lt;/span&gt;&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="margin-bottom: 0.0001pt; line-height: normal;font-family:verdana;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="margin-left: 5.4pt; border-collapse: collapse; border: medium none; width: 658px; height: 162px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 94pt;"&gt;   &lt;td style="width: 462.5pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 94pt;" valign="top" width="617"&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 12.95pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;class&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;SpinAnimationControl&lt;/span&gt; : &lt;span style="color: rgb(43, 145, 175);"&gt;Control&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 12.95pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 12.95pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt;   &lt;span style="color: rgb(43, 145, 175);"&gt;SpinAnimationControl&lt;/span&gt; ()&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 12.95pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 12.95pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;            &lt;/span&gt;&lt;span style="color:blue;"&gt;this&lt;/span&gt;.DefaultStyleKey   = &lt;span style="color:blue;"&gt;typeof&lt;/span&gt;(&lt;span style="color: rgb(43, 145, 175);"&gt;SpinAnimationControl&lt;/span&gt;);&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 12.95pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style=""&gt;        &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 12.95pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;}&lt;span style="color:blue;"&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;Creating dependency property called Progress which receives the download progress value from application side. Note that I have mentioned property value changed callback &lt;/span&gt;&lt;span style="font-size:85%;"&gt;&lt;b style="color: rgb(0, 0, 0);"&gt;OnProgressChanged &lt;/b&gt;&lt;/span&gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;in PropertyMetadata. In this call back, if new value is less then 100, I am assuming that image is still not downloaded. If value is equal to 100, image gets downloaded witout any issue. So, I can change the visibility of my SpinAnimation control based on the new value. And also I can stop and start the animation after I change the visibility. Please refer the property value changed callback method for more details below.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="width: 657px; margin-left: 5.4pt; border-collapse: collapse; border: medium none; height: 182px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 132.3pt;"&gt;   &lt;td style="width: 463.5pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 132.3pt;" valign="top" width="618"&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 17.5pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;int&lt;/span&gt; Progress&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 17.5pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 17.5pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;            &lt;/span&gt;&lt;span style="color:blue;"&gt;get&lt;/span&gt;   { &lt;span style="color:blue;"&gt;return&lt;/span&gt; (&lt;span style="color:blue;"&gt;int&lt;/span&gt;)GetValue(ProgressProperty);   }&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 17.5pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;            &lt;/span&gt;&lt;span style="color:blue;"&gt;set&lt;/span&gt;   { SetValue(ProgressProperty, &lt;span style="color:blue;"&gt;value&lt;/span&gt;); }&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 17.5pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 17.5pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt;   &lt;span style="color:blue;"&gt;static&lt;/span&gt; &lt;span style="color:blue;"&gt;readonly&lt;/span&gt;   &lt;span style="color: rgb(43, 145, 175);"&gt;DependencyProperty&lt;/span&gt; ProgressProperty =&lt;span style=""&gt;  &lt;/span&gt;&lt;span style="color: rgb(43, 145, 175);"&gt;DependencyProperty&lt;/span&gt;.Register(&lt;span style="color: rgb(163, 21, 21);"&gt;"Progress"&lt;/span&gt;, &lt;span style="color:blue;"&gt;typeof&lt;/span&gt;(&lt;span style="color:blue;"&gt;int&lt;/span&gt;), &lt;span style="color:blue;"&gt;typeof&lt;/span&gt;(&lt;span style="color: rgb(43, 145, 175);"&gt;SpinAnimationControl&lt;/span&gt;), &lt;span style="color:blue;"&gt;new&lt;/span&gt;   &lt;span style="color: rgb(43, 145, 175);"&gt;PropertyMetadata&lt;/span&gt;(0, OnProgressChanged));&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 17.5pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;Override OnApplyTemplate method for getting template child which has animation storyboard in resource section of root element. You can get template child using GetTemplateChild method. Grid is the root element in control template.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="margin-left: 5.4pt; border-collapse: collapse; border: medium none; width: 655px; height: 137px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 81.75pt;"&gt;   &lt;td style="width: 463.5pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 81.75pt;" valign="top" width="618"&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.25pt; line-height: normal;"&gt;&lt;span style="color: rgb(43, 145, 175);font-size:100%;" &gt;Grid&lt;/span&gt;&lt;span style="font-size:100%;"&gt; spinGrid = &lt;span style="color:blue;"&gt;null&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.25pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;override&lt;/span&gt; &lt;span style="color:blue;"&gt;void&lt;/span&gt; OnApplyTemplate()&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.25pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.25pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;    &lt;/span&gt;&lt;span style="color:blue;"&gt;base&lt;/span&gt;.OnApplyTemplate();&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.25pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;    &lt;/span&gt;spinGrid = GetTemplateChild(&lt;span style="color: rgb(163, 21, 21);"&gt;"SpinGrid"&lt;/span&gt;) &lt;span style="color:blue;"&gt;as&lt;/span&gt;   &lt;span style="color: rgb(43, 145, 175);"&gt;Grid&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 3.25pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;}&lt;span style="color: rgb(43, 145, 175);"&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:85%;" &gt;&lt;span style="color: rgb(0, 0, 0); font-weight: bold;"&gt;Property value changed callback.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="margin-left: 5.4pt; border-collapse: collapse; border: medium none; width: 655px; height: 855px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 571pt;"&gt;   &lt;td style="width: 459pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 571pt;" valign="top" width="612"&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;private&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;bool&lt;/span&gt;   isAnimationStarted = &lt;span style="color:blue;"&gt;false&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;private&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;static&lt;/span&gt; &lt;span style="color:blue;"&gt;void&lt;/span&gt; OnProgressChanged(&lt;span style="color:blue;"&gt;object&lt;/span&gt;   sender, &lt;span style="color: rgb(43, 145, 175);"&gt;DependencyPropertyChangedEventArgs&lt;/span&gt;   args)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;  &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt;   (sender &lt;span style="color:blue;"&gt;is&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;SpinAnimationControl&lt;/span&gt;)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;(sender &lt;span style="color:blue;"&gt;as&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;SpinAnimationControl&lt;/span&gt;).OnProgressChanged(args);&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt; &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;void&lt;/span&gt;   OnProgressChanged(&lt;span style="color: rgb(43, 145, 175);"&gt;DependencyPropertyChangedEventArgs&lt;/span&gt;   args)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt; &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;&lt;span style="color:blue;"&gt;int&lt;/span&gt;   newValue = (&lt;span style="color:blue;"&gt;int&lt;/span&gt;)args.NewValue;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;          &lt;/span&gt;&lt;span style="color: rgb(43, 145, 175);"&gt;Storyboard&lt;/span&gt;   storyBoard = &lt;span style="color:blue;"&gt;null&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt;   (spinGrid != &lt;span style="color:blue;"&gt;null&lt;/span&gt;)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;// Storyboard from grid   resource.&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;storyBoard =   spinGrid.Resources[&lt;span style="color: rgb(163, 21, 21);"&gt;"RetrievalCircleAnimation"&lt;/span&gt;]   &lt;span style="color:blue;"&gt;as&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;Storyboard&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt;   (newValue &amp;lt; 100)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;&lt;span style="color:blue;"&gt;this&lt;/span&gt;.Visibility   = &lt;span style="color: rgb(43, 145, 175);"&gt;Visibility&lt;/span&gt;.Visible;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt;   (!isAnimationStarted)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                   &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt;   (storyBoard != &lt;span style="color:blue;"&gt;null&lt;/span&gt;)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                   &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;// Start the animation&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                       &lt;/span&gt;storyBoard.Begin();&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                       &lt;/span&gt;isAnimationStarted = &lt;span style="color:blue;"&gt;true&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                   &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 3.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;&lt;span style="color:blue;"&gt;else&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                                         &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;&lt;span style="color:blue;"&gt;this&lt;/span&gt;.Visibility   = &lt;span style="color: rgb(43, 145, 175);"&gt;Visibility&lt;/span&gt;.Collapsed;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt;   (isAnimationStarted)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                   &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt;   (storyBoard != &lt;span style="color:blue;"&gt;null&lt;/span&gt;)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                   &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;// Stop the animation.&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                       &lt;/span&gt;storyBoard.Stop();&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                       &lt;/span&gt;isAnimationStarted = &lt;span style="color:blue;"&gt;false&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                   &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;               &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;           &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;       &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style=""&gt;            &lt;/span&gt;&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-weight: bold;"&gt;SpinAnimation control template – generic.xaml&lt;/span&gt;&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;Here is the template of SpinAnimation control. I put some ellipses with storyboard for animating download progress indicator. Please refer the generic.xaml for complete template code.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="margin-left: 5.4pt; border-collapse: collapse; border: medium none; width: 662px; height: 666px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 363.25pt;"&gt;   &lt;td style="width: 473.4pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 363.25pt;" valign="top" width="631"&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;ControlTemplate&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; TargetType&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="local:SpinAnimationControl"&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Grid&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; x&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;:&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt;Name&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="SpinGrid"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Height&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="{&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;TemplateBinding&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Height&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;}"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; VerticalAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Center"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; HorizontalAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Center"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Width&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="{&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;TemplateBinding&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Width&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;}"&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 4.55pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;Grid.Resources&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;
&lt;br /&gt;&lt;span style="color:blue;"&gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);"&gt;Storyboard&lt;/span&gt;&lt;span style="color:red;"&gt; x&lt;/span&gt;&lt;span style="color:blue;"&gt;:&lt;/span&gt;&lt;span style="color:red;"&gt;Name&lt;/span&gt;&lt;span style="color:blue;"&gt;="RetrievalCircleAnimation"&lt;/span&gt;&lt;span style="color:red;"&gt; RepeatBehavior&lt;/span&gt;&lt;span style="color:blue;"&gt;="Forever"&lt;/span&gt;&lt;span style="color:red;"&gt; SpeedRatio&lt;/span&gt;&lt;span style="color:blue;"&gt;="4"&amp;gt;
&lt;br /&gt;&amp;lt;!-- Animation for ellipse --&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 4.55pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;DoubleAnimationUsingKeyFrames&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; BeginTime&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="00:00:00"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt;   Storyboard.TargetName&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="ellipse"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; Storyboard.TargetProperty&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"&amp;gt;
&lt;br /&gt;&amp;lt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;EasingDoubleKeyFrame&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; KeyTime&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="00:00:00"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; Value&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="1"/&amp;gt;
&lt;br /&gt;&amp;lt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;EasingDoubleKeyFrame&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; KeyTime&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="00:00:01.5000000"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; Value&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="0.5"/&amp;gt;
&lt;br /&gt;&amp;lt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;EasingDoubleKeyFrame&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; KeyTime&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="00:00:03.5000000"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; Value&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="0.5"/&amp;gt;
&lt;br /&gt;&amp;lt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;EasingDoubleKeyFrame&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; KeyTime&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="00:00:04"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; Value&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="1"/&amp;gt;
&lt;br /&gt;&amp;lt;/&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;DoubleAnimationUsingKeyFrames&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;
&lt;br /&gt;&amp;lt;/&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;Storyboard&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;
&lt;br /&gt;&amp;lt;!- More codes --&amp;gt;
&lt;br /&gt;&amp;lt;/&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;Grid.Resources&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Ellipse&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; x&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;:&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt;Name&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="ellipse"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Height&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="12"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Width&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="12"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; HorizontalAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Center"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; VerticalAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Top"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; RenderTransformOrigin&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="0.5,0.5"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Fill&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="{&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;StaticResource&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; ballbrush&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;}"&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Ellipse.RenderTransform&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;TransformGroup&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;ScaleTransform&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; ScaleX&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="0.5"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; ScaleY&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="0.5"/&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;SkewTransform&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;/&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;RotateTransform&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;/&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;TranslateTransform&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;/&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;TransformGroup&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Ellipse.RenderTransform&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 4.55pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;Ellipse&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 4.55pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;!- More codes --&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 4.55pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Grid&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 4.55pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;ControlTemplate&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="font-size:85%;"&gt;&lt;b style=""&gt;&lt;span style="line-height: 115%;"&gt;SpinAnimation Control Snap.&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;&lt;p  style="text-align: center;font-family:verdana;" class="MsoNormal"&gt;&lt;span style="font-size:100%;"&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiee5_KKIdlbJBF0fwH_CvmT89olvK8mdUAQRqQQYs4dPhrUhLmJD-Aka6fiT2ZGoqSNmbMCyTodwrsoA-uxMTEFUADOiB6VrX86rm2-ibG113p0oe9EO16Cc_51HYcHmAfc2Qayerpcacm/s1600/SpinAnimationControl.PNG"&gt;&lt;img style="cursor: pointer; width: 320px; height: 74px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiee5_KKIdlbJBF0fwH_CvmT89olvK8mdUAQRqQQYs4dPhrUhLmJD-Aka6fiT2ZGoqSNmbMCyTodwrsoA-uxMTEFUADOiB6VrX86rm2-ibG113p0oe9EO16Cc_51HYcHmAfc2Qayerpcacm/s320/SpinAnimationControl.PNG" alt="" id="BLOGGER_PHOTO_ID_5501540271948862866" border="0" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;span style="font-size:100%;"&gt;&lt;b  style="color: rgb(0, 0, 0);font-family:verdana;"&gt;&lt;span style="line-height: 115%;"&gt;
&lt;br /&gt;Creating ViewModel and View to present the Image with download indicator.
&lt;br /&gt;
&lt;br /&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="font-size:85%;"&gt;If you are a SL &lt;/span&gt;&lt;span style=";font-size:85%;" &gt; &lt;/span&gt;&lt;span style="font-size:85%;"&gt;or WPF developer, I believe that you prefer MVVM approach only, nevertheless I always prefer MVVM since it is the only &lt;/span&gt;&lt;span style=";font-size:85%;" &gt; &lt;/span&gt;&lt;span style="font-size:85%;"&gt;powerful pattern for SL or WPF apps till now. So that is the reason I decided that implementing &lt;/span&gt;&lt;span style=";font-size:85%;" &gt; &lt;/span&gt;&lt;span style="font-size:85%;"&gt;image Uri and Progress notification from View Model.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="font-size:85%;"&gt;&lt;span style="font-weight: bold;"&gt;ImageAppViewModel class&lt;/span&gt;&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;ImageAppViewModel class has property called ImageList with the type of ObservableCollection. This is the property that we are going to bind as an ItemsSource of Listbox control in View. &lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="margin-left: -1.5pt; border-collapse: collapse; border: medium none; width: 667px; height: 455px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 166.2pt;"&gt;   &lt;td style="width: 479.4pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 166.2pt;" valign="top" width="639"&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; ImageAppViewModel()&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt; &lt;meta equiv="Content-Type" content="text/html; charset=utf-8"&gt;&lt;meta name="ProgId" content="Word.Document"&gt;&lt;meta name="Generator" content="Microsoft Word 12"&gt;&lt;meta name="Originator" content="Microsoft Word 12"&gt;&lt;link rel="File-List" href="file:///C:%5CUsers%5CVMARIM%7E1%5CAppData%5CLocal%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_filelist.xml"&gt;&lt;!--[if gte mso 9]&gt;&lt;xml&gt;  &lt;o:officedocumentsettings&gt;   &lt;o:relyonvml/&gt;   &lt;o:allowpng/&gt;  &lt;/o:OfficeDocumentSettings&gt; &lt;/xml&gt;&lt;![endif]--&gt;&lt;link rel="themeData" href="file:///C:%5CUsers%5CVMARIM%7E1%5CAppData%5CLocal%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_themedata.thmx"&gt;&lt;link rel="colorSchemeMapping" href="file:///C:%5CUsers%5CVMARIM%7E1%5CAppData%5CLocal%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_colorschememapping.xml"&gt;&lt;!--[if gte mso 9]&gt;&lt;xml&gt;  &lt;w:worddocument&gt;   &lt;w:view&gt;Normal&lt;/w:View&gt;   &lt;w:zoom&gt;0&lt;/w:Zoom&gt;   &lt;w:trackmoves/&gt;   &lt;w:trackformatting/&gt;   &lt;w:punctuationkerning/&gt;   &lt;w:validateagainstschemas/&gt;   &lt;w:saveifxmlinvalid&gt;false&lt;/w:SaveIfXMLInvalid&gt;   &lt;w:ignoremixedcontent&gt;false&lt;/w:IgnoreMixedContent&gt;   &lt;w:alwaysshowplaceholdertext&gt;false&lt;/w:AlwaysShowPlaceholderText&gt;   &lt;w:donotpromoteqf/&gt;   &lt;w:lidthemeother&gt;EN-US&lt;/w:LidThemeOther&gt;   &lt;w:lidthemeasian&gt;X-NONE&lt;/w:LidThemeAsian&gt;   &lt;w:lidthemecomplexscript&gt;X-NONE&lt;/w:LidThemeComplexScript&gt;   &lt;w:compatibility&gt;    &lt;w:breakwrappedtables/&gt;    &lt;w:snaptogridincell/&gt;    &lt;w:wraptextwithpunct/&gt;    &lt;w:useasianbreakrules/&gt;    &lt;w:dontgrowautofit/&gt;    &lt;w:splitpgbreakandparamark/&gt;    &lt;w:dontvertaligncellwithsp/&gt;    &lt;w:dontbreakconstrainedforcedtables/&gt;    &lt;w:dontvertalignintxbx/&gt;    &lt;w:word11kerningpairs/&gt;    &lt;w:cachedcolbalance/&gt;   &lt;/w:Compatibility&gt;   &lt;m:mathpr&gt;    &lt;m:mathfont val="Cambria Math"&gt;    &lt;m:brkbin val="before"&gt;    &lt;m:brkbinsub val="&amp;#45;-"&gt;    &lt;m:smallfrac val="off"&gt;    &lt;m:dispdef/&gt;    &lt;m:lmargin val="0"&gt;    &lt;m:rmargin val="0"&gt;    &lt;m:defjc val="centerGroup"&gt;    &lt;m:wrapindent val="1440"&gt;    &lt;m:intlim val="subSup"&gt;    &lt;m:narylim val="undOvr"&gt;   &lt;/m:mathPr&gt;&lt;/w:WordDocument&gt; &lt;/xml&gt;&lt;![endif]--&gt;&lt;!--[if gte mso 9]&gt;&lt;xml&gt;  &lt;w:latentstyles deflockedstate="false" defunhidewhenused="true" defsemihidden="true" defqformat="false" defpriority="99" latentstylecount="267"&gt;   &lt;w:lsdexception locked="false" priority="0" semihidden="false" unhidewhenused="false" qformat="true" name="Normal"&gt;   &lt;w:lsdexception locked="false" priority="9" semihidden="false" unhidewhenused="false" qformat="true" name="heading 1"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 2"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 3"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 4"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 5"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 6"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 7"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 8"&gt;   &lt;w:lsdexception locked="false" priority="9" qformat="true" name="heading 9"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 1"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 2"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 3"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 4"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 5"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 6"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 7"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 8"&gt;   &lt;w:lsdexception locked="false" priority="39" name="toc 9"&gt;   &lt;w:lsdexception locked="false" priority="35" qformat="true" name="caption"&gt;   &lt;w:lsdexception locked="false" priority="10" semihidden="false" unhidewhenused="false" qformat="true" name="Title"&gt;   &lt;w:lsdexception locked="false" priority="1" name="Default Paragraph Font"&gt;   &lt;w:lsdexception locked="false" priority="11" semihidden="false" unhidewhenused="false" qformat="true" name="Subtitle"&gt;   &lt;w:lsdexception locked="false" priority="22" semihidden="false" unhidewhenused="false" qformat="true" name="Strong"&gt;   &lt;w:lsdexception locked="false" priority="20" semihidden="false" unhidewhenused="false" qformat="true" name="Emphasis"&gt;   &lt;w:lsdexception locked="false" priority="59" semihidden="false" unhidewhenused="false" name="Table Grid"&gt;   &lt;w:lsdexception locked="false" unhidewhenused="false" name="Placeholder Text"&gt;   &lt;w:lsdexception locked="false" priority="1" semihidden="false" unhidewhenused="false" qformat="true" name="No Spacing"&gt;   &lt;w:lsdexception locked="false" priority="60" semihidden="false" unhidewhenused="false" name="Light Shading"&gt;   &lt;w:lsdexception locked="false" priority="61" semihidden="false" unhidewhenused="false" name="Light List"&gt;   &lt;w:lsdexception locked="false" priority="62" semihidden="false" unhidewhenused="false" name="Light Grid"&gt;   &lt;w:lsdexception locked="false" priority="63" semihidden="false" unhidewhenused="false" name="Medium Shading 1"&gt;   &lt;w:lsdexception locked="false" priority="64" semihidden="false" unhidewhenused="false" name="Medium Shading 2"&gt;   &lt;w:lsdexception locked="false" priority="65" semihidden="false" unhidewhenused="false" name="Medium List 1"&gt;   &lt;w:lsdexception locked="false" priority="66" semihidden="false" unhidewhenused="false" name="Medium List 2"&gt;   &lt;w:lsdexception locked="false" priority="67" semihidden="false" unhidewhenused="false" name="Medium Grid 1"&gt;   &lt;w:lsdexception locked="false" priority="68" semihidden="false" unhidewhenused="false" name="Medium Grid 2"&gt;   &lt;w:lsdexception locked="false" priority="69" semihidden="false" unhidewhenused="false" name="Medium Grid 3"&gt;   &lt;w:lsdexception locked="false" priority="70" semihidden="false" unhidewhenused="false" name="Dark List"&gt;   &lt;w:lsdexception locked="false" priority="71" semihidden="false" unhidewhenused="false" name="Colorful Shading"&gt;   &lt;w:lsdexception locked="false" priority="72" semihidden="false" unhidewhenused="false" name="Colorful List"&gt;   &lt;w:lsdexception locked="false" priority="73" semihidden="false" unhidewhenused="false" name="Colorful Grid"&gt;   &lt;w:lsdexception locked="false" priority="60" semihidden="false" unhidewhenused="false" name="Light Shading Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="61" semihidden="false" unhidewhenused="false" name="Light List Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="62" semihidden="false" unhidewhenused="false" name="Light Grid Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="63" semihidden="false" unhidewhenused="false" name="Medium Shading 1 Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="64" semihidden="false" unhidewhenused="false" name="Medium Shading 2 Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="65" semihidden="false" unhidewhenused="false" name="Medium List 1 Accent 1"&gt;   &lt;w:lsdexception locked="false" unhidewhenused="false" name="Revision"&gt;   &lt;w:lsdexception locked="false" priority="34" semihidden="false" unhidewhenused="false" qformat="true" name="List Paragraph"&gt;   &lt;w:lsdexception locked="false" priority="29" semihidden="false" unhidewhenused="false" qformat="true" name="Quote"&gt;   &lt;w:lsdexception locked="false" priority="30" semihidden="false" unhidewhenused="false" qformat="true" name="Intense Quote"&gt;   &lt;w:lsdexception locked="false" priority="66" semihidden="false" unhidewhenused="false" name="Medium List 2 Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="67" semihidden="false" unhidewhenused="false" name="Medium Grid 1 Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="68" semihidden="false" unhidewhenused="false" name="Medium Grid 2 Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="69" semihidden="false" unhidewhenused="false" name="Medium Grid 3 Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="70" semihidden="false" unhidewhenused="false" name="Dark List Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="71" semihidden="false" unhidewhenused="false" name="Colorful Shading Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="72" semihidden="false" unhidewhenused="false" name="Colorful List Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="73" semihidden="false" unhidewhenused="false" name="Colorful Grid Accent 1"&gt;   &lt;w:lsdexception locked="false" priority="60" semihidden="false" unhidewhenused="false" name="Light Shading Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="61" semihidden="false" unhidewhenused="false" name="Light List Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="62" semihidden="false" unhidewhenused="false" name="Light Grid Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="63" semihidden="false" unhidewhenused="false" name="Medium Shading 1 Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="64" semihidden="false" unhidewhenused="false" name="Medium Shading 2 Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="65" semihidden="false" unhidewhenused="false" name="Medium List 1 Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="66" semihidden="false" unhidewhenused="false" name="Medium List 2 Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="67" semihidden="false" unhidewhenused="false" name="Medium Grid 1 Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="68" semihidden="false" unhidewhenused="false" name="Medium Grid 2 Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="69" semihidden="false" unhidewhenused="false" name="Medium Grid 3 Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="70" semihidden="false" unhidewhenused="false" name="Dark List Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="71" semihidden="false" unhidewhenused="false" name="Colorful Shading Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="72" semihidden="false" unhidewhenused="false" name="Colorful List Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="73" semihidden="false" unhidewhenused="false" name="Colorful Grid Accent 2"&gt;   &lt;w:lsdexception locked="false" priority="60" semihidden="false" unhidewhenused="false" name="Light Shading Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="61" semihidden="false" unhidewhenused="false" name="Light List Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="62" semihidden="false" unhidewhenused="false" name="Light Grid Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="63" semihidden="false" unhidewhenused="false" name="Medium Shading 1 Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="64" semihidden="false" unhidewhenused="false" name="Medium Shading 2 Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="65" semihidden="false" unhidewhenused="false" name="Medium List 1 Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="66" semihidden="false" unhidewhenused="false" name="Medium List 2 Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="67" semihidden="false" unhidewhenused="false" name="Medium Grid 1 Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="68" semihidden="false" unhidewhenused="false" name="Medium Grid 2 Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="69" semihidden="false" unhidewhenused="false" name="Medium Grid 3 Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="70" semihidden="false" unhidewhenused="false" name="Dark List Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="71" semihidden="false" unhidewhenused="false" name="Colorful Shading Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="72" semihidden="false" unhidewhenused="false" name="Colorful List Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="73" semihidden="false" unhidewhenused="false" name="Colorful Grid Accent 3"&gt;   &lt;w:lsdexception locked="false" priority="60" semihidden="false" unhidewhenused="false" name="Light Shading Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="61" semihidden="false" unhidewhenused="false" name="Light List Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="62" semihidden="false" unhidewhenused="false" name="Light Grid Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="63" semihidden="false" unhidewhenused="false" name="Medium Shading 1 Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="64" semihidden="false" unhidewhenused="false" name="Medium Shading 2 Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="65" semihidden="false" unhidewhenused="false" name="Medium List 1 Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="66" semihidden="false" unhidewhenused="false" name="Medium List 2 Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="67" semihidden="false" unhidewhenused="false" name="Medium Grid 1 Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="68" semihidden="false" unhidewhenused="false" name="Medium Grid 2 Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="69" semihidden="false" unhidewhenused="false" name="Medium Grid 3 Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="70" semihidden="false" unhidewhenused="false" name="Dark List Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="71" semihidden="false" unhidewhenused="false" name="Colorful Shading Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="72" semihidden="false" unhidewhenused="false" name="Colorful List Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="73" semihidden="false" unhidewhenused="false" name="Colorful Grid Accent 4"&gt;   &lt;w:lsdexception locked="false" priority="60" semihidden="false" unhidewhenused="false" name="Light Shading Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="61" semihidden="false" unhidewhenused="false" name="Light List Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="62" semihidden="false" unhidewhenused="false" name="Light Grid Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="63" semihidden="false" unhidewhenused="false" name="Medium Shading 1 Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="64" semihidden="false" unhidewhenused="false" name="Medium Shading 2 Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="65" semihidden="false" unhidewhenused="false" name="Medium List 1 Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="66" semihidden="false" unhidewhenused="false" name="Medium List 2 Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="67" semihidden="false" unhidewhenused="false" name="Medium Grid 1 Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="68" semihidden="false" unhidewhenused="false" name="Medium Grid 2 Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="69" semihidden="false" unhidewhenused="false" name="Medium Grid 3 Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="70" semihidden="false" unhidewhenused="false" name="Dark List Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="71" semihidden="false" unhidewhenused="false" name="Colorful Shading Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="72" semihidden="false" unhidewhenused="false" name="Colorful List Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="73" semihidden="false" unhidewhenused="false" name="Colorful Grid Accent 5"&gt;   &lt;w:lsdexception locked="false" priority="60" semihidden="false" unhidewhenused="false" name="Light Shading Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="61" semihidden="false" unhidewhenused="false" name="Light List Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="62" semihidden="false" unhidewhenused="false" name="Light Grid Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="63" semihidden="false" unhidewhenused="false" name="Medium Shading 1 Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="64" semihidden="false" unhidewhenused="false" name="Medium Shading 2 Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="65" semihidden="false" unhidewhenused="false" name="Medium List 1 Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="66" semihidden="false" unhidewhenused="false" name="Medium List 2 Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="67" semihidden="false" unhidewhenused="false" name="Medium Grid 1 Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="68" semihidden="false" unhidewhenused="false" name="Medium Grid 2 Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="69" semihidden="false" unhidewhenused="false" name="Medium Grid 3 Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="70" semihidden="false" unhidewhenused="false" name="Dark List Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="71" semihidden="false" unhidewhenused="false" name="Colorful Shading Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="72" semihidden="false" unhidewhenused="false" name="Colorful List Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="73" semihidden="false" unhidewhenused="false" name="Colorful Grid Accent 6"&gt;   &lt;w:lsdexception locked="false" priority="19" semihidden="false" unhidewhenused="false" qformat="true" name="Subtle Emphasis"&gt;   &lt;w:lsdexception locked="false" priority="21" semihidden="false" unhidewhenused="false" qformat="true" name="Intense Emphasis"&gt;   &lt;w:lsdexception locked="false" priority="31" semihidden="false" unhidewhenused="false" qformat="true" name="Subtle Reference"&gt;   &lt;w:lsdexception locked="false" priority="32" semihidden="false" unhidewhenused="false" qformat="true" name="Intense Reference"&gt;   &lt;w:lsdexception locked="false" priority="33" semihidden="false" unhidewhenused="false" qformat="true" name="Book Title"&gt;   &lt;w:lsdexception locked="false" priority="37" name="Bibliography"&gt;   &lt;w:lsdexception locked="false" priority="39" qformat="true" name="TOC Heading"&gt;  &lt;/w:LatentStyles&gt; &lt;/xml&gt;&lt;![endif]--&gt;&lt;style&gt; &lt;!--  /* Font Definitions */  @font-face 	{font-family:"Cambria Math"; 	panose-1:2 4 5 3 5 4 6 3 2 4; 	mso-font-charset:0; 	mso-generic-font-family:roman; 	mso-font-pitch:variable; 	mso-font-signature:-1610611985 1107304683 0 0 415 0;} @font-face 	{font-family:Calibri; 	panose-1:2 15 5 2 2 2 4 3 2 4; 	mso-font-charset:0; 	mso-generic-font-family:swiss; 	mso-font-pitch:variable; 	mso-font-signature:-520092929 1073786111 9 0 415 0;}  /* Style Definitions */  p.MsoNormal, li.MsoNormal, div.MsoNormal 	{mso-style-unhide:no; 	mso-style-qformat:yes; 	mso-style-parent:""; 	margin-top:0in; 	margin-right:0in; 	margin-bottom:10.0pt; 	margin-left:0in; 	line-height:115%; 	mso-pagination:widow-orphan; 	font-size:11.0pt; 	font-family:"Calibri","sans-serif"; 	mso-ascii-font-family:Calibri; 	mso-ascii-theme-font:minor-latin; 	mso-fareast-font-family:Calibri; 	mso-fareast-theme-font:minor-latin; 	mso-hansi-font-family:Calibri; 	mso-hansi-theme-font:minor-latin; 	mso-bidi-font-family:"Times New Roman"; 	mso-bidi-theme-font:minor-bidi;} .MsoChpDefault 	{mso-style-type:export-only; 	mso-default-props:yes; 	mso-ascii-font-family:Calibri; 	mso-ascii-theme-font:minor-latin; 	mso-fareast-font-family:Calibri; 	mso-fareast-theme-font:minor-latin; 	mso-hansi-font-family:Calibri; 	mso-hansi-theme-font:minor-latin; 	mso-bidi-font-family:"Times New Roman"; 	mso-bidi-theme-font:minor-bidi;} .MsoPapDefault 	{mso-style-type:export-only; 	margin-bottom:10.0pt; 	line-height:115%;} @page WordSection1 	{size:8.5in 11.0in; 	margin:1.0in 1.0in 1.0in 1.0in; 	mso-header-margin:.5in; 	mso-footer-margin:.5in; 	mso-paper-source:0;} div.WordSection1 	{page:WordSection1;} --&gt; &lt;/style&gt;&lt;!--[if gte mso 10]&gt; &lt;style&gt;  /* Style Definitions */  table.MsoNormalTable 	{mso-style-name:"Table Normal"; 	mso-tstyle-rowband-size:0; 	mso-tstyle-colband-size:0; 	mso-style-noshow:yes; 	mso-style-priority:99; 	mso-style-qformat:yes; 	mso-style-parent:""; 	mso-padding-alt:0in 5.4pt 0in 5.4pt; 	mso-para-margin-top:0in; 	mso-para-margin-right:0in; 	mso-para-margin-bottom:10.0pt; 	mso-para-margin-left:0in; 	line-height:115%; 	mso-pagination:widow-orphan; 	font-size:11.0pt; 	font-family:"Calibri","sans-serif"; 	mso-ascii-font-family:Calibri; 	mso-ascii-theme-font:minor-latin; 	mso-fareast-font-family:"Times New Roman"; 	mso-fareast-theme-font:minor-fareast; 	mso-hansi-font-family:Calibri; 	mso-hansi-theme-font:minor-latin; 	mso-bidi-font-family:"Times New Roman"; 	mso-bidi-theme-font:minor-bidi;} &lt;/style&gt; &lt;![endif]--&gt;  &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:10pt;"&gt;ImagesList = &lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ObservableCollection&lt;/span&gt;&lt;&lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;&gt;();&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:10pt;"&gt;&lt;span style=""&gt;&lt;/span&gt;ImagesList.Add(&lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;() { Uri = &lt;span style="color: rgb(163, 21, 21);"&gt;"http://www.pdssb.com.my/images/stories/gallery/car.jpg"&lt;/span&gt; });&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:10pt;"&gt;&lt;span style=""&gt;&lt;/span&gt;ImagesList.Add(&lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;() { Uri = &lt;span style="color: rgb(163, 21, 21);"&gt;"http://joshua.maruskadesign.com/blog/uploaded_images/Car-02-723748.png"&lt;/span&gt; });&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:10pt;"&gt;&lt;span style=""&gt;&lt;/span&gt;ImagesList.Add(&lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;() { Uri = &lt;span style="color: rgb(163, 21, 21);"&gt;"http://www.carbodydesign.com/archive/2009/02/13-automotive-designers-show-program/Autodesk-Concept-Car-rendering-lg.jpg"&lt;/span&gt; });&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:10pt;"&gt;&lt;span style=""&gt;&lt;/span&gt;ImagesList.Add(&lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;() { Uri = &lt;span style="color: rgb(163, 21, 21);"&gt;"http://www2.hiren.info/desktopwallpapers/other/car-silver-87c.jpg"&lt;/span&gt; });&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style="font-size:10pt;"&gt;&lt;span style=""&gt;&lt;/span&gt;ImagesList.Add(&lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;() { Uri = &lt;span style="color: rgb(163, 21, 21);"&gt;"http://brianhansford.com/wp-content/uploads/2010/02/red-sports-car.jpg"&lt;/span&gt; });&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;}&lt;span style="color:blue;"&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;private&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ObservableCollection&lt;/span&gt;&amp;lt;&lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;&amp;gt; m_ImagesList;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ObservableCollection&lt;/span&gt;&amp;lt;&lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt;&amp;gt; ImagesList&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;get&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;return&lt;/span&gt;&lt;span style="font-size:100%;"&gt; m_ImagesList;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;set&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;m_ImagesList = &lt;span style="color:blue;"&gt;value&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;OnPropertyChanged(&lt;span style="color: rgb(163, 21, 21);"&gt;"ImagesList"&lt;/span&gt;);&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 6.9pt; text-indent: 0.5in; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 6.9pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;}&lt;span style="color:blue;"&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="font-size:100%;"&gt;&lt;b style=""&gt;&lt;span style="line-height: 115%;"&gt;&lt;span style="font-size:85%;"&gt;ImageExt class&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;ImageExt class has property called Uri, ImageSource(Type of&lt;/span&gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;  &lt;/span&gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;BitmapImage) and Progress property. Why two property for image source in view model?. Typically we will send Image uri as a string type. See the below &lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;Uri="http://www.pdssb.com.my/images/stories/gallery/car.jpg"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt; &lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;But we need to construct the BitmapImage object using this uri and register the DownloadProgress event in property &lt;/span&gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt; &lt;/span&gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;getter. In Download progress event handler, update the Progress property of ImageExt class which we are using for indicating how much percentage of bytes has been downloaded for particular image. Now bind only ImageSource property in ItemTemplate of ListBox in View. &lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="width: 660px; margin-left: 6.15pt; border-collapse: collapse; border: medium none; height: 787px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 239pt;"&gt;   &lt;td style="width: 478.7pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 239pt;" valign="top" width="638"&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;class&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;ImageExt&lt;/span&gt; : &lt;span style="color: rgb(43, 145, 175);"&gt;INotifyPropertyChanged&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;    &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;private&lt;/span&gt; &lt;span style="color:blue;"&gt;int&lt;/span&gt;   m_Progress;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt; &lt;span style="color:blue;"&gt;int&lt;/span&gt; Progress&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;&lt;span style="color:blue;"&gt;get&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;&lt;span style="color:blue;"&gt;return&lt;/span&gt; m_Progress;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;&lt;span style="color:blue;"&gt;set&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;m_Progress = &lt;span style="color:blue;"&gt;value&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;OnPropertyChanged(&lt;span style="color: rgb(163, 21, 21);"&gt;"Progress"&lt;/span&gt;);&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;private&lt;/span&gt; &lt;span style="color:blue;"&gt;string&lt;/span&gt;   m_Uri;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt; &lt;span style="color:blue;"&gt;string&lt;/span&gt; Uri&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;&lt;span style="color:blue;"&gt;get&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;&lt;span style="color:blue;"&gt;return&lt;/span&gt; m_Uri;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;&lt;span style="color:blue;"&gt;set&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;m_Uri = &lt;span style="color:blue;"&gt;value&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;OnPropertyChanged(&lt;span style="color: rgb(163, 21, 21);"&gt;"Uri"&lt;/span&gt;);&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color: rgb(43, 145, 175);"&gt;BitmapImage&lt;/span&gt; image = &lt;span style="color:blue;"&gt;null&lt;/span&gt;;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;BitmapImage&lt;/span&gt;   ImageSource&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;&lt;span style="color:blue;"&gt;get&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;image = &lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;BitmapImage&lt;/span&gt;(&lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;Uri&lt;/span&gt;(Uri, &lt;span style="color: rgb(43, 145, 175);"&gt;UriKind&lt;/span&gt;.Absolute));&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;image.DownloadProgress += &lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;EventHandler&lt;/span&gt;&amp;lt;&lt;span style="color: rgb(43, 145, 175);"&gt;DownloadProgressEventArgs&lt;/span&gt;&amp;gt;(image_DownloadProgress);&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;&lt;span style="color:blue;"&gt;return&lt;/span&gt; image;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style=""&gt;        &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="font-size:85%;"&gt;&lt;b style=""&gt;&lt;span style="line-height: 115%;"&gt;&lt;span style="color: rgb(0, 0, 0);"&gt;DownloadProgress Event Handler&lt;/span&gt;&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="width: 666px; margin-left: 3.1pt; border-collapse: collapse; border: medium none; height: 225px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 75.85pt;"&gt;   &lt;td style="width: 483.8pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 75.85pt;" valign="top" width="645"&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;// Updating Progress property value   based on DownloadProgressEventArgs value and un registering the event once   its // gets downloaded.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;void&lt;/span&gt;&lt;span style="font-size:100%;"&gt; image_DownloadProgress(&lt;span style="color:blue;"&gt;object&lt;/span&gt;   sender, &lt;span style="color: rgb(43, 145, 175);"&gt;DownloadProgressEventArgs&lt;/span&gt; e)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;Progress = e.Progress;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt; (e.Progress == 100)&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;                  &lt;/span&gt;image.DownloadProgress -= &lt;span style="color:blue;"&gt;new&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;EventHandler&lt;/span&gt;&amp;lt;&lt;span style="color: rgb(43, 145, 175);"&gt;DownloadProgressEventArgs&lt;/span&gt;&amp;gt;(image_DownloadProgress);&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style=""&gt;        &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="font-size:85%;"&gt;&lt;b style=""&gt;&lt;span style="line-height: 115%;"&gt;ImageAppView and ImageAppView.xaml&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;Now, create the ImageAppView.xaml and put the simple list box control with ViewModel property binding. See the below code snippet, ListBox ItemsSource property bound with ImageList property which we declared in ViewModel.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="margin-left: 5.4pt; border-collapse: collapse; border: medium none; width: 666px; height: 87px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 55.9pt;"&gt;   &lt;td style="width: 465.7pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 55.9pt;" valign="top" width="621"&gt;   &lt;p class="MsoNormal" style="margin-left: 3.85pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;ListBox&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; ItemsSource&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="{&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;Binding&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; ImageList&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;}"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; Height&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="110"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; BorderBrush&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="Blue"&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:red;"  &gt; BorderThickness&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;="2"&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 3.85pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;ListBox&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;Set the ItemsPanelTemplate with StackPanel to display images in horizontal view.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoTableGrid"  style="margin-left: 5.4pt; border-collapse: collapse; border: medium none; width: 667px; height: 98px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style=""&gt;   &lt;td style="width: 473.4pt; border: 1pt solid black; padding: 0in 5.4pt;" valign="top" width="631"&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;ListBox.ItemsPanel&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;&lt;span style=""&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;ItemsPanelTemplate&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;&lt;span style=""&gt;         &lt;/span&gt;&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;StackPanel&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Orientation&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Horizontal"&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;StackPanel&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;&lt;span style=""&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;ItemsPanelTemplate&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;ListBox.ItemsPanel&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;span style="color: rgb(0, 0, 0);font-size:85%;" &gt;Set the ItemTemplate to host our SpinAnimation and Image control to display the actual image once gets downloaded. And also I put some textboxes to show the download percentage details as well. &lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="width: 666px; margin-left: 5.4pt; border-collapse: collapse; border: medium none; height: 453px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 211.4pt;"&gt;   &lt;td style="width: 477pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 211.4pt;" valign="top" width="636"&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;ListBox.ItemTemplate&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;DataTemplate&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Grid&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="color: rgb(0, 176, 80);font-size:100%;" &gt;&amp;lt;Image   Name="icon" Width="100" Height="100" Source   ="{Binding ImageSource}" Stretch="Uniform"&lt;span style=""&gt;  &lt;/span&gt;VerticalAlignment="Center"   HorizontalAlignment="Center" /&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;StackPanel&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Orientation&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Horizontal"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; VerticalAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Center"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; HorizontalAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Center"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Visibility&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="{&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Binding&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:red;"&gt;&lt;span style=""&gt; &lt;/span&gt;Path&lt;/span&gt;&lt;span style="color:blue;"&gt;=Visibility,&lt;/span&gt;&lt;span style="color:red;"&gt; ElementName&lt;/span&gt;&lt;span style="color:blue;"&gt;=spinAnimationControl}"&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;TextBlock&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; FontFamily&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Cambria"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; FontSize&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="10"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Text&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="{&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Binding&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Progress&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;}"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; FontWeight&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Bold"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Foreground&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Black"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; TextAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Center"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; TextWrapping&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Wrap"&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:red;"&gt;&lt;span style=""&gt; &lt;/span&gt;LineStackingStrategy&lt;/span&gt;&lt;span style="color:blue;"&gt;="BlockLineHeight"&lt;/span&gt;&lt;span style="color:red;"&gt; LineHeight&lt;/span&gt;&lt;span style="color:blue;"&gt;="9"&lt;/span&gt; &lt;span style="color:red;"&gt;&lt;span style=""&gt; &lt;/span&gt;VerticalAlignment&lt;/span&gt;&lt;span style="color:blue;"&gt;="Center"&lt;/span&gt;&lt;span style="color:red;"&gt;   HorizontalAlignment&lt;/span&gt;&lt;span style="color:blue;"&gt;="Stretch"&lt;/span&gt;&lt;span style="color:red;"&gt; Margin&lt;/span&gt;&lt;span style="color:blue;"&gt;="1"/&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;TextBlock&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Text&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="%"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; FontFamily&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Cambria"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; FontSize&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="10"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; FontWeight&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Bold"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; Foreground&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Black"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; TextAlignment&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Center"&lt;/span&gt;&lt;span style=";font-size:100%;color:red;"  &gt; TextWrapping&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;="Wrap"&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:red;"&gt;&lt;span style=""&gt; &lt;/span&gt;LineStackingStrategy&lt;/span&gt;&lt;span style="color:blue;"&gt;="BlockLineHeight"&lt;/span&gt;&lt;span style="color:red;"&gt; LineHeight&lt;/span&gt;&lt;span style="color:blue;"&gt;="9"&lt;/span&gt; &lt;span style="color:red;"&gt;&lt;span style=""&gt; &lt;/span&gt;VerticalAlignment&lt;/span&gt;&lt;span style="color:blue;"&gt;="Center"&lt;/span&gt;&lt;span style="color:red;"&gt;   HorizontalAlignment&lt;/span&gt;&lt;span style="color:blue;"&gt;="Stretch"&lt;/span&gt;&lt;span style="color:red;"&gt; Margin&lt;/span&gt;&lt;span style="color:blue;"&gt;="1"/&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;StackPanel&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style="color: rgb(23, 54, 93);font-size:100%;" &gt;&amp;lt;control:SpinAnimationControl Name="spinAnimationControl"   Width="50" Height="50"&lt;span style=""&gt;    &lt;/span&gt;VerticalAlignment="Center"   HorizontalAlignment="Stretch" Progress="{Binding   Progress}" Margin="1"/&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;Grid&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-bottom: 0.0001pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="color: rgb(163, 21, 21);font-size:100%;" &gt;DataTemplate&lt;/span&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: -3.05pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;lt;/&lt;/span&gt;&lt;span style="line-height: 115%; color: rgb(163, 21, 21);font-size:100%;" &gt;ListBox.ItemTemplate&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&amp;gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;span style="color: rgb(0, 0, 0); font-weight: bold;"&gt;Finally assign the ViewModel in DataContext of View .&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;table class="MsoNormalTable"  style="margin-left: -2.25pt; border-collapse: collapse; border: medium none; width: 672px; height: 167px;font-family:verdana;" border="1" cellpadding="0" cellspacing="0"&gt;  &lt;tbody&gt;&lt;tr style="height: 98.8pt;"&gt;   &lt;td style="width: 480.25pt; border: 1pt solid windowtext; padding: 0in 5.4pt; height: 98.8pt;" valign="top" width="640"&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 7.65pt; line-height: normal;"&gt;&lt;span style=";font-size:100%;color:blue;"  &gt;public&lt;/span&gt;&lt;span style="font-size:100%;"&gt; &lt;span style="color:blue;"&gt;partial&lt;/span&gt;   &lt;span style="color:blue;"&gt;class&lt;/span&gt; &lt;span style="color: rgb(43, 145, 175);"&gt;MainPage&lt;/span&gt;   : &lt;span style="color: rgb(43, 145, 175);"&gt;UserControl&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 7.65pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;    &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 7.65pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt; MainPage()&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 7.65pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;{&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 7.65pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;              &lt;/span&gt;InitializeComponent();&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 7.65pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;            &lt;/span&gt;&lt;span style="color:blue;"&gt;this&lt;/span&gt;.DataContext = &lt;span style="color:blue;"&gt;new&lt;/span&gt;   &lt;span style="color: rgb(43, 145, 175);"&gt;ImageAppViewModel&lt;/span&gt;();&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin: 0in 0in 0.0001pt 7.65pt; line-height: normal;"&gt;&lt;span style="font-size:100%;"&gt;&lt;span style=""&gt;        &lt;/span&gt;}&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;   &lt;p class="MsoNormal" style="margin-left: 7.65pt;"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style=""&gt;    &lt;/span&gt;}&lt;span style="color:blue;"&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;   &lt;/td&gt;  &lt;/tr&gt; &lt;/tbody&gt;&lt;/table&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;o:p&gt; &lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;span style="font-size:85%;"&gt;Run the demo application and see the output. Here is some snaps.&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0); font-weight: bold;font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;Download initiated&lt;/span&gt;&lt;/p&gt;&lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="font-size:100%;"&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVuZwV_opz61_5-TZaNBOOzbxlHGOuCevytDj6x__OleFxh5yT693OgAnJKWMOxM5SapIXd8AhT8utSiOaIQw1ONOhLWGxU_69XRXb1iMqnc6lkp_MT0D5ARpqWWPfKZ3uFpUbodxBjdMI/s1600/DownloadStarted.PNG"&gt;
&lt;br /&gt;&lt;/a&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsj3aYA-wlL9Eu7LL_0QmUwxafU_IDxPMVI8aQ-YX_JEACiM-bj0KSj87DOUBJX22cS98OFP8Vrgg5Dd20jm8r5PUHWhyphenhyphencqKDvAz-NosaZK9leJXKdtU9-Lq09r1WQmaJImOncahzjoaSe/s1600/DownloadStarted.PNG"&gt;&lt;img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 320px; height: 74px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsj3aYA-wlL9Eu7LL_0QmUwxafU_IDxPMVI8aQ-YX_JEACiM-bj0KSj87DOUBJX22cS98OFP8Vrgg5Dd20jm8r5PUHWhyphenhyphencqKDvAz-NosaZK9leJXKdtU9-Lq09r1WQmaJImOncahzjoaSe/s320/DownloadStarted.PNG" alt="" id="BLOGGER_PHOTO_ID_5501540555954435490" border="0" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;span style="font-size:100%;"&gt;
&lt;br /&gt;&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;v:shape id="Picture_x0020_0" spid="_x0000_i1026" type="#_x0000_t75" alt="DownloadStarted.PNG" style="width: 419.25pt; height: 96.75pt; visibility: visible;"&gt;  &lt;v:imagedata src="file:///C:%5CUsers%5CVMARIM%7E1%5CAppData%5CLocal%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_image002.png" title="DownloadStarted"&gt; &lt;/v:imagedata&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/v:shape&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0); font-weight: bold;font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;Download completed&lt;/span&gt;&lt;/p&gt;&lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="font-size:100%;"&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1ID21k-dMLHZMYtQCcAAOJsDaTVegxM5GYutUQ5O0Oib5cpE6MV98F6hq58nFGAKLANuXLqNv9M1PWB9zq82Q7o0OQAz0ZVjBmb1FvzSSNGyNxRiPFj-oFBk981QNgESQu7Oob5dradmx/s1600/Completed.PNG"&gt;&lt;img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 320px; height: 74px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1ID21k-dMLHZMYtQCcAAOJsDaTVegxM5GYutUQ5O0Oib5cpE6MV98F6hq58nFGAKLANuXLqNv9M1PWB9zq82Q7o0OQAz0ZVjBmb1FvzSSNGyNxRiPFj-oFBk981QNgESQu7Oob5dradmx/s320/Completed.PNG" alt="" id="BLOGGER_PHOTO_ID_5501539168035425250" border="0" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="font-size:100%;"&gt;
&lt;br /&gt;&lt;/span&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p  style="color: rgb(0, 0, 0);font-family:verdana;" class="MsoNormal"&gt;&lt;span style="line-height: 115%;font-size:100%;" &gt;&lt;v:shape id="Picture_x0020_4" spid="_x0000_i1025" type="#_x0000_t75" alt="Completed.PNG" style="width: 418.5pt; height: 96.75pt; visibility: visible;"&gt;  &lt;v:imagedata src="file:///C:%5CUsers%5CVMARIM%7E1%5CAppData%5CLocal%5CTemp%5Cmsohtmlclip1%5C01%5Cclip_image003.png" title="Completed"&gt; &lt;/v:imagedata&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/v:shape&gt;&lt;/span&gt;&lt;/p&gt;  &lt;p class="MsoNormal"  style="font-family:verdana;"&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;span style="color: rgb(0, 0, 0); font-weight: bold;"&gt;Download&lt;/span&gt;&lt;span style="color: rgb(0, 0, 0); font-weight: bold;"&gt;  &lt;/span&gt;&lt;span style="color: rgb(0, 0, 0); font-weight: bold;"&gt;complete source code from&lt;/span&gt;&lt;span style="font-weight: bold;"&gt; &lt;/span&gt;&lt;a style="font-weight: bold;" href="http://cid-b6892ce76c81ff21.office.live.com/self.aspx/ImageApp/ImageApp.zip"&gt;here&lt;/a&gt;&lt;span style="font-weight: bold;"&gt;.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;&lt;p class="MsoNormal" face="verdana"&gt;Enjoy!!!!.&lt;/p&gt;&lt;p class="MsoNormal" style="font-family: verdana;"&gt;
&lt;br /&gt;&lt;span style="line-height: 115%;font-size:100%;color:blue;"  &gt;&lt;span style="font-weight: bold;"&gt;&lt;/span&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;  &lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/08/silverlight-image-download-indicator.html</link><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" height="72" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiee5_KKIdlbJBF0fwH_CvmT89olvK8mdUAQRqQQYs4dPhrUhLmJD-Aka6fiT2ZGoqSNmbMCyTodwrsoA-uxMTEFUADOiB6VrX86rm2-ibG113p0oe9EO16Cc_51HYcHmAfc2Qayerpcacm/s72-c/SpinAnimationControl.PNG" width="72"/><thr:total>1</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-9015540444132676648</guid><pubDate>Wed, 23 Jun 2010 12:03:00 +0000</pubDate><atom:updated>2010-06-23T05:15:43.512-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">ToolTip for Disabled Element in Silverlight</category><title>ToolTip for Disabled Element in Silverlight</title><description>&lt;span style="font-size:85%;"&gt;I noticed that there are many conversations departing in Silverlight forums regarding tool tip support for disabled elements in Silverlight. Silverlight program manager also accepts here that having the ToolTip not show on a disabled element is by design. However some folks suggesting mouse enter and mouse leave, and some evoking style modification, etc... But these approach not applicable when you develop your Silverlight application in MVVM pattern. Here is the simple approach that helps you to set tooltip for disabled item.&lt;br /&gt;&lt;br /&gt;Host a rectangle on top of your element in a grid and bind the visibility property of the Rectangle with IsEnabled property of target element (Make sure that you have BooleanToVisibilityConverter like one in WPF). And bind your business property with tooltip of the rectangle as well as for your target element if you want to display in enabled state also. And also don’t forget to bind Rectangle Width and Height property with ActualWidth and ActualHeight of Button.&lt;br /&gt;&lt;br /&gt;Here is the code.&lt;br /&gt;&lt;br /&gt;&lt;span style="color:#990000;"&gt;&amp;lt;Grid Margin="30,0,20,0”&amp;gt;&lt;br /&gt;&amp;lt;Button x:Name="MyButton" Content="See My ToolTip when I am in Disabled" IsEnabled="{Binding Path=IsEnabled}"/&amp;gt;&lt;br /&gt;&amp;lt;Rectangle x:Name="toolTipForDiabledButton" Visibility="{Binding Path=IsEnabled, ElementName=AddButton, Converter={StaticResource BoolToVisibilityConverter}}" ToolTipService.ToolTip="{Binding Path=MyToolTip, Mode=TwoWay}" Fill="Transparent"&lt;br /&gt;Width="{Binding Path=ActualWidth, ElementName=AddButton}" Height="{Binding Path=ActualHeight, ElementName=AddButton}"&amp;gt;&lt;br /&gt;&amp;lt;/Rectangle&amp;gt;&lt;br /&gt;&amp;lt;/Grid&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;Hope this helps for MVVM folks.&lt;br /&gt;&lt;br /&gt;Enjoy!!!.&lt;/span&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/06/tooltip-for-disabled-element-in.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-1778504750291544715</guid><pubDate>Fri, 14 May 2010 12:39:00 +0000</pubDate><atom:updated>2010-05-14T05:45:48.849-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Threading</category><title>The calling thread cannot access this object because a different thread owns it.</title><description>&lt;span xmlns=""&gt; &lt;p&gt;Hi,&lt;br /&gt;&lt;/p&gt;&lt;p&gt;Today I faced an issue with my custom control which has my own DictionaryList with custom &lt;span style="color:#2b91af;"&gt;CustomKeyValuePair&lt;/span&gt; class as Value of dictionary list. Key is a string type, so nothing problem on it. I used this dictionary list for storing resources to provide different skin support in my control template. Note the point, my &lt;span style="color:#2b91af;"&gt;CustomKeyValuePair&lt;/span&gt; class inherited from DependencyObject. After implementing my control with effective skin mechanism, I tried to host my control in multi threaded WPF application. But unfortunately I got this error message {"The calling thread cannot access this object because a different thread owns it."} since calling thread uses my dictionary list Value(&lt;span style="color:#2b91af;"&gt;CustomKeyValuePair&lt;/span&gt;). As I said, this class inherited from DependencyObject, so WPF won't allow you to access dependency property in multi thread application.&lt;br /&gt;&lt;/p&gt;&lt;p&gt;Initially I tried to solve this issue with value cloning logic. But no use. Finally tried with INotifyPropertyChanged class. Yes, I just removed base class DependencyObject from &lt;span style="color:#2b91af;"&gt;CustomKeyValuePair&lt;/span&gt; class and implemented INotifyPropertyChanged interface with Value property notification when its value getting changed. Now my controls works in multithread WPF application perfectly &lt;span style="font-family:Wingdings;"&gt;J&lt;/span&gt;&lt;br /&gt;&lt;/p&gt;&lt;p&gt;&lt;br /&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt; &lt;span style="color:blue;"&gt;class&lt;/span&gt; &lt;span style="color:#2b91af;"&gt;CustomKeyValuePair&lt;/span&gt; : INotifyPropertyChanged &lt;span style="color:green;"&gt;//DependencyObject&lt;/span&gt;&lt;br /&gt;{&lt;br /&gt;&lt;span style="color:green;"&gt;//public static readonly DependencyProperty ValueProperty = DependencyProperty.Register("Value", typeof(object), typeof(PairKeyValue), new UIPropertyMetadata(null));&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="color:green;"&gt;//public object Value&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;//{&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// get&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// {&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// return (object)GetValue(ValueProperty);&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// }&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// set&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// {&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// SetValue(ValueProperty, value);&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;// }&lt;/span&gt;&lt;br /&gt;&lt;span style="color:green;"&gt;//}&lt;br /&gt;&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="color:blue;"&gt;// Solution for "The calling thread cannot access this object because a different thread owns it."&lt;br /&gt;&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="color:blue;"&gt;object&lt;/span&gt; _value;&lt;br /&gt;&lt;/p&gt;&lt;p&gt;&lt;span style="color:gray;"&gt;///&lt;/span&gt;&lt;span style="color:green;"&gt; &lt;/span&gt;&lt;span style="color:gray;"&gt;&amp;lt;summary&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="color:gray;"&gt;///&lt;/span&gt;&lt;span style="color:green;"&gt; Gets or sets the value in key-value pair.&lt;/span&gt;&lt;br /&gt;&lt;span style="color:gray;"&gt;///&lt;/span&gt;&lt;span style="color:green;"&gt; &lt;/span&gt;&lt;span style="color:gray;"&gt;&amp;lt;/summary&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt; &lt;span style="color:blue;"&gt;object&lt;/span&gt; Value&lt;br /&gt;{&lt;br /&gt;&lt;span style="color:blue;"&gt;get&lt;/span&gt;&lt;br /&gt;{&lt;br /&gt;&lt;span style="color:blue;"&gt;return&lt;/span&gt; _value;&lt;br /&gt;}&lt;br /&gt;&lt;span style="color:blue;"&gt;set&lt;/span&gt;&lt;br /&gt;{&lt;br /&gt;_value=&lt;span style="color:blue;"&gt;value&lt;/span&gt;;&lt;br /&gt;OnPropertyChanged(&lt;span style="color:#a31515;"&gt;"Value"&lt;/span&gt;);&lt;br /&gt;}&lt;br /&gt;}&lt;br /&gt;&lt;span style="color:blue;"&gt;#region&lt;/span&gt; INotifyPropertyChanged Members&lt;br /&gt;&lt;span style="color:blue;"&gt;public&lt;/span&gt; &lt;span style="color:blue;"&gt;event&lt;/span&gt; PropertyChangedEventHandler PropertyChanged;&lt;br /&gt;&lt;span style="color:blue;"&gt;protected&lt;/span&gt; &lt;span style="color:blue;"&gt;void&lt;/span&gt; OnPropertyChanged(&lt;span style="color:blue;"&gt;string&lt;/span&gt; propertyName)&lt;br /&gt;{&lt;br /&gt;&lt;span style="color:blue;"&gt;if&lt;/span&gt; (PropertyChanged != &lt;span style="color:blue;"&gt;null&lt;/span&gt;)&lt;br /&gt;{&lt;br /&gt;PropertyChanged(&lt;span style="color:blue;"&gt;this&lt;/span&gt;, &lt;span style="color:blue;"&gt;new&lt;/span&gt; PropertyChangedEventArgs(propertyName));&lt;br /&gt;}&lt;br /&gt;&lt;span style="color:blue;"&gt;#endregion&lt;br /&gt;&lt;/span&gt;}&lt;br /&gt;&lt;/p&gt;&lt;p&gt;Enjoy &lt;span style="font-family:Wingdings;"&gt;J&lt;/span&gt;&lt;br /&gt;&lt;/p&gt;&lt;p&gt;-Venugopal.&lt;br /&gt;&lt;/p&gt;&lt;/span&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/05/calling-thread-cannot-access-this.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-5668379495838352782</guid><pubDate>Thu, 18 Mar 2010 11:10:00 +0000</pubDate><atom:updated>2010-03-18T04:12:49.466-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Focus Manager</category><title>Shifting focus to the first available element in WPF</title><description>Hi,&lt;br /&gt;&lt;br /&gt;Nice article for this requirement.&lt;br /&gt;&lt;br /&gt;http://www.julmar.com/blog/mark/2008/09/12/Part3ShiftingFocusToTheFirstAvailableElementInWPF.aspx&lt;br /&gt;&lt;br /&gt;-Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/03/shifting-focus-to-first-available.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-8565474644773644629</guid><pubDate>Mon, 15 Mar 2010 04:38:00 +0000</pubDate><atom:updated>2010-03-14T22:11:09.256-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">DataBinding In WPF</category><title>How to suppress the System.Windows.Data Error warning message</title><description>Hi,&lt;br /&gt;&lt;br /&gt;When we use FindAncesstor in custom control template for binding internal elements property into its ancestor element, visual studio displays data warning messages in output window when binding engine meets unmatched target type during visual tree traversal though it does the proper binding when it receives expected target type during visual tree traversal. To suppress this data error warning messages, you should mention level of warning message trace in your library class.&lt;br /&gt;&lt;br /&gt;Here is the simple data error that I am getting when I bind some commands in rich text box.&lt;br /&gt;&lt;br /&gt;System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.RichTextBox', AncestorLevel='1''. BindingExpression:Path=Content; DataItem=null; target element is 'Button' (Name=''); target property is 'CommandTarget' (type 'IInputElement')&lt;br /&gt;System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.RichTextBox', AncestorLevel='1''. BindingExpression:Path=Content; DataItem=null; target element is 'Button' (Name=''); target property is 'CommandTarget' (type 'IInputElement')&lt;br /&gt;System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.RichTextBox', AncestorLevel='1''. BindingExpression:Path=Content; DataItem=null; target element is 'Button' (Name=''); target property is 'CommandTarget' (type 'IInputElement')&lt;br /&gt;System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.RichTextBox', AncestorLevel='1''. BindingExpression:Path=Content; DataItem=null; target element is 'Button' (Name=''); target property is 'CommandTarget' (type 'IInputElement')&lt;br /&gt;System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.RichTextBox', AncestorLevel='1''. BindingExpression:Path=Content; DataItem=null; target element is 'Button' (Name=''); target property is 'CommandTarget' (type 'IInputElement')&lt;br /&gt;System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.RichTextBox', AncestorLevel='1''. BindingExpression:Path=Content; DataItem=null; target element is 'Button' (Name=''); target property is 'CommandTarget' (type 'IInputElement')&lt;br /&gt;&lt;br /&gt;Solution, set data binding source switch level as critical in constructor of the class.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;System.Diagnostics.PresentationTraceSources.DataBindingSource.Switch.Level = System.Diagnostics.SourceLevels.Critical;&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/03/how-to-suppress-systemwindowsdata-error.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-6959533894487122360</guid><pubDate>Thu, 11 Mar 2010 05:14:00 +0000</pubDate><atom:updated>2010-05-07T02:33:03.758-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Attached Properties In WPF</category><category domain="http://www.blogger.com/atom/ns#">Binding Attached Property</category><category domain="http://www.blogger.com/atom/ns#">XML DataBinding In WPF</category><title>Binding AttachedProperty Based on SelectedItem in Xaml</title><description>Hi,&lt;br /&gt;&lt;br /&gt;Today one of  our WPF product customer raised a question about how to bind an attached property in XAML. I was wondered like what is the problem in it, and I just replied him immediately with below code.&lt;br /&gt;&lt;window title="{customControl:MyControl.Header), ElementName=MyControlObjectName}"&gt;&lt;br /&gt;&lt;br /&gt;But after his detailed reply for my post, came to know that his question was valid :). Because he wants to bind the attached property of custom ItemsControl using its items object without mentioning specific child object name whenever active item gets changed.&lt;br /&gt;&lt;br /&gt;I just tried following code and its working perfectly without any event handler or converter in View Modal application.&lt;br /&gt;&lt;br /&gt;Here is the solution.&lt;br /&gt;&lt;br /&gt;&lt;strong&gt;&lt;window title="{Binding Path=(ActiveItem).(MyControl:MyControl.Header), ElementName=MycontrolObject}"&gt;&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;Note that, ActiveItem should get updated whenever you select any item in itemscontrol. Just like SelectedItem property.&lt;br /&gt;&lt;br /&gt;Thanks to the WPF team for providing powerful binding stuffs.&lt;br /&gt;&lt;br /&gt;-Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/03/binding-attachedproperty-based-on.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-379513669887268324</guid><pubDate>Mon, 01 Mar 2010 07:31:00 +0000</pubDate><atom:updated>2010-02-28T23:50:35.334-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Designer Support</category><title>Property Grid Editing Support for Collection Type Property - Custom Control</title><description>Hi,&lt;br /&gt;&lt;br /&gt;Last week I faced some problem while giving property grid editor support for&lt;strong&gt; collection type &lt;/strong&gt;property. For instance my custom control(NavigationControl) inherited from ItemsControl and its item container is NavigationItem. Now when I try to add items through Items property in property grid&lt;strong&gt;(In both VS2008 and VS2010), &lt;/strong&gt;Add button is in disabled state which is present in collection editor dialog box.&lt;br /&gt;&lt;br /&gt;To activate this with custom type or collection of types, you can register this in attribute table builder of your designer projects.&lt;br /&gt;&lt;br /&gt;For instance,&lt;br /&gt;&lt;br /&gt;internal class Metadata : IRegisterMetadata&lt;br /&gt;    {&lt;br /&gt;&lt;br /&gt;        // Called by Cider to register any design-time metadata&lt;br /&gt;        public void Register()&lt;br /&gt;        {&lt;br /&gt;            AttributeTableBuilder builder = new AttributeTableBuilder();&lt;br /&gt;            builder.AddCustomAttributes(typeof(NavigationItem), new ToolboxBrowsableAttribute(false));&lt;br /&gt;            &lt;strong&gt;builder.AddCustomAttributes(typeof(NavigationControl), "Items", new NewItemTypesAttribute(typeof(NavigationItem)));&lt;/strong&gt;&lt;br /&gt;    MetadataStore.AddAttributeTable(builder.CreateTable());&lt;br /&gt;       }&lt;br /&gt;  }&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/02/collection-editor-support-for-custom.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-7795843338395960269</guid><pubDate>Wed, 10 Feb 2010 11:19:00 +0000</pubDate><atom:updated>2010-02-10T03:38:06.086-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Enum As ItemsSource</category><title>How to set Enum type as ItemsSource?</title><description>&lt;span style="font-family:verdana;"&gt;Hi,&lt;br /&gt;&lt;br /&gt;Here is the simple way to bind the Enum types as ItemsSource in items control.&lt;br /&gt;&lt;br /&gt;&amp;lt;Window x:Class="DoubleTextBoxSample.Window1"&lt;br /&gt;xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"&lt;br /&gt;xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"&lt;br /&gt;xmlns:local="clr-namespace:DoubleTextBoxSample"&lt;br /&gt;xmlns:syncfusion="http://schemas.syncfusion.com/wpf"&lt;br /&gt;xmlns:sys="clr-namespace:System;assembly=mscorlib"&lt;br /&gt;Title="Window1" Height="300" Width="300"&amp;gt;&lt;br /&gt;&amp;lt;Window.Resources&amp;gt;&lt;br /&gt;&amp;lt;ObjectDataProvider x:Key="itemsFromEnum" MethodName="GetValues" ObjectType="{x:Type sys:Enum}"&amp;gt;&lt;br /&gt;&amp;lt;ObjectDataProvider.MethodParameters&amp;gt;&lt;br /&gt;&amp;lt;x:Type TypeName="Orientation"/&amp;gt;&lt;br /&gt;&amp;lt;/ObjectDataProvider.MethodParameters&amp;gt;&lt;br /&gt;&amp;lt;/ObjectDataProvider&amp;gt;&lt;br /&gt;&amp;lt;/Window.Resources&amp;gt;&lt;br /&gt;&lt;br /&gt;&amp;lt;StackPanel&amp;gt;&lt;br /&gt;&amp;lt;syncfusion:CheckListBox ItemsSource="{Binding Source={StaticResource itemsFromEnum}}"&amp;gt;&lt;br /&gt;&amp;lt;/syncfusion:CheckListBox&amp;gt;&lt;br /&gt;&amp;lt;/StackPanel&amp;gt;&lt;br /&gt;&amp;lt;/Window&amp;gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Just bound object provider instance with Syncfusion's CheckListbox ItemsSource property and got cool result.&lt;br /&gt;&lt;br /&gt;&lt;/span&gt;&lt;a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiThTCnCBIe7Vk1MEqvrekVI1DXyV1yA-L04r4JQLaiJ8Hz_HGlL8YqRqzXldsXihSmJEr98JQ_VC7Z6dZWzgruzjP4aJDWjPOeoDEkkFKL1ji3TqN_Ol1ck6oDC561TxEHe4C9GTcVlXsE/s1600-h/enumType.png"&gt;&lt;span style="font-family:verdana;"&gt;&lt;img style="MARGIN: 0px 10px 10px 0px; WIDTH: 283px; FLOAT: left; HEIGHT: 50px; CURSOR: hand" id="BLOGGER_PHOTO_ID_5436575718230169282" border="0" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiThTCnCBIe7Vk1MEqvrekVI1DXyV1yA-L04r4JQLaiJ8Hz_HGlL8YqRqzXldsXihSmJEr98JQ_VC7Z6dZWzgruzjP4aJDWjPOeoDEkkFKL1ji3TqN_Ol1ck6oDC561TxEHe4C9GTcVlXsE/s320/enumType.png" /&gt;&lt;br /&gt;&lt;/span&gt;&lt;/a&gt;&lt;br /&gt;&lt;span style="font-family:verdana;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;span style="font-family:verdana;"&gt;Thanks,&lt;br /&gt;Venugopal. &lt;/span&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2010/02/how-to-set-enum-type-as-itemssource.html</link><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" height="72" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiThTCnCBIe7Vk1MEqvrekVI1DXyV1yA-L04r4JQLaiJ8Hz_HGlL8YqRqzXldsXihSmJEr98JQ_VC7Z6dZWzgruzjP4aJDWjPOeoDEkkFKL1ji3TqN_Ol1ck6oDC561TxEHe4C9GTcVlXsE/s72-c/enumType.png" width="72"/><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-2614674433481638879</guid><pubDate>Wed, 20 May 2009 04:27:00 +0000</pubDate><atom:updated>2009-07-16T22:46:19.888-07:00</atom:updated><title>Composite Application Library (Prism-CAL)</title><description>&lt;span xmlns=''&gt;&lt;p&gt;Hi Guys, &lt;br/&gt;&lt;br/&gt;Sorry for the long delay in post. I was quiet busy with my work. I will update some interesting posts about CAL library soon. &lt;br/&gt;&lt;br/&gt;-Venugopal.&lt;br /&gt;&lt;/p&gt;&lt;p&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/p&gt;&lt;/span&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2009/05/composite-application-libraryprism-cal.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-4955118556368092768</guid><pubDate>Tue, 16 Dec 2008 09:07:00 +0000</pubDate><atom:updated>2008-12-16T01:11:12.662-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Adorner</category><title>Visual Level Programming vs Logical Level Programming</title><description>Excelent Article about Visual child and tree maintenance.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://shevaspace.blogspot.com/2007/02/visual-level-programming-vs-logical.html"&gt;http://shevaspace.blogspot.com/2007/02/visual-level-programming-vs-logical.html&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Thanks Zhou Yong.&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/12/visual-level-programming-vs-logical.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-4795687680786783581</guid><pubDate>Mon, 25 Aug 2008 09:46:00 +0000</pubDate><atom:updated>2008-08-25T02:54:58.066-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Full Trust XBAP Application In WPF</category><title>Own Certificate Installer for XBAP deployment</title><description>Very nice article for certificate installer.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://savij.com/2007/02/19/"&gt; Certificate installer&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="http://blogs.microsoft.co.il/blogs/maxim/archive/2008/03/05/wpf-xbap-as-full-trust-application.aspx"&gt;XBAP Clickonce Deployment&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/08/own-certificate-installer-for-xbap.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-5686658645593307157</guid><pubDate>Mon, 25 Aug 2008 09:11:00 +0000</pubDate><atom:updated>2008-08-25T02:55:55.034-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Full Trust XBAP Application In WPF</category><title>Converting EXE Projects to XBAPs</title><description>Here is nice explaination about Converting EXE Projects to XBAPs.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://www.charlespetzold.com/blog/2006/11/120718.html"&gt;Converting EXE Projects to XBAPs&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/08/converting-exe-projects-to-xbaps.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-3781585462055571759</guid><pubDate>Fri, 11 Jul 2008 10:27:00 +0000</pubDate><atom:updated>2008-07-14T10:23:53.191-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">assembly sign</category><title>How can we Resign the satelitte assembly from command prompt.</title><description>Here is the command to resign the satelitte assembly :&lt;br /&gt;&lt;br /&gt;sn -R "YourAssemblyName.dll" "yourpublickey.snk"&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/07/how-can-we-resign-satelitte-assembly.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-7854493860951020206</guid><pubDate>Sat, 05 Jul 2008 18:46:00 +0000</pubDate><atom:updated>2008-07-05T11:51:30.250-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Dependency Properties In WPF.</category><title>Another way to listen to dependency property change.</title><description>&lt;a href="http://blogs.msdn.com/bencon/archive/2007/02/02/cool-trick-with-dependency-properties.aspx"&gt;Ben Constable &lt;/a&gt;just blogs about another elegant way to listen to dependency property change, the trick here is using DependencyPropertyDescriptor, imagine that you have a Label called myLabel, and you want to get notified when it's ContentProperty is changed, then you can do something like the following: &lt;br /&gt;&lt;br /&gt;DependencyPropertyDescriptor dpd = DependencyPropertyDescriptor.FromProperty(Label.ContentProperty, typeof(Label));&lt;br /&gt;if (dpd != null)&lt;br /&gt;{&lt;br /&gt;    dpd.AddValueChanged(myLabel, delegate&lt;br /&gt;    {&lt;br /&gt;        // Add your logic here to respond to value change.&lt;br /&gt;    });&lt;br /&gt;} &lt;br /&gt;&lt;br /&gt;  The other ways in WPF that you can use to listen to property change is to subclass an existing Control, and override the metadata of a dependency property whose property change you want to listen to, when you do so, you need to specify a PropertyChangedCallback which a delegate to your property change event handler, or instead of using PropertyChangedCallback, you can override the OnPropertyChanged method, and place your logic there, as a bonus, you can get additional information things like which property is changed by examining the value of passed-in DependencyPropertyChangedEventArgs argument's Property property.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/07/another-way-to-listen-to-dependency.html</link><thr:total>1</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-4532260881785997635</guid><pubDate>Fri, 13 Jun 2008 19:08:00 +0000</pubDate><atom:updated>2008-06-13T12:15:19.793-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Timer and Dispatcher</category><title>What is difference between Timer and Dispatcher</title><description>&lt;strong&gt;Dispatcher things&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;The DispatcherTimer is reevaluated at the top of every Dispatcher loop.&lt;br /&gt;&lt;br /&gt;Timers are not guaranteed to execute exactly when the time interval occurs, but are guaranteed to not execute before the time interval occurs. This is because DispatcherTimer operations are placed on the Dispatcher queue like other operations. When the DispatcherTimer operation executes is dependent on the other jobs in the queue and their priorities. &lt;br /&gt;&lt;br /&gt;If a System.Timers.Timer is used in a WPF application, it is worth noting that the System.Timers.Timer runs on a different thread then the user interface (UI) thread. In order to access objects on the user interface (UI) thread, it is necessary to post the operation onto the Dispatcher of the user interface (UI) thread using Invoke or BeginInvoke. Reasons for using a DispatcherTimer opposed to a System.Timers.Timer are that the DispatcherTimer runs on the same thread as the Dispatcher and a DispatcherPriority can be set on the DispatcherTimer.&lt;br /&gt;&lt;br /&gt;A DispatcherTimer will keep an object alive whenever the object’s methods are bound to the timer.&lt;br /&gt;&lt;br /&gt;So, the right way to schedule things inside the WPF UI is something like this.&lt;br /&gt;&lt;br /&gt;&lt;blockquote&gt;private DispatcherTimer _timer;&lt;br /&gt;timer = new DispatcherTimer(DispatcherPriority.Background);&lt;br /&gt;timer.Interval = TimeSpan.FromMinutes(5);&lt;br /&gt;timer.Tick += delegate { ScheduleUpdate(); };&lt;br /&gt;timer.Start();&lt;/blockquote&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/06/what-is-difference-between-timer-and.html</link><thr:total>2</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-620747562244792013</guid><pubDate>Thu, 05 Jun 2008 13:23:00 +0000</pubDate><atom:updated>2008-06-05T06:44:27.008-07:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Coordinate Systems</category><title>Coordinate Systems in .Net</title><description>Before we discuss transformations, we need to understand coordinate systems. GDI+ defines three types of coordinate spaces: world, page, and device. When we ask GDI+ to draw a line from point A (x1, y1) to point B (x2, y2), these points are in the world coordinate system. &lt;br /&gt;&lt;br /&gt;Before GDI+ draws a graphics shape on a surface, the shape goes through a few transformation stages (conversions). The first stage converts world coordinates to page coordinates. Page coordinates may or may not be the same as world coordinates, depending on the transformation. The process of converting world coordinates to page coordinates is called world transformation. &lt;br /&gt;&lt;br /&gt;The second stage converts page coordinates to device coordinates. Device coordinates represent how a graphics shape will be displayed on a device such as a monitor or printer. The process of converting page coordinates to device coordinates is called page transformation. Figure 10.2 shows the stages of conversion from world coordinates to device coordinates. &lt;br /&gt;&lt;br /&gt;&lt;a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_9PEe7f0ybxKGFmlHUXlr4v5DUlE6Wgr-ZzVb2lDnsrLmkIo2pRNJcSkpmR9brtLCJbsnfMKpUi3iFYtF2vx8clGOjPaduK7JXsDbtWOby5tzTRylpED6uN_N4Y1HBSBcaAuslS2EJbG8/s1600-h/Paging.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:left;cursor:pointer; cursor:hand;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_9PEe7f0ybxKGFmlHUXlr4v5DUlE6Wgr-ZzVb2lDnsrLmkIo2pRNJcSkpmR9brtLCJbsnfMKpUi3iFYtF2vx8clGOjPaduK7JXsDbtWOby5tzTRylpED6uN_N4Y1HBSBcaAuslS2EJbG8/s320/Paging.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5208388038377466754" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;In GDI+, the default origin of all three coordinate systems is point (0, 0), which is at the upper left corner of the client area. When we draw a line from point A (0, 0) to point B (120, 80), the line starts 0 pixels from the upper left corner in the x-direction and 0 pixels from the upper left corner in the y-direction, and it will end 120 pixels over in the x-direction and 80 pixels down in the y-direction. The line from point A (0, 0) to point B (120, 80) is shown in Figure 10.3.&lt;br /&gt;&lt;br /&gt;&lt;a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheIL3z98S6TLme8DwjCKNOKltxsfx3qraJ0DbDuoeYXgcrxEn1GuJGx3hvZ3Hr_xW9Kl57m-LkHaNVvksdR-rJk0B83JbrHjHhD4AHid0Z7E1FNYN8XUkVoL4MZFM1GUonMw9yDQU5-Am5/s1600-h/second.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:left;cursor:pointer; cursor:hand;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheIL3z98S6TLme8DwjCKNOKltxsfx3qraJ0DbDuoeYXgcrxEn1GuJGx3hvZ3Hr_xW9Kl57m-LkHaNVvksdR-rJk0B83JbrHjHhD4AHid0Z7E1FNYN8XUkVoL4MZFM1GUonMw9yDQU5-Am5/s320/second.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5208388991911174146" /&gt;&lt;/a&gt;&lt;br /&gt;Figure 10.3. Drawing a line from point (0, 0) to point (120, 80) &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Drawing this line programmatically is very simple. We must have a Graphics object associated with a surface (a form or a control). We can get a Graphics object in several ways. One way is to accept the implicit object provided by a form’s paint event handler; another is to use the CreateGraphics method. Once we have a Graphics object, we call its draw and fill methods to draw and fill graphics objects. Listing 10.1 draws a line from starting point A (0, 0) to ending point B (120, 80). You can add this code to a form’s paint event handler. &lt;br /&gt;&lt;br /&gt;Listing 10.1 Drawing a line from point (0, 0) to point (120, 80) &lt;br /&gt;&lt;br /&gt;Graphics g = e.Graphics;&lt;br /&gt;Point A = new Point(0, 0);&lt;br /&gt;Point B = new Point(120, 80);&lt;br /&gt;g.DrawLine(Pens.Black, A, B);&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Figure 10.3 shows the output from Listing 10.1. All three coordinate systems (world, page, and device) draw a line starting from point (0, 0) in the upper left corner of the client area to point (120, 80). &lt;br /&gt;&lt;br /&gt;Now let’s change to the page coordinate system. We draw a line from point A (0, 0) to point B (120, 80), but this time our origin is point (50, 40) instead of the upper left corner. We shift the page coordinates from point (0, 0) to point (50, 40). The TranslateTransform method of the Graphics class does this for us. We will discuss this method in more detail in the discussion that follows. For now, let’s try the code in Listing 10.2. &lt;br /&gt;&lt;br /&gt;Listing 10.2 Drawing a line from point (0, 0) to point (120, 80) with origin (50, 40) &lt;br /&gt;&lt;br /&gt;Graphics g = e.Graphics;&lt;br /&gt;g.TranslateTransform(50, 40);&lt;br /&gt;Point A = new Point(0, 0);&lt;br /&gt;Point B = new Point(120, 80);&lt;br /&gt;g.DrawLine(Pens.Black, A, B);&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Figure 10.4 shows the output from Listing 10.2. The page coordinate system now starts at point (50, 40), so the line starts at point (0, 0) and ends at point (120, 80). The world coordinates in this case are still (0, 0) and (120, 80), but the page and device coordinates are (50, 40) and (170, 120). The device coordinates in this case are the same as the page coordinates because the page unit is in the pixel (default) format. &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCxUd6LSOrs5q__jz6LmHuYE3VNwziZAVEd-nw-se5CvE2FG9RLwlEQK58pM2H6JWMTFmrBIDjn5_drIht4SDwuC5wOgnBeDhAjR7KNvBXKdUwaZ7ybLi49BkJkeh73VrmI7VZVcLwI-7g/s1600-h/third.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:left;cursor:pointer; cursor:hand;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCxUd6LSOrs5q__jz6LmHuYE3VNwziZAVEd-nw-se5CvE2FG9RLwlEQK58pM2H6JWMTFmrBIDjn5_drIht4SDwuC5wOgnBeDhAjR7KNvBXKdUwaZ7ybLi49BkJkeh73VrmI7VZVcLwI-7g/s320/third.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5208390724700917954" /&gt;&lt;/a&gt;&lt;br /&gt;Figure 10.4. Drawing a line from point (0, 0) to point (120, 80) with origin (50, 40) &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;What is the difference between page and device coordinates? Device coordinates determine what we actually see on the screen. They can be represented in many formats, including pixels, millimeters, and inches. If the device coordinates are in pixel format, the page coordinates and device coordinates will be the same (this is typically true for monitors, but not for printers). &lt;br /&gt;&lt;br /&gt;The PageUnit property of the Graphics class is of type GraphicsUnit enumeration. In Listing 10.3 we set the PageUnit property to inches. Now graphics objects will be measured in inches, so we need to pass inches instead of pixels. If we draw a line from point (0, 0) to point (2, 1), the line ends 2 inches from the left side and 1 inch from the top of the client area in the page coordinate system. In this case the starting and ending points are (0, 0) and (2, 1) in both world and page coordinates, but the device coordinate system converts them to inches. Hence the starting and ending points in the device coordinate system are (0, 0) and (192, 96), assuming a resolution of 96 dots per inch. &lt;br /&gt;&lt;br /&gt;Listing 10.3 Setting the device coordinate system to inches &lt;br /&gt;g.PageUnit = GraphicsUnit.Inch;&lt;br /&gt;g.DrawLine(Pens.Black, 0, 0, 2, 1);&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Figure 10.5 shows the output from Listing 10.3. The default width of the pen is 1 page unit, which in this case gives us a pen 1 inch wide.&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK05Od6VVA4NSg1NmdVQpGJcvi2b0PDHNxUmXw0hc1X5uCXaAV0J7y5c6d_Oirpzo-9kdnzzbnn3A23MQbYBBjc9qJGEk7mfNs9nxxkEwWdVNkF89Q54N5RXxXqhVURBOQ9pcZ6ncf7gyH/s1600-h/fourth.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:left;cursor:pointer; cursor:hand;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK05Od6VVA4NSg1NmdVQpGJcvi2b0PDHNxUmXw0hc1X5uCXaAV0J7y5c6d_Oirpzo-9kdnzzbnn3A23MQbYBBjc9qJGEk7mfNs9nxxkEwWdVNkF89Q54N5RXxXqhVURBOQ9pcZ6ncf7gyH/s320/fourth.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5208391115306839794" /&gt;&lt;/a&gt;&lt;br /&gt;Figure 10.5. Drawing with the GraphicsUnit.Inch option &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Now let’s create a new pen with a different width. Listing 10.4 creates a pen that’s 1 pixel wide (it does so by dividing the number of pixels we want—in this case 1—by the page resolution, which is given by DpiX). We draw the line again, this time specifying a red color. &lt;br /&gt;&lt;br /&gt;Listing 10.4 Using the GraphicsUnit.Inch option with a pixel width &lt;br /&gt;Pen redPen = new Pen(Color.Red, 1/g.DpiX);&lt;br /&gt;g.PageUnit = GraphicsUnit.Inch;&lt;br /&gt;g.DrawLine(Pens.Black, 0, 0, 2, 1);&lt;br /&gt;&lt;br /&gt;Figure 10.6 shows the output from Listing 10.4. &lt;br /&gt;&lt;br /&gt;&lt;a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh76cPqEvv6rOzdEp5Mi_pyGuLMDxaRv2m0jMRt1_dJzs1bhnYZFzZ7PeNj7yKOL2qn18_08MyjXv9HE3CigacavOFc3KVq7hutp5nh5ZDfMVp86N-yjcl8NY_kDo8oIKsIpfWUqtZBfeds/s1600-h/sixth.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:left;cursor:pointer; cursor:hand;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh76cPqEvv6rOzdEp5Mi_pyGuLMDxaRv2m0jMRt1_dJzs1bhnYZFzZ7PeNj7yKOL2qn18_08MyjXv9HE3CigacavOFc3KVq7hutp5nh5ZDfMVp86N-yjcl8NY_kDo8oIKsIpfWUqtZBfeds/s320/sixth.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5208391723262348242" /&gt;&lt;/a&gt;&lt;br /&gt;Figure 10.6. Drawing with the GraphicsUnit.Inch option and a pixel width &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;We can also combine the use of page and device coordinates. In Listing 10.5 we transform page coordinates to 1 inch from the left and 0.5 inch from the top of the upper left corner of the client area. Our new page coordinate system has starting and ending points of (1, 0.5) and (3, 1.5), but the device coordinate system converts them to pixels. Hence the starting and ending points in device coordinates are (96, 48) and (288, 144), assuming a resolution of 96 dots per inch. &lt;br /&gt;&lt;br /&gt;Listing 10.5 Combining page and device coordinates &lt;br /&gt;Pen redPen = new Pen(Color.Red, 1/g.DpiX);&lt;br /&gt;g.TranslateTransform(1, 0.5f);&lt;br /&gt;g.PageUnit = GraphicsUnit.Inch;&lt;br /&gt;g.DrawLine(redPen, 0, 0, 2, 1);&lt;br /&gt;&lt;br /&gt;Figure 10.7 shows the output from Listing 10.5. &lt;br /&gt;&lt;br /&gt;&lt;a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgtMRPo99M4cOGN7ZyMst8vPtzzr9x67navK0sTblvYjqkCtKDu-54W7NfWKbf6ohhXsFqSto004t14MracZST0j3dQOYrXe1bvdhmUQAnxR3QGdwA8pZvT5gDb97Eb9PRf9OmuORfQ3Df/s1600-h/seventh.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:left;cursor:pointer; cursor:hand;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgtMRPo99M4cOGN7ZyMst8vPtzzr9x67navK0sTblvYjqkCtKDu-54W7NfWKbf6ohhXsFqSto004t14MracZST0j3dQOYrXe1bvdhmUQAnxR3QGdwA8pZvT5gDb97Eb9PRf9OmuORfQ3Df/s320/seventh.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5208392222668172002" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Figure 10.7. Combining page and device coordinates&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/06/coordinate-systems-in-net.html</link><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" height="72" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_9PEe7f0ybxKGFmlHUXlr4v5DUlE6Wgr-ZzVb2lDnsrLmkIo2pRNJcSkpmR9brtLCJbsnfMKpUi3iFYtF2vx8clGOjPaduK7JXsDbtWOby5tzTRylpED6uN_N4Y1HBSBcaAuslS2EJbG8/s72-c/Paging.png" width="72"/><thr:total>4</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-2124142626868506264</guid><pubDate>Wed, 13 Feb 2008 09:56:00 +0000</pubDate><atom:updated>2008-02-13T02:07:00.728-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">WPF Designer Load Failures</category><title>Troubleshooting WPF Designer Load Failures</title><description>Hi,&lt;br /&gt;&lt;br /&gt;Now that people have been kicking the tires of the WPF Designer for Visual Studio 2008 (aka "Cider). Here's a  &lt;a href="http://msdn2.microsoft.com/en-us/library/bb546934.aspx"&gt;preview&lt;/a&gt; of the topic that will ship in the docs. Hopefully this will help out before frustration and despair set in.&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/02/troubleshooting-wpf-designer-load.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-5259628366427757099</guid><pubDate>Tue, 05 Feb 2008 07:05:00 +0000</pubDate><atom:updated>2008-02-04T23:34:42.679-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">ItemsPanelTemplate object reference</category><title>How Can I Get ItemsPanelTemplate Obeject Reference In Custom Control Class Itself?.</title><description>&lt;span style="font-size:85%;"&gt;Hi, &lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;I have faced complex problem during my ScrollPanel(I will post this ScrollPanel logic and advantage by shortly) CustomControl implementation. The actual problem is I couldn't get ItemsPanelTemplate object reference in control class itlsef. I found some solution in net, but those things are related to outside of control class only. &lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;Then finally i found the soultion with the help of VisualTreeHelper class. Here is the code snippet.&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;color:#000066;"&gt;private T FindItemsPanel&lt;t&gt;(Visual visual)&lt;br /&gt;{&lt;br /&gt;for (int i = 0; i &lt; VisualTreeHelper.GetChildrenCount(visual); i++)&lt;br /&gt;{&lt;br /&gt;Visual child = VisualTreeHelper.GetChild(visual, i) as Visual;&lt;br /&gt;if (child != null)&lt;br /&gt;{&lt;br /&gt;if (child is T &amp;amp;&amp;amp; VisualTreeHelper.GetParent(child) is ItemsPresenter)&lt;br /&gt;{&lt;br /&gt;object temp = child;&lt;br /&gt;return (T)temp;&lt;br /&gt;}&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;T panel = FindItemsPanel&lt;t&gt;(child);&lt;br /&gt;if (panel != null)&lt;br /&gt;{&lt;br /&gt;object temp = panel;&lt;br /&gt;return (T)temp; // return the panel up the call stack&lt;br /&gt;}&lt;br /&gt;}&lt;br /&gt;}&lt;br /&gt;return default(T);&lt;br /&gt;}&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;But here also I had one problem like getting object reference after initialized my control. I had tried with OnInitialized method, and tried in constructor of my control class, but not use. Then finally found the solution with the help of OnLoaded event of my control class.&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;Like Below :&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;span style="font-size:85%;color:#000066;"&gt;public ReflectionGallery()&lt;br /&gt;{&lt;br /&gt;&lt;/span&gt;&lt;span style="font-size:85%;color:#000066;"&gt;this.Loaded += new RoutedEventHandler(ReflectionGallery_Loaded);&lt;br /&gt;}&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;span style="font-size:85%;color:#000066;"&gt;void ReflectionGallery_Loaded(object sender, RoutedEventArgs e)&lt;br /&gt;{&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;color:#000066;"&gt;//ItemsPanelObject is my own dependency property&lt;br /&gt;ItemsPanelObject = FindItemsPanel&lt;reflectionpanel&gt;(this);&lt;br /&gt;}&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;This is my control template(Style)&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&amp;lt;Style TargetType="{x:Type local:ReflectionGallery}" x:Key="{x:Type local:ReflectionGallery}"&amp;gt;&lt;br /&gt;&amp;lt;Setter Property="Template" Value="{StaticResource ReflectionGalleryTemplateKey}"/&amp;gt;&lt;br /&gt;&amp;lt;Setter Property="Margin" Value="2"/&amp;gt;&lt;br /&gt;&amp;lt;Setter Property="ItemsPanel"&amp;gt;&lt;br /&gt;&amp;lt;Setter.Value&amp;gt;&lt;br /&gt;&amp;lt;ItemsPanelTemplate&amp;gt;&lt;br /&gt;&amp;lt;local:ReflectionPanel Name="PART_ReflectionPanel" /&amp;gt;&lt;br /&gt;&amp;lt;/ItemsPanelTemplate&amp;gt;&lt;br /&gt;&amp;lt;/Setter.Value&amp;gt;&lt;br /&gt;&amp;lt;/Setter&amp;gt;&lt;br /&gt;&amp;lt;/Style&amp;gt;&lt;br /&gt;&lt;span style="font-size:85%;color:#ff0000;"&gt;&lt;style targettype="{x:Type local:ReflectionGallery}" key="{x:Type local:ReflectionGallery}"&gt;&lt;br /&gt;&lt;setter property="Template" value="{StaticResource ReflectionGalleryTemplateKey}"&gt;&lt;br /&gt;&lt;setter property="Margin" value="2"&gt;&lt;br /&gt;&lt;setter property="ItemsPanel"&gt;&lt;br /&gt;&lt;setter.value&gt;&lt;br /&gt;&lt;itemspaneltemplate&gt;&lt;br /&gt;&lt;local:reflectionpanel name="PART_ReflectionPanel"&gt;&lt;br /&gt;&lt;/itemspaneltemplate&gt;&lt;br /&gt;&lt;/Setter.Value&gt;&lt;br /&gt;&lt;/setter&gt;&lt;br /&gt;&lt;/style&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;Now we can use ItemsPanelObject property to play with custom panel of my ScrollPanel control.&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;I hope this will help to Custom Control authors like me&lt;span style="color:#330033;"&gt; :) :).&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;Please feel free to post your comments on this.&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;I will meet you with my ScrollPanel post. This might be very cool like Carousel panel.&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;Thanks,&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;Venugopal.&lt;/span&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;&lt;span style="font-size:85%;"&gt;&lt;/span&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/02/how-can-i-get-itemspaneltemplate.html</link><thr:total>0</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-563068393858158016</guid><pubDate>Wed, 09 Jan 2008 09:30:00 +0000</pubDate><atom:updated>2008-01-22T10:09:19.571-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">System Brushes List</category><title>How Can I Get System Brushes List in WPF?.</title><description>For getting System brushes list, we need to use propertyinfo class.&lt;br /&gt;&lt;br /&gt;Here i am creating ObservableCollection with object type as MyBrush.&lt;br /&gt;&lt;br /&gt;public class ColorItemList: ObservableCollection&lt;mybrush&gt;&lt;br /&gt;{&lt;br /&gt;public &lt;/mybrush&gt;ColorItemList&lt;mybrush&gt;() : base()&lt;br /&gt;{&lt;br /&gt;Type type = typeof( Brushes );&lt;br /&gt;foreach( PropertyInfo propertyInfo in type.GetProperties( BindingFlags.Public  BindingFlags.Static ) )&lt;br /&gt;{&lt;br /&gt;if( propertyInfo.PropertyType == typeof( SolidColorBrush ) )&lt;br /&gt; Add( new MyBrush( propertyInfo.Name, ( SolidColorBrush )propertyInfo.GetValue( null, null ) ) );   &lt;br /&gt;}&lt;br /&gt;}&lt;br /&gt;}&lt;br /&gt;&lt;br /&gt;MyBrush.CS class should be like this.&lt;br /&gt;&lt;br /&gt;public class MyBrush&lt;br /&gt;{     &lt;br /&gt;private string m_name;  &lt;br /&gt;private SolidColorBrush m_brush;&lt;br /&gt;public string Name  &lt;br /&gt;{    &lt;br /&gt;get     &lt;br /&gt;{       &lt;br /&gt;return m_name;     &lt;br /&gt;}    &lt;br /&gt;set     &lt;br /&gt;{         m_name = value;     &lt;br /&gt;}  &lt;br /&gt;}  &lt;br /&gt;public SolidColorBrush Brush  &lt;br /&gt;{    &lt;br /&gt;get     &lt;br /&gt;{       &lt;br /&gt;return m_brush;     &lt;br /&gt;}  &lt;br /&gt;}  &lt;br /&gt;public MyBrush(string name, SolidColorBrush brush )  &lt;br /&gt;{    &lt;br /&gt;m_name = name;    &lt;br /&gt;m_brush = brush;    &lt;br /&gt;Color color = brush.Color;  &lt;br /&gt;}   &lt;br /&gt;}&lt;br /&gt;&lt;br /&gt;Now you can get System brushes list using our IEnumerable class MyBrushList.&lt;br /&gt;&lt;br /&gt;I hope you may got idea. if not Please don't hesitate to post your comments here.&lt;/mybrush&gt;&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/01/how-can-i-get-system-brushes-list-in.html</link><thr:total>3</thr:total><author>noreply@blogger.com (Venugopal)</author></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-2748846470874858588.post-8051403737716698411</guid><pubDate>Sat, 05 Jan 2008 09:46:00 +0000</pubDate><atom:updated>2008-02-05T01:52:50.458-08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Host WPF Controls In WinForms Application</category><title>How Can I Host WPF Controls In WinForms Application</title><description>First add references to the WPF namespaces (PresentationCore, PresentationFramework, UIAutomationProvider, UIAutomationTypes, and WindowsBase). Next create an instance of the ElementHost control and the control you wish to embed in the Windows Forms application and then hook that control up to the ElementHost control. Then simply add the ElementHost control to your Forms control collection:&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;ElementHost host = new ElementHost();&lt;br /&gt;System.Windows.Controls.ListBox wpfListBox =&lt;br /&gt;new System.Windows.Controls.ListBox();&lt;br /&gt;&lt;br /&gt;for (int i = 0; i &lt; 10; i++)&lt;br /&gt;{&lt;br /&gt;wpfListBox.Items.Add("Item " + i.ToString());&lt;br /&gt;}&lt;br /&gt;&lt;br /&gt;host.Dock = DockStyle.Fill;&lt;br /&gt;host.Controls.Add(wpfListBox);&lt;br /&gt;this.panel1.Controls.Add(host);&lt;br /&gt;&lt;br /&gt;However, if you want to use XAML to describe the WPF control that you want to use in the Windows Forms application, you would need to add an Avalon UserControl item to your project. This will create a UserControl1.xaml file and a UserControl1.xaml.cs file. You can then modify the UserControl1.xaml file to contain whatever XAML you wish to describe your control. Then you would simply create an instance of this control and add it to the ElementHost control as in the above example:&lt;br /&gt;&lt;br /&gt;ElementHost host = new ElementHost();&lt;br /&gt;UserControl1 uc1 = new UserControl1();&lt;br /&gt;host.Controls.Add(uc1);&lt;br /&gt;host.Dock = DockStyle.Fill;&lt;br /&gt;this.panel1.Controls.Add(host);&lt;br /&gt;&lt;br /&gt;In addition, you will need to modify the project file because the Windows Application does not what to do with the XAML file. You will need to open the project file (.csproj, .vbproj, etc.) in an editor like Notepad and then scroll to the bottom.&lt;br /&gt;You will see the following line:&lt;br /&gt;&lt;br /&gt;&amp;lt;Import Project="$(MSBuildBinPath)\Microsoft.CSharp.targets" /&amp;gt;&lt;br /&gt;You will need to copy this line and paste it just below the above line and then change "CSharp" to "WinFX" so that the two lines look like:&lt;br /&gt;&lt;br /&gt;&amp;lt;Import Project="$(MSBuildBinPath)\Microsoft.CSharp.targets" /&amp;gt;&lt;br /&gt;&amp;lt;Import Project="$(MSBuildBinPath)\Microsoft.WinFx.targets" /&amp;gt;&lt;br /&gt;Now save this file and reload the project using VS and run the application.&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;Thanks,&lt;br /&gt;Venugopal.&lt;div class="blogger-post-footer"&gt;If you have comments or if you have any questions that are not answered by this post please put them as a comment. It will be great useful for me to cover in my next post.&lt;/div&gt;</description><link>http://venugopal-wpfandxaml.blogspot.com/2008/02/how-can-i-host-wpf-controls-in-winforms.html</link><thr:total>1</thr:total><author>noreply@blogger.com (Venugopal)</author></item></channel></rss>