Expression Blend

75 %
25 %
Information about Expression Blend

Published on December 16, 2007

Author: sfeer2007


Slide2:  Moataz H. Ali Academic Programs Manager Agenda:  Agenda User Experience WPF & XAML Blend & Design Features By Example Demos Q & A Slide4:  User Experience What Is User Experience? :  What Is User Experience? User Experience in Software?:  Ease of Use Learn ability Performance Reliability Security Optimized form factors Legibility / Readability Relevance / Contextualization Richness Graphics & Media Data Visualization Higher Fidelity Information Globalization Accessibility Hardware & Printing Integration User Experience in Software? Windows Vista Office 2007 .NET At The Core:  .NET At The Core Slide8:  Windows Presentation Foundation (WPF) WPF Architecture:  WPF Architecture Designer-Developer Productivity:  Designer-Developer Productivity Microsoft Tools for Designer & Developers Declarative Programming through XAML Third Party Tools (e.g. Aurora by Mobiform, ZAM 3D by Electric Rain) Designers design With XAML designers & developers can streamline their collaboration Developers add business logic Declarative Programming Through XAML:  Declarative Programming Through XAML XAML = Extensible Application Markup Language Easily toolable, declarative markup Code and content are separate Can be rendered in the browser / standalone application Slide12:  Blend & Design What is Blend?:  What is Blend? What is Design?:  What is Design? Blend and Design Environment:  Blend and Design Environment Slide16:  Features by Example Content Models:  Content Models Shape Panel ItemsControl ContentControl <Ellipse Fill="Blue" Height="50" Width="50" /> <Rectangle Fill="Green" Height="50" Width="50“ /> <Polygon Fill="Yellow“> <Polygon.Points> <PointCollection> <Point X="25" Y="1"/> <Point X="50" Y="50"/> <Point X="1" Y="50"/> </PointCollection> </Polygon.Points> </Polygon> <ListBox Height="100" Width="100"> <ListBox.Items> <TextBlock>My Text</TextBlock> <Button>My Button</Button> <Image Source="BasicControls\kotomi.jpg" Width="70"/> </ListBox.Items> </ListBox> <Button Height="100" Width="150"> <StackPanel> <TextBlock HorizontalAlignment="Center">Kotomi</TextBlock> <Image Source="BasicControls\Kotomi.jpg" Margin="5" Opacity="0.5" /> </StackPanel> </Button> Attach Properties:  Attach Properties Defined by XAML Can be set on any object Property provider implements Get and Set <Grid> <ListBox Grid.Row="0" Grid.Column="0" ToolTip="Select item..."> <Button Grid.Row="1" Grid.Column=“1" Content="Click Me" /> <Image Grid.Row="0" Grid.Column="1“ /> </Grid> Layout System & Controls:  Layout System & Controls Panel Elements:  Panel Elements Canvas – absolute positioning Grid – position elements by column and row DockPanel – arrange elements horizontally or vertically StackPanel – arrange elements in a single line WrapPanel – sequentially left to right with line breaks VirtualizingPanel – framework for virtualizing children Controls:  Controls Data Binding:  Data Binding UI can be bound to CLR objects and XML Dependency properties can also be bound to ADO.NET and objects associated with Web Services and Web properties Sort, filter, and group views can be generated on top of the data Data templates can be applied to data Layout & Databinding <StackPanel> <Label>Select A Customer</Label> <ListBox Name="myListBox" Background="HoneyDew" ItemsSource="{Binding {StaticResource myDataSource}}" </ListBox> </StackPanel> Control Templates:  Control Templates Data Templates:  Data Templates class Car { string Image {get;set} string Model {get;set} } <DataTemplate x:Key="carTemplate"> <Border BorderBrush="Blue" BorderThickness="2" Background="LightGray" Margin="10" Padding="15,15,15,5"> <StackPanel> <Image HorizontalAlignment="Center" Source="{Binding Path=Image}" /> <Border HorizontalAlignment="Center" BorderBrush="Navy" Background="#DDF" BorderThickness="1" Margin="10" Padding="3"> <TextBlock FontSize="18" Text="{Binding Path=Model}" /> </Border> </StackPanel> </Border> </DataTemplate> Event Triggers:  Event Triggers <EventTrigger RoutedEvent="Rectangle.MouseEnter"> <EventTrigger.Actions> <BeginStoryboard> <Storyboard> <DoubleAnimation To="300" Duration="0:0:1.5" AccelerationRatio="0.10" DecelerationRatio="0.25" Storyboard.TargetProperty="(Canvas.Width)" /> </Storyboard> </BeginStoryboard> </EventTrigger.Actions> </EventTrigger> Property Triggers:  Property Triggers <Style x:Key="Triggers" TargetType="{x:Type Button}"> <Style.Triggers> <Trigger Property="Button.IsMouseOver" Value="true"> <Setter Property = "Background" Value="Red"/> </Trigger> </Style.Triggers> </Style> <MultiTrigger> <MultiTrigger.Conditions> <Condition Property="HasItems" Value="false" /> <Condition Property="Width" Value="Auto" /> </MultiTrigger.Conditions> <Setter Property="MinWidth" Value="120"/> </MultiTrigger> Evaluation:  Evaluation We need to hear from you We can run discussions, answer any questions you may have through out the day Please fill out evaluation sheets and turn them in before the closing session starts XBox360 Raffle Draw will be based on filled evaluation forms that are submitted Slide34:  © 2007 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS SUMMARY.

Add a comment

Related presentations

Related pages

Microsoft Expression Blend – Wikipedia

Microsoft Expression Blend ist ein Interface-Designwerkzeug zur Entwicklung von plattformübergreifenden Webanwendungen, so genannte Rich Internet ...
Read more

Änderungen bei Microsoft Expression | Microsoft Expression

Microsoft Expression erfährt einige Änderungen. Expression Blend ist jetzt Blend for Visual Studio. Expression Design, Encoder und Web Professional sind ...
Read more

Expression Blend | heise Download

Hersteller: » Zur Website: Preis: 639 EUR (Expression Studio) Lizenz: Testversion: Betriebssystem: Windows XP, Windows Vista: Download-Größe: 298393 KByte
Read more

Microsoft Expression Changes | Microsoft Expression

Microsoft Expression is changing. Expression Blend is now Blend for Visual Studio. Expression Design, Encoder, and Web Professional are now available as ...
Read more

Informationen zu Expression Blend -

Microsoft Expression Blend ist ein professionelles Designtool mit umfangreichen Features zum Erstellen ansprechender und komplexer Benutzeroberflächen ...
Read more

Expression Blend 4-Silverlight - Video-Trainings von ...

In diesem etwa achtzigminütigen Video-Training gibt Ihnen Gregor Biswanger eine Einführung in Expression Blend 4. Expression Blend ist das Designwerkzeug ...
Read more

Microsoft Expression – Wikipedia

Microsoft Expression Blend. Expression Blend ist ein Designwerkzeug für interaktive Benutzeroberflächen, welche die Windows Presentation ...
Read more

Learn Microsoft Expression Blend: videos, tutorials ...

Learn about Microsoft Expression Blend using videos, tutorials, and whitepapers.
Read more

Expression Blend Schulung Training Seminar - GROSSWEBER

Microsoft Expression Blend ist das Werkzeug zur Entwicklung grafischer Oberflächen unter .NET, Silverlight und der Windows Presentation Foundation bzw. WPF.
Read more

Microsoft Expression Blend - Free download and software ...

Microsoft Expression Blend is the professional design tool used to create engaging Web-connected experiences for Windows
Read more