Book Image

Silverlight 4 User Interface Cookbook

By : Vibor Cipan (EUR)
Book Image

Silverlight 4 User Interface Cookbook

By: Vibor Cipan (EUR)

Overview of this book

Silverlight makes it much easier to build web applications with highly usable, interactive, and exciting user interfaces. However, with so many new options open to designers and developers, making the best use of the tools available is not always so easy. It's ease of use and rapid development process has left one area completely uncovered— how to design, build, and implement professional and usable interfaces, and create an enjoyable user experience and interaction. Written by a Microsoft MVP and Silverlight Prototyping Specialist, this book is the first and only book on developing Silverlight User Interfaces. Clear, step-by-step instructions show how to build all the user interface elements that users look forward to in a cutting edge app. This book offers essential recipes, with each recipe depicting the commonly used user interface patterns built with Silverlight, and in some cases, with WPF to showcase the possibilities. The author's experience in designing and developing user interfaces enables him to share insights on creating professional interfaces in a clear and friendly way. The book starts off with recipes dealing with fixed and fluid layouts, building custom command link controls, working with navigation, and collapsible panels, and then moves on to the more advanced topics such as calendars, alternating row colors, and task panes. The author covers a number of different UI patterns, controls, and approaches accompanied by XAML and C# code where needed (and explained), along with usage context and practical, proven, and professional techniques for specific controls and patterns. From maps to task panes, and web cam support to pixel shaders, this Cookbook provides you with a rich selection of Silverlight UI recipes. It covers all that you need to know in order to design and implement a user interface, together with professional user experience and interface guidelines to make your solutions and applications pleasurable for your users.The author has found himself in the role of both, a designer and a developer, at different points in his professional career, and his motive was to create a book that will serve as a useful resource for designers and developers trying to find their way with Silverlight and Expression Blend.By the end of the book, you will be able to create a rich, professional, and standards-compliant user interface.
Table of Contents (13 chapters)
Silverlight 4 User Interface Cookbook
Credits
Foreword
About the Author
Acknowledgement
About the Reviewers
Preface

Preface

This book offers a number of tutorial-based recipes with each recipe depicting one of the commonly used user interface patterns built with Silverlight (and in some cases with WPF just to showcase the possibilities). Each recipe takes a step-by-step approach, first giving you the idea what is the recipe about, followed by the steps needed to be executed. The chapter then explains about the recipe, context for its usage and, last but not the least, the professional user interface and user experience guidelines.

From discussion and recipes dealing with fixed and fluid layouts, sample data generation, and building the custom command link controls, to the more advanced and somewhat avant-garde topics covering the usage and implementation of webcam and printing support and pixel shader effects this book is covering all you need to know to properly design and implement your user interface together with professional user experience and interface guidelines to make your solutions and apps pleasurable for your users.

What this book covers

Chapter 1, Layouts and General Content Organization gives you an introduction to the different ways of content and interface organization. Not only covering the topics of when to use fixed and fluid layouts, but also content organization with tabs and other available controls, this chapter is fundamental in many aspects.

Chapter 2, Actions and Commands gives you recipes and patterns involving regular buttons, progress bars, and list boxes. It covers ground touching many different patterns for bringing your UI to life and keeping your users happy and informed. You can also learn how to build your own custom control and expose its properties.

Chapter 3, Searching, Finding, and Navigating teaches you how to architect your application's UI. By introducing you to the concepts of faceted navigation, prominent action points, titled sections, it gives you a precise guide on how and when to use specific Silverlight controls to build your desired UI.

Chapter 4, Date and Time Input, Tables, and Ratings will show you how to use form elements to build usable and flexible date, time and calendar interfaces. Special attention is given to the globalization and related guidelines. Also, this recipe covers dealing with long lists it will show you how real-life metaphors are used in modern UIs.

Chapter 5, Maps, Pop-up Windows and Escaping the Browser showcases some of the more modern UI patterns possible with Silverlight. It also covers fundamental but often overlooked pattern called progressive disclosure. Looking at adding mapping capabilities to your application or to run and use your Silverlight application out of the browser? Those patterns are covered in this chapter.

Chapter 6, New Controls and Avant-garde Features will show you how to use some of the coolest new Silverlight features. For example, PathListBox enables you to abandon classical, rectangular appearance of the ListBox container, while pixel shaders and effects can add some extra fun to your applications. Now add support for webcam and printing and you'll be able to build really rich and immersive experiences with Silverlight.

What you need for this book

This book uses Expression Blend 4 for virtually all recipes in it. You might find it useful to use Visual Studio 2010 (or one of its free "express" editions) for better code editing and development experience, but Expression Blend 4 should be your first choice for this book.

Though the book covers mostly Silverlight 4 and the user interface patterns and user experience guidelines are referring to Silverlight, first few chapters utilize WPF 4 (Windows Presentation Foundation) technology. Almost all ideas, approaches, methods, and guidelines applicable to WPF are also applicable to Silverlight itself.

In order to use and follow all recipes, be sure that, apart from Expression Blend 4 you have installed Silverlight Toolkit. Silverlight toolkit adds support for numerous additional controls of your Silverlight 4 controls. You can get it from http://silverlight.codeplex.com.

The last part of the book showcases usage of the PathListBox control. This control supported under Silverlight 4 is not (at the moment of writing this book) part of the Silverlight or Silverlight Toolkit. Also, effects, pixel shaders, and numerous other features are available to you when you install Expression Blend 4 SDK for Silverlight 4 available for free from: http://www.microsoft.com/downloads/details.aspx?FamilyID=d197f51a-de07-4edf-9cba-1f1b4a22110d&displaylang=en (short link: http://bit.ly/9KaiIG).

Who this book is for

This book is targeted at both designers and developers. As an author, I've found myself in both roles at different points within my professional career and my intrinsic motivation was to create a book that will serve as a useful resource for designers and developers finding their way with Silverlight and Expression Blend.

Developers will find described UI techniques to be useful for them especially the specific and professional design and user experience guidelines for described patterns and controls. Also, they will understand how to use Expression Blend as a design environment while still being able to safely resort to their more natural Visual Studio environment to write and test code logic.

Designers will benefit from this cookbook as Silverlight is still gaining traction amongst them. While most designers are skilled with Flash or Photoshop, Silverlight and Expression Blend are still not their primarily designing environments and tools. With this book they will not only learn enough about technical side of the story but also many design related techniques, approaches, and guidelines while also getting the chance to understand interaction, code-based side of the story.

In my opinion, I believe that the biggest value of this book lies in the numerous guidelines, ideas, methods, and approaches described. They are all here to help you build and implement great user experiences and to make your users happy, satisfied, and passionate about your products and services.

Conventions

In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text are shown as follows: "Now save all your files and go to the Window1.xaml file (basically, your main file)."

A block of code is set as follows:

<ColumnDefinition Width="0.5*"/>
<ColumnDefinition Width="0.5*"/>

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

private void expOptions_Collapsed(object sender,RoutedEventArgs e)
{
this.expOptions.Header = "Show advanced options";
}

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: "LayoutRoot is a grid control hosted in UserControl".

Note

Warnings or important notes appear in a box like this.

Note

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an e-mail to, and mention the book title via the subject of your message.

If there is a book that you need and would like to see us publish, please send us a note in the SUGGEST A TITLE form on www.packtpub.com or e-mail.

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Note

Downloading the example code for the book

You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books maybe a mistake in the text or the code we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/support, selecting your book, clicking on the errata submission form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded on our website, or added to any list of existing errata, under the Errata section of that title. Any existing errata can be viewed by selecting your title from http://www.packtpub.com/support.

Piracy

Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.

Please contact us at with a link to the suspected pirated material.

We appreciate your help in protecting our authors, and our ability to bring you valuable content.

Questions

You can contact us at if you are having a problem with any aspect of the book, and we will do our best to address it.