ClientUI Learning Guide and Resources

Along with the service pack release and new support center launch last week, we have made available a vast array of resources for ClientUI, including few dozens of conceptual topics, hundreds of walkthroughs, and a handful of getting started videos. You can access the support page dedicated for ClientUI here, and the online product documentation here.

Although the documentation has been neatly organized based on the topic category, locating a certain topic may take sometime due to the comprehensiveness of the documentation. In this blog post, I’m going to outline some of the topics that I think interesting for both beginners and advanced Silverlight and WPF developers. Let’s get it started.

Introduction to ClientUI

Learn the basic concepts and the philosophy behind the ClientUI architecture, such as the comprehensive application framework in addition to the rich controls. Also learn about unified development model in ClientUI which enables you to develop solutions for both Silverlight and WPF using both shared XAML and API.

• ClientUI Multi-series Blogs
• Introduction to ClientUI
• Unified Development Model
• ClientUI Architecture Overview
• System Requirements
• Supported Development Environment

Getting Started Walkthroughs

Jump start your Silverlight and WPF projects using the installed ClientUI templates. Also learn how to create basic applications using ClientUI controls with MVVM pattern.

• Walkthrough: Create New Silverlight Project from Project Templates
• Walkthrough: Create New WPF Project from Project Templates
• Walkthrough: Create Your First ClientUI Application
• Walkthrough: Create Your First ClientUI Application using MVVM Pattern
• Walkthrough: Create Basic Website Navigation Application
• Walkthrough: Create Basic Navigation Application using MVVM Pattern
• Walkthrough: Create Line-of-Business Navigation Application using MVVM Pattern
• Walkthrough: Create Rich Application using Windowing and MVVM Pattern

Getting Started Videos

Preferred to watch the walkthrough videos with voice narration instead of reading text? Then check out the getting started videos below. Notice that several MVVM walkthroughs are divided into multi-series videos, so that you can skip the earlier series if you already familiar with it.

• Create Your First ClientUI Application
• Create Your First ClientUI Application Using MVVM Pattern – Part I – Preparing Project
• Create Your First ClientUI Application Using MVVM Pattern – Part II – Implementation
• Create Basic Website Navigation Application
• Create Basic Navigation Application Using MVVM Pattern – Part I – Preparing Project
• Create Basic Navigation Application Using MVVM Pattern – Part II – Implementation
• Create Line-of-Business Navigation Application using MVVM Pattern – Part I – Preparing Project
• Create Line-of-Business Navigation Application using MVVM Pattern – Part II – Implementing Model and Views
• Create Line-of-Business Navigation Application using MVVM Pattern – Part III – Implementing View Model and Binding
• Create Rich Application using Windowing and MVVM Pattern – Part I – Preparing Project
• Create Rich Application using Windowing and MVVM Pattern – Part II – Implementation

Commanding and MVVM Pattern

All you need to know about commanding and MVVM pattern in one place. Learn the basics of commanding and why you should use commanding in your application. Also learn the fundamentals of MVVM pattern with illustrated charts followed with a host of MVVM examples.

• Commanding Overview
• Hybrid Commands
• Walkthrough: Create Consistent UI for Rich Text Editor using Routed Command
• Walkthrough: Create Windows 7 Explorer UI using Hybrid Command
• Walkthrough: Change Data Source from ViewModel using DelegateCommand
• Commanding How-to Topics
• MVVM Pattern Overview
• Advanced MVVM
• Walkthrough: Use Command Binding and Key Binding with MVVM Pattern
• Walkthrough: Create Contact Editing Form using MVVM Pattern
• More MVVM Pattern Walkthroughs
• MVVM Pattern How-to Topics

Navigation Framework

In my previous ClientUI blog on navigation, I have described the outlines of the ClientUI navigation features such as the child navigation, role-based security and more. Many of these navigation features are discussed more deeply in the conceptual topics, walkthroughs and how-to topics listed below. Learn the supported navigation topologies, navigation hosts and navigation source support, navigation events and lifetime, and learn how to use navigation commands and more.

• Navigation Overview
• Advanced Features in ClientUI Navigation Framework
• Walkthrough: Create Simple Website Navigation Using Frame, Navigation Button and Hyperlink
• Walkthrough: Customize Visual Effect for Page Transitions
• Walkthrough: Configure Nested Navigation Frame to Support Browser-Journal Integration
• Walkthrough: Enable Authentication and Role-based Security to a Page using WCF Authentication Service
• Walkthrough: Edit the Navigation Button Template in Blend Designer
• Navigation How-to Topics

Application Framework

In the part 1 of my ClientUI blogs, I have touched the surface of the application framework in ClientUI. The most recent version of the ClientUI documentation now covers the basic concepts and architecture of the application framework, illustrated with many nice graphics and class diagrams. Learn how to easily write composite application for Silverlight and WPF in XAML declarative manner – without have to deal with MEF or tons of code. Also learn the best practice to partition your applications into smaller shareable modules for best performance, something not available in Silverlight or other solutions.

• Application Framework Overview
• ClientUI Application Services
• How-to: Implement IShellManager to Handle Application-wide Events
• How-to: Save and Load an Application-specific Settings
• How-to: Navigate to a Page in External ApplicationPackage with Direct URI
• How-to: Navigate to a Page in External ApplicationPackage with Shell Integration
• How-to: Map an ApplicationPackage to a Virtual URI for User-friendly Navigation
• How-to: Launch a Window in External ApplicationPackage

Drag-drop Framework

In several of my previous blog posts, I have outlined that many of the UI controls in ClientUI support fluid drag-drop and animation. Many of these stunning drag-drop effects are actually powered by the drag-drop framework available in the core of the ClientUI architecture itself. Learn how to take advantage of the powerful ClientUI drag-drop framework in your application. And if you haven’t aware, our drag-drop framework supports unified API between Silverlight and WPF where it supports data objects, visual hints, and we even bring the WPF-style DoDragDrop API down to Silverlight. Too good to be true? Check the topics below.

• Drag-drop Framework Overview
• Walkthrough: Enable Simple Drag Drop between Two Visual Elements
• Walkthrough: Customize Shadow Element during Drag Event
• Walkthrough: Perform Copy Operation during Drop Event
• Walkthrough: Customize Drag-able Area using DragDropPoint
• Walkthrough: Perform Drag-drop using API
• How-to: Drag an UIElement using API
• How-to: Store Data Object at Drag Init Event
• How-to: Enable Drag Drop to Standard ListBox using UXPanel
• Drag-drop Framework How-to Topics

Windowing Framework and User Experiences

In the part 7 of my ClientUI blogs, I have outlined many of the key features related to the windowing, dialog boxes, and desktop-style application development in ClientUI. Since then, we have made available a host of new walkthroughs and conceptual topics arranged in better flow – discussing from the windowing fundamentals then down to the implementation and examples. Also learn how to integrate the desktop to task bar, open a new window using command, and perform advanced operations related to the task bar and the desktop.

• Window and Dialog Boxes Overview
• Advanced Window Features
• User Experiences Overview
• Walkthrough: Create Rich Application using Windowing and MVVM Pattern
• Walkthrough: Add New Item such as Page, Dialog Box and Window
• Walkthrough: Create Windows 7 Explorer UI using Hybrid Command
• Walkthrough: Create Contact Editing Form using MVVM Pattern
• Walkthrough: Style a Window in Blend Designer
• Window and Dialog Boxes How-to Topics

ClientUI Control Library

With thoughtfully designed architecture from the ground up, plus 180+ controls for both Silverlight and WPF, ClientUI takes the rich UI development to a whole new level blowing off the competition few milestones away. So what does this all mean to developers? It could be a lot of things, from increased productivity to added new value to killer next-generation apps and more. The most important thing is that you get the tools right in your toolbox anywhere and anytime you need it. Forget about spending time looking for plumbing code just to make MVVM work, or other unproven workarounds.

• Button Controls Overview
• Content Controls Overview
• UI Controls Overview
• Input Controls Overview
• Layout Panels Overview
• Navigation Controls Overview
• Windowing Controls Overview
• Toolbar and Menu Controls Overview
• Advanced Content Controls Overview
• Multimedia Controls Overview
• Dock Controls Overview

More on ClientUI Fundamentals

Still looking to learn ClientUI architecture in even more details? Then please head straight to ClientUI Fundamentals.

 

---

Hopefully the list above helps you quickly getting started with application development using ClientUI. We welcome your feedback and requests for additional topics or walkthroughs.

 

All the best,
Jimmy