Flash skills for silverlight design and development (30 Abr 2010)
1. Ricardo Castelhano Flash Skills Applied to Silverlight Design and Development WUX221 ITech4All ricardo.castelhano@itech4all.com @RicCastelhano http://www.ricardocastelhano.com
2. >10 Years Working for a Web with Plugins Adobe Flash Beta-Tester since CS3 “Silverlight’ing” since the Beginning Blogger & Tweeterian (XAMLPT / RIAPT / AUG / PontoNetPT) Partner & Consultant @ ITech4All Ricardo Castelhano
3. Framework Design and Development Tools Programming Languages Mapping Silverlight and Flash Declarative Animation Procedural Animation Flash Skills Applied to Silverlight Design and Development
4. Framework Design and Development Tools Programming Languages Mapping Silverlight and Flash Declarative Animation Procedural Animation Flash Skills Applied to Silverlight Design and Development
13. Framework Design and Development Tools Programming Languages Mapping Silverlight and Flash Declarative Animation Procedural Animation Flash Skills Applied to Silverlight Design and Development
16. Framework Design and Development Tools Programming Languages Mapping Silverlight and Flash Declarative Animation Procedural Animation Flash Skills Applied to Silverlight Design and Development
17. Programming Languages Common Language Runtime (CLR) C# Visual Basic Dynamic Language Runtime (DLR) Ruby Python Jscript
18. Programming Languages Common Language Runtime (CLR) C# Visual Basic Dynamic Language Runtime (DLR) Ruby Python Jscript XAML
20. Programming Languages C# DataTypes Classes and Objects Assemblies Handler XML Integration Multiple Threads Generics Reflection Dependency Properties LINQ – XML, Objects, JSON
21. Framework Design and Development Tools Programming Languages Mapping Silverlight and Flash Declarative Animation Procedural Animation Flash Skills Applied to Silverlight Design and Development
25. Framework Design and Development Tools Programming Languages Mapping Silverlight and Flash Declarative Animation Procedural Animation Flash Skills Applied to Silverlight Design and Development
28. Framework Design and Development Tools Programming Languages Mapping Silverlight and Flash Declarative Animation Procedural Animation Flash Skills Applied to Silverlight Design and Development
33. Other “Blend” Sessions Introdução ao Silverlight 4 Dia 20 – Sala3.2 – 12:45 Developing Silverlight 4 Solutions with Blend 4 Dia 20 – Sala2.5 – 12:45 SketchFlow: Do protótipo à Produção Dia 20 - Sala2.5 - 14:15 SketchFlow no Desenho de Interfaces Web Dia 20 – Sala20/10 - 15:15 Utilizando SketchFlow na Construcção de sites em Silverlight Dia 20 – Sala20/10 - 15:15 Dynamic Layout and Transitions for Silverlight 4 with Blend 4 Dia 20 - Sala2.5 - 17:00 Silverlight: Extensibility Framework + Behaviors Dia 22 - Sala2.3 - 16:40
34.
35.
36. Ricardo Castelhano Flash Skills Applied to Silverlight Design and Development WUX221 ITech4All ricardo.castelhano@itech4all.com @RicCastelhano http://www.ricardocastelhano.com
Hinweis der Redaktion
Flash Platform and Silverlight are both “Single Framework” for Graphics
Flash Platform and Silverlight are both “Single Framework” for Media
Flash Platform and Silverlight are both “Single Framework” for ApplicationsHowever, FlashPlatform also has the Flex Framework ... Not a real “Single Framework”.
Both plugins work inside the browser sandbox
Both plugins must be instantiated in the HTML
- Silverlight is also Out-Of-Browser with support for COM InterOp and possibility to be a full-trust app. In a FullTrustApp, we even may include a WebBrowser control and therefore include any HTML webpage inside Silverlight and even a SWF
Silverlight for Linux is being ported by Novell in a project called “Moonlight”.
Nowadays, Google is working with Microsoft for a “perfect” experience with Silverlight in Google Chrome browser
Blend is somewhat similar to FlashProfessional IDE
And VisualStudio is to Silverlight as FlashBuilder is to FlashPlatform
From all the available languages for Silverlight development, C# is more easy to “port” from a ActionScript3 background
XAML is the declarative language for Silverlight, WPF, Surface and WindowsPhone7. It may be compared with MXML from Flex Framework
C# is “more” Strong-typed then ActionScript3 and there are more DataTypes then in ActionScript3 as wellBoth languages are OOP focused, therefore you dont have to change your mindsetIn ActionScript3 we have Packages and NameSpaces, in C# we have Assemblies, diferent name for the same thingAn Event Handler works the same way as a ActionScript3 Event Listener. If you are developing for Silverlight it will do “Bubbling”, if you are developing for WPF it will do “Bubbling” and “Tunneling”.Silverlight has full XML Integration.
Silverlight has Multiple Threads: UI (storyboards, renderings,...) / BackgroundWorker / ThreadSilverlight also has Generics - Concept of type parameters, which make it possible to design classes and methods that defer the specification of one or more types until the class or method is declared and instantiated by client codeThese 2 doesnt exists in FlashPlatform or FlexFramework, so it may be strange at the first “runs” for a “Flasher” or “Flexer”.Reflection lets you know more information at runtime about your objects.Dependency Properties are properties to “own” you may do DataBinding and also animate theirs values. They are similar to Flex.LINQ – in ActionScript3 we have E4X and it is similar to LinqToXML with the diference that LinqToXML works with SQL sintaxe. However we may also use LINQ to query Objects and JSON
For Silverlight to works as in Flash, we need to use a Canvas Control. Take note that in Silverlight the positioning doesn’t starts in the Child but in the Parent. Therefore we will have a Canvas.SetTop and Canvas.SetLeft.Also take note that in Silverlight we have more Layout Controls so, you should use the right control for the right job !! Don’t stick with Canvas all the time, remember it is the less effective Layout Control of all.
If you think of UserControls the same way you think on MovieClips, you are in the right track !!!Check the Project Rosetta website for more info about the UserControls properties mapped to MovieClips properties
Think of Controls as FlashPlatform or FlexFramework Components. Remember that Styles only applies to properties and Skins are Templates, reusable in multiple controls
“Declarative animation” is XAML code for animations, known as Storyboards. Storyboards have properties like Name, AutoReverse, RepeatBehavior and they are TimeBased.If you use Blend for generating the XAML code, you will be working in an environment similar to Flash Timelines.The animated property type will declare the type of the animation, so you will have DoubleAnimation, ColorAnimation, DoubleAnimationUsingKeyFrame, ...
Demo1: A simple Storyboard animationDemo2: Using a Storyboard inside a UserControl. In the CodeBehind will add that UserControl to LayoutRoot with the MouseMove trigger. Show how to add and remove UserControls; add and remove EventHandlers
In CodeBehind we also have the possibility to create Storyboards, but they are too much “preset”. If you want to do some code animations as you may be doing in ActionScript3, you will need to know the equivalent for ENTER_FRAME event, and the name is CompositionTarget.Rendering
Please provide feedback !!! That’s the only way to know what you would like to see on a future session about Blend and to improve myself as a speaker.Thank you.