Adam Nathan. Silverlight 1.0 UNLEASHED. 800 East 96th Street, Indianapolis, Indiana USA

Size: px

Start display at page:

Download "Adam Nathan. Silverlight 1.0 UNLEASHED. 800 East 96th Street, Indianapolis, Indiana USA"

Cornelius Park
5 years ago
Views:

2 Adam Nathan Silverlight 1.0 UNLEASHED 800 East 96th Street, Indianapolis, Indiana USA

3 Silverlight 1.0 Unleashed Copyright 2008 by Sams Publishing All rights reserved. No part of this book shall be reproduced, stored in a retrieval system, or transmitted by any means, electronic, mechanical, photocopying, recording, or otherwise, without written permission from the publisher. No patent liability is assumed with respect to the use of the information contained herein. Although every precaution has been taken in the preparation of this book, the publisher and author assume no responsibility for errors or omissions. Nor is any liability assumed for damages resulting from the use of the information contained herein. ISBN-13: ISBN-10: Nathan, Adam. Library of Congress Cataloging-in-Publication Data Silverlight 1.0 unleashed / Adam Nathan. p. cm. ISBN Silverlight (Electronic resource) 2. Multimedia systems. 3. Web sites--design. 4. Application software--development. I. Title. QA N dc22 Printed in the United States of America First Printing: October Trademarks All terms mentioned in this book that are known to be trademarks or service marks have been appropriately capitalized. Sams Publishing cannot attest to the accuracy of this information. Use of a term in this book should not be regarded as affecting the validity of any trademark or service mark. Warning and Disclaimer Every effort has been made to make this book as complete and as accurate as possible, but no warranty or fitness is implied. The information provided is on an as is basis. The author and the publisher shall have neither liability nor responsibility to any person or entity with respect to any loss or damages arising from the information contained in this book. Bulk Sales Sams Publishing offers excellent discounts on this book when ordered in quantity for bulk purchases or special sales. For more information, please contact U.S. Corporate and Government Sales corpsales@pearsontechgroup.com For sales outside of the U.S., please contact International Sales international@pearsoned.com Acquisitions Editor Neil Rowe Development Editor Mark Renfrow Managing Editor Gina Kanouse Project Editor Betsy Harris Copy Editor Rhonda Tinch-Mize Indexer Erika Millen Proofreader Kathy Bidwell Technical Editor Dave Relyea Publishing Coordinator Cindy Teeters Book Designer Gary Adair Compositor codemantra

4 Contents at a Glance Introduction...1 Part I Fundamentals 7 1 Getting Started XAML...39 Part II Creating Static Content 59 3 Shapes, Lines, and Curves Text Brushes and Images Positioning and Transforming Elements Part III Making Your Content Come to Life Responding to Input Events Downloading Content on Demand Animation Audio and Video Index...233

5 Table of Contents Introduction 1 Part I Fundamentals 7 1 Getting Started 9 Embedding the Silverlight Control Manually...14 Letting Silverlight.js Handle the Dirty Work...17 Silverlight.createObject...18 Silverlight.createObjectEx...19 Putting It All Together...20 Understanding Your Hosting Options...23 source...23 Properties...25 Events...30 Interacting with the Silverlight Control Programmatically...33 The Settings Property...34 The Content Property...35 Other Members...36 Conclusion XAML 39 Elements and Attributes...40 The XML Namespace...41 Property Elements...42 Type Converters...43 Children of Object Elements...44 The Content Property...44 Items in a Collection...45 Attached Properties...46 The Relationship Between XAML and JavaScript...47 Interacting with Elements Defined in XAML...48 Generating XAML Dynamically...54 Conclusion...57

6 Contents v Part II Creating Static Content 59 3 Shapes, Lines, and Curves 61 Basic Shapes...62 Rectangle...62 Ellipse...63 Polygon...65 Lines and Curves...67 Line...67 Polyline...68 Path...69 Geometries...69 Using a Geometry for Clipping...70 PathGeometry...71 GeometryGroup...74 Representing Geometries as Strings...76 Strokes...78 Line Caps...79 Line Joins...79 Dashes...80 Conclusion Text 83 Customizing Text Display...84 Basic Font Properties...84 Additional Customizations...87 Retrieving TextBlock Dimensions...88 Creating Rich Text Content...89 Run...89 LineBreak...91 Using Custom Fonts...92 Downloading Custom Fonts...92 Using the Glyphs Element...94 Converting Text into a Path...96 Conclusion Brushes and Images 99 SolidColorBrush LinearGradientBrush RadialGradientBrush ImageBrush and Image VideoBrush Brushes as Opacity Masks Conclusion...115

7 vi Silverlight 1.0 Unleashed 6 Positioning and Transforming Elements 117 All About Canvas Positioning Elements Placing Elements Behind or in Front of Others Controlling Size and Clipping Creating Maintainable User Interfaces with Multiple Canvas Elements Applying Transforms RotateTransform ScaleTransform SkewTransform TranslateTransform MatrixTransform Combining Transforms Conclusion Part III Making Your Content Come to Life Responding to Input Events 143 About Silverlight Events Event Handlers Attaching Event Handlers to Events Mouse Events Bounds and Hit Testing More About the Mouse Pointer Event Bubbling Capturing the Mouse Putting It All Together: Building a Scrollbar Using Silverlight s Stylus Support Keyboard Events The Basics Finding Out What Keys Were Pressed Using Full-Screen Mode Conclusion Downloading Content on Demand 179 Initiating a Download Using the Downloaded Content Downloading Multiple Items Simultaneously in a.zip File Displaying a Progress Bar A Simple Progress Bar Progress Bar Customizations Conclusion...189

8 Contents vii 9 Animation 191 Introducing Animations Performing Animation By Hand Performing Animation with Silverlight Support Interacting with Animations from JavaScript Functions for Controlling a Storyboard The Completed Event Tweaking the Animation Timeline BeginTime SpeedRatio AutoReverse RepeatBehavior FillBehavior More About Storyboards Specifying the Target Property Specifying the Target Object Treating a Storyboard Like an Animation Keyframe Animations Linear Keyframes Spline Keyframes Discrete Keyframes Conclusion Audio and Video 219 Playing Audio and Video with MediaElement The Source Property Visual Effects Audio-Specific Features Video-Specific Features Progressive Download Versus Streaming Controlling Audio and Video with JavaScript Changing the Media s State Basic Media Events Positioning the Audio or Video Using Timeline Markers Building a Media Player User Interface Using Expression Encoder Conclusion Index 233

9 About the Author Adam Nathan is a senior software development engineer for Microsoft and the founding developer of Popfly, Microsoft s first product built with Silverlight. He is the author of the best-selling Windows Presentation Foundation Unleashed (Sams, 2006),.NET and COM: The Complete Interoperability Guide (Sams, 2002), a coauthor of ASP.NET: Tips, Tutorials, and Code (Sams, 2001), and a contributor to books such as.net Framework Standard Library Annotated Reference, Vol. 2 (Addison-Wesley, 2005) and Windows Developer Power Tools (O Reilly, 2006). Adam regularly speaks at development conferences and to internal groups within Microsoft about a variety of.net topics. Having started his career on Microsoft s Common Language Runtime team in 1999, Adam has been at the core of.net technologies since the very beginning. Adam is also the creator of popular tools and websites for.net developers, such as PINVOKE.NET (and its Visual Studio add-in). You can find him online at

10 Dedication To Lindsay and Tyler.

11 Acknowledgments As always, I give the most thanks to my wife, Lindsay, for her never-ending patience and support. I keep saying that I m never going to write another book, but somehow I end up getting convinced to write one anyway! And yet, despite all my flaws, we re still married. Her thoughtfulness and dedication are remarkable and are just two of the many lessons I ve learned from her. Without her, none of this would be possible. Although most of the process of writing a book is very solitary, this book came together because of the work of many talented and hardworking people. I d like to take a moment to thank some of them by name. Dave Relyea from the Silverlight team did a fantastic job as the technical editor for this book. Many other Microsoft co-workers graciously agreed to review chapters as I wrote them. I d like to especially thank Tim Rice, who provided a huge amount of valuable feedback on technical details, grammar, and everything else imaginable. Without Dave and Tim s help, this book wouldn t have turned out nearly as good as it did. I d also like to thank Andy Sterland, Patrick Wong, and Vinay Deo. I thank Paramesh Vaidyanathan for giving me permission to write this book in the first place, and Scott Guthrie for his support. I d like to sincerely thank the folks at Sams especially Neil Rowe because I couldn t have asked for a better publishing team. They gave me the complete freedom to write the kind of book I wanted to write. And, as with my WPF Unleashed book, they recognized the importance of full color printing and didn t even question doing it! Finally, I thank you for picking up a copy of this book and reading at least this far! I hope you continue reading and find the journey of exploring Silverlight as enjoyable as I have!

12 We Want to Hear from You! As the reader of this book, you are our most important critic and commentator. We value your opinion and want to know what we re doing right, what we could do better, what areas you d like to see us publish in, and any other words of wisdom you re willing to pass our way. As an Executive Editor for Sams, I welcome your comments. You can fax, , or write me directly to let me know what you did or didn t like about this book as well as what we can do to make our books stronger. Please note that I cannot help you with technical problems related to the topic of this book, and that due to the high volume of mail I receive, I might not be able to reply to every message. When you write, please be sure to include this book s title and author as well as your name and phone or fax number. I will carefully review your comments and share them with the author and editors who worked on the book. Mail: feedback@samspublishing.com Neil Rowe, Executive Editor Sams Publishing 800 East 96th Street Indianapolis, IN USA

13 This page intentionally left blank

14 Introduction IN THIS CHAPTER. Who Should Read This Book?. Software Requirements Thank you for picking up Silverlight 1.0 Unleashed! Silverlight is changing the way many people think about designing and developing websites or web applications, and this book helps you take advantage of everything Silverlight enables. Silverlight makes it easier than ever to create rich web-based content or applications. And given that it s possible to use Silverlight without expensive development or design tools, learning Silverlight is a wonderful way for everyone from hobbyists to professionals to create compelling software.. Code Examples. How This Book Is Organized. Conventions Used in This Book As Silverlight was developed, it was obvious that a new wave of books would appear in the marketplace. But it wasn t clear to me that these Silverlight books would have the right balance to guide people through the technology while showing practical ways to exploit it. Therefore, I wrote Silverlight 1.0 Unleashed with the following goals in mind:. To provide a solid grounding in the underlying concepts in a practical and approachable fashion. To answer the questions most people have when learning the technology, and to show how commonly desired tasks are accomplished. To be an authoritative source, thanks to input from members of the Silverlight team who designed, implemented, and tested the technology. To be clear about where the technology falls short, rather than selling the technology as the answer to all problems. To be an easily navigated reference that you can constantly come back to I hope you find this book to exhibit all these attributes.

15 2 Introduction Who Should Read This Book? This book is for software developers and designers who are interested in creating compelling web-based content, applications, or controls. This book contains a lot of content to help you get the most out of Silverlight, regardless of your prior experience with other technologies. And even if you are already well versed in Silverlight, I m confident that this book still has something to teach you. At the very least, it should be an invaluable reference for your bookshelf. To summarize, this book. Covers everything you need to know about Extensible Application Markup Language (XAML) in Silverlight. Examines the Silverlight feature areas in incredible depth: graphics, text, audio, video, animation, ink, events, and more. Demonstrates how to create reusable controls and perform common tasks (such as drag-and-drop) using basic building blocks. Explains how to download assets asynchronously to maximize your user experience. Demonstrates how to create hybrid applications that mix Silverlight content with HTML or Flash content in powerful ways. Highlights features scheduled for future versions of Silverlight while showing how to achieve your desired results with the current version Examples in this book appear in XAML, HTML, and JavaScript. You do not need to be familiar with these languages in order to understand this book. By focusing on version 1.0, this book clearly shows what you can and can t accomplish with the first version of Silverlight. If you are interested in learning about future Silverlight features in more depth, Windows Presentation Foundation (WPF) Unleashed provides a good preview of the direction Silverlight is heading (which is to more closely resemble the feature set of WPF). Software Requirements Three pieces of software are required to use the samples in this book:. Version 1.0 or later of Silverlight, which can be freely downloaded from An operating system supported by Silverlight. Version 1.0 supports Windows XP or later (including the non-ia64 server versions) and Mac OS X or later (either PowerPC or Intel). Future versions of Silverlight will support additional operating systems. (For example, the next version should support Windows 2000.) Note that the.net features in future versions of Silverlight may only support Intel Macs, but all the features in 1.0 are supported on both architectures.

16 How This Book Is Organized 3. A web browser supported by Silverlight. Version 1.0 supports Internet Explorer 6 or later, Firefox 1.5 or later, and Safari or later (on Mac OS X only). Future versions of Silverlight will support additional web browsers. If you want to run the samples on Linux instead, you can use Moonlight, Novell's open source implementation of Silverlight for Linux. The plan (not yet realized at the time of writing) is for Moonlight to run on all Linux distributions and support the Firefox, Opera, and Konqueror browsers. Although a lot of Silverlight development can be done with a simple text editor, you can be more productive with the following recommended software:. For developers, Microsoft Visual Studio 2008 or later, which can be a free Express edition downloaded from (Visual Studio 2005 can be used as well, but the JavaScript editor isn t as rich, and the XAML editor comes with a separate download the extensions for.net Framework 3.0 development available from MSDN.). For designers, Microsoft Expression Studio. Within this suite, Expression Blend is specifically designed for creating XAML-based user interfaces (whether based on Silverlight or WPF), even animated ones. Expression Encoder, covered in Chapter 10, Audio and Video, makes it easy to produce compelling even interactive audio and video content optimized for Silverlight. Code Examples The source code for examples in this book can be downloaded via or How This Book Is Organized This book is arranged into three parts: Part I: Fundamentals. Chapter 1: Getting Started. Chapter 2: XAML Part II: Creating Static Content. Chapter 3: Shapes, Lines, and Curves. Chapter 4: Text. Chapter 5: Brushes and Images. Chapter 6: Positioning and Transforming Elements

17 4 Introduction Part III: Making Your Content Come to Life. Chapter 7: Responding to Input Events. Chapter 8: Downloading Content on Demand. Chapter 9: Animation. Chapter 10: Audio and Video The first two chapters explain the fundamentals. Chapter 1 focuses on ways to get Silverlight content into a web page and your options for how it interacts with HTML. Chapter 2 explores XAML in great depth, giving you the foundation to understand the XAML you ll encounter in the rest of the book and in real life. Part II covers the variety of static content that Silverlight is capable of rendering. This not only includes text and images, but also sophisticated vector-based content. Chapter 6 ends Part II by showing how to arrange, resize, and even transform multiple pieces of content in rich ways. The final part of the book explains how you can make your otherwise static content come to life. Chapter 7 is the most important chapter for developers because Silverlight s input events make it possible to create an interactive application. Chapter 8 demonstrates how you can greatly improve the experience with large content by downloading it on-the-fly and showing slick progress indicators. And with animation, audio, and video (covered in Chapters 9 and 10), you can make your content or application quite stunning. Conventions Used in This Book Various typefaces in this book identify terms and other special items. These typefaces include the following: Typeface Italic Monospace Meaning Italic is used for new terms or phrases when they are initially defined, and occasionally for emphasis. Monospace is used for screen messages, code listings, and command samples, as well as filenames. In code listings, italic monospace type is used for placeholder text. Code listings are colorized similar to the way they are colorized in Visual Studio. Blue monospace type is used for XML elements and JavaScript keywords, brown monospace type is used for XML element names and JavaScript strings, green monospace type is used for comments, and red monospace type is used for XML attributes.

18 Conventions Used in This Book 5 Throughout this book, you ll find the following sidebar elements:. FAQ (Frequently Asked Question) is a sidebar that presents a question readers might have regarding the subject matter in a particular spot in the book then it provides a concise answer.. Digging Deeper sidebars present advanced or more detailed information on a subject than is provided in the surrounding text. Think of Digging Deeper material as stuff you can look into if you re curious, but can ignore if you re not.. Tips are bits of information that can help you in real-world situations. They often offer shortcuts or alternative approaches to make a task easier, quicker, or produce better results.. Warnings alert you to an action or condition that can lead to an unexpected or unpredictable result, and then tell you how to avoid it.. Looking Forward sidebars discuss upcoming functionality planned for future versions of Silverlight.

19 This page intentionally left blank

20 PART I Fundamentals IN THIS PART CHAPTER 1 Getting Started 9 CHAPTER 2 XAML 39

Introduction. Thank you for picking up Silverlight 1.0 Unleashed! IN THIS CHAPTER. . Who Should Read This Book?. Software Requirements

Introduction. Thank you for picking up Silverlight 1.0 Unleashed! IN THIS CHAPTER. . Who Should Read This Book?. Software Requirements Nathan_Intro_Iss 9/21/07 2:01 AM Page 1 IN THIS CHAPTER. Who Should Read This Book?. Software Requirements Thank you for picking up Silverlight 1.0 Unleashed! Silverlight is changing the way many people