Your SlideShare is downloading. ×
Expression Blend for Developers
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Expression Blend for Developers


Published on

Slide deck of presentation "Expression Blend for Developers" that was run during RDN Dev Day in Melbourne

Slide deck of presentation "Expression Blend for Developers" that was run during RDN Dev Day in Melbourne

Published in: Technology
1 Like
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide
  • I’m… I do… I can be contacted on…
  • Questions. I’ll defer long questions for the coffee/lunch break or if it’s a topic that’ll cover later. Put your mobiles on silenceFeel free to ask questions during the breaks
  • Who uses Silverlight and/or WPF? Stand up.What’s your primary way of working with UI (Raise hands) Blend VS Xaml EditorHand Coding XamlBlend (Stand up) Seen it Played with it Use it often Use it on a daily basisWho works with designers (just raising hands)
  • If the tool is so great, why few people use it? Not a lot of designer adoption in the WPF/SL space. Specially not using MS tools, most of them stick to Adobe tools. This isn’t something easy to change. Ideally we should involve designers and Blend is a great tool also for themSL/WPF have a new Xaml Parser. Blend uses now the same parser that is used at runtimeA lot of stability improvements in the latest versionBetter error report and handlingMost of the times it crashed was our own code. Blend uses Behaviors, Commanding and now has great support for MVVMThat’s just a ramp up time. I challenge you to try it for 5 days.
  • Create a projectShow the main panels -Projects, objects, propertiesToolboxSearch functionality in Toolbox, property panels and explain that it appears in othersHello world Naming controls Code behind intellisenseXamlintellisense Running the project
  • Transcript

    • 1. Expression Blend for Developers
      RDN Dev Day
    • 2. Hello World
      Mahesh Krishnan
      Principal Consultant
      Author: Silverlight 4 for Dummies
      Run VIC.NET Dev SIG & SDDN
    • 3. What are we doing?
      Type of presentation
      Bit of PowerPoint
      Lots of Demos
      No sales.
      No wow demos or 5 minutes demos.
      Useful Tips & Tricks.
    • 4. Rules
    • 5. Have you…?
    • 6. Agenda
      Session #1 – Intro and Blend Basics
      Morning Tea
      Session #2 – More Blend
    • 7. What is Expression Blend?
      Primary Tool for Designing User Interfaces
      Visually design UI – Blend creates XAML
      Better user experience than Visual Studio when working UI design
      You still need VS 2010 to do all the developer stuff
    • 8. Adoption
      Positioned as Design tool
      Messes with my Xaml
      Don’t want to learn a new tool
      I’m productive hand coding Xaml
      Not broadly adopted
      More stable now
      Let go
      Better support
      Don’t learn something different if you don’t need to do something different.
      Learning curve
    • 9. Blend vs Visual Studio
      When would you use Expression Blend?
      Prototyping UI
      User Interface design
      Writing small blocks of code
      Importing designs from Photoshop and Illustrator
      When would you use Visual Studio?
      Simple UI design
      Writing code
      Debugging, setting breakpoints, etc
      Integrating with other projects (.NET WCF Services, WCF, ...)
    • 10. BLEND
    • 11. Styling
      Allows re-use of look and feel across controls:
      Color, Font, Margins, etc
      Created as a resource:
      <Style x:Key="Style1" TargetType="TextBlock">
      <Setter Property="Foreground" Value="#FFF0D3D3"/>
      <Setter Property="FontSize" Value="36"/>
    • 12. Applying a Style
      Set using Styleproperty using the StaticResourcemark-up in XAML:
      Text="Hello World"
      Style="{StaticResource Style1}" />
    • 13. Skinning or Templating
      Allows you to change the complete appearance of the control
      Like Style, created as a resource:
      < Application.Resources>
      <ControlTemplate x:Key="MyTemplate" TargetType="Button">
      <Rectangle .../>
      <ContentPresenter ... Content="{TemplateBinding Content}" />
      < /Application.Resources>
    • 14. Applying the template
      Set using Templateproperty using the StaticResourcemark-up in XAML:
      Content="Click ME"
      Template="{StaticResourceMyTemplate}" />
    • 15. Parts and States Model
      States model breaks the Control down based upon its different states and how it should look for each state
      Parts model breaks the Control down into various parts and how each part should look
    • 16. Visual State Manager
      Manages states for a control
      Allows setting different State groups for a control
      Manages transition between states
      Controls the look and feel of the control when state transition occurs
      Allows designers to define state transition behaviour (usually done using Animation)
    • 17. The Parts Model – an example
    • 18. Animation
      Animation is created by quickly cycling through a series of images
      Each image is slightly different from the previous one
      Image is created by changing a (visual) property
      Basic animations works on properties of type:
    • 19. Basic Animation
      Container for animation
      Manages timeline. Can start, pause, stop animations
      xxxxAnimation (e.g. DoubleAnimation)
      Specify From, To and Duration
      Storyboard will do the interpolation
    • 20. Basic Animation
      XAML Syntax for Storyboard:
      <Storyboard x:Name="MyStoryboard">
      From="40" To="100"
    • 21. Key Frame Animation
      Animates between a series of values
      Can control their interpolation method
      Discrete, Linear, Splined
      Animation classes
      Supports Double, Color, Point and Object
    • 22. Key Frame Animation
      XAML Syntax for Storyboard:
      <Storyboard x:Name="MyStoryboard">
      <LinearDoubleKeyFrame Value="140" KeyTime="0:0:0"/>
      <LinearDoubleKeyFrame Value="10" KeyTime="0:0:2.2"/>
      <LinearDoubleKeyFrame Value="140" KeyTime="0:0:3"/>
    • 23. Behavior
      Reusable piece of functionality
      Allows actions to be performed without writing code
      Start an animation
      Trigger a state change
      Play a sound
    • 24. Behavior types
      Action: invoked to perform an operation.
      Call a method, open window, etc
      Behavior: operation performed without invoking it
      Mouse over operation
      Trigger: fires when something (event) occurs
      Timer ends
    • 25. TFS Unboxed
      Learn what is involved in getting TFS 2010 up and
      running in your development environment
      Stephen Godbold & Dr TaflineMurnane
      Monday 2 August 2010
      Level 5, 4 Freshwater Place, Southbank
      AM session:  8:30am – 12:15pm
      PM session:  1:15pm – 5:00pm
      $75 + GST (includes light refreshments)
    • 26. Questions?