Composite Composite Applications with Applications withWPF and PRISMWPF and PRISM
Eyal VardiEyal VardiCEO E4D Solutions LTDCEO E4D Solutions LTDMicrosoft MVP Visual C#Microsoft MVP Visual C#blog: www.eVardi.comblog: www.eVardi.com
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
AboutAbout ConsultingConsulting MentoringMentoring ProjectsProjects
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
AgendaAgenda Part IPart I
Microsoft Expression Blend 4Microsoft Expression Blend 4 Styles ControlsStyles Controls Visual State Manager & AnimationsVisual State Manager & Animations Commands & Behaviors Commands & Behaviors MVVM PatternMVVM Pattern
Part IIPart II What is PRISM?What is PRISM?
Region & ViewsRegion & Views ModulesModules Pub / SubPub / Sub
PRISM & WCFPRISM & WCF
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
SKETCH SKETCH FLOWFLOW
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
PHOTOSHOPPHOTOSHOP
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
POWERPOINTPOWERPOINT
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
BlendBlend
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Designer-Developer Designer-Developer ProductivityProductivity
Designers designDesigners design
With XAML designers & With XAML designers &
developers can streamline developers can streamline
their collaborationtheir collaboration
Developers add business logicDevelopers add business logic
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Control CustomizationControl Customization
WPF controls are typically WPF controls are typically notnot directly directly responsible for their own responsible for their own appearanceappearance
WPF controls can have WPF controls can have nested contentnested content, style , style and templatesand templates
Pay for Play Customization :Rich Content, Visual Styling , Built for a new Platform
Prop-erties
Custom Control
Style ControlStyle Control
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Theme & SkinTheme & SkinCosmopolitanCosmopolitanJetPackJetPack Windows7Windows7
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Style Control SampleStyle Control Sample
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Designer OutputsDesigner Outputs
Primitive ResourcePrimitive Resource ColorsColors FontsFonts Images & PicturesImages & Pictures AnimationsAnimations
Styles ControlsStyles Controls
ScreensScreens
ThemesThemes
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
MOCKUPMOCKUP
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Visual State ManagerVisual State Manager
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
StateState
Visual states are the way the control appears Visual states are the way the control appears in a particular state.in a particular state.
Each control has a number of "States" - Each control has a number of "States" - determined by the designer of the control. determined by the designer of the control.
<Vi sual St at eManager. Vi sual St at eGroups> <Vi sual St at eGroup x: Name=" CommonSt at es" > <Vi sual St at e x: Name=" Normal " / > <Vi sual St at e x: Name=" MouseOver" / > <Vi sual St at e x: Name=" Pressed" / > <Vi sual St at e x: Name=" Di sabl ed" / > </ Vi sual St at eGroup></ Vi sual St at eManager. Vi sual St at eGroups>
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
State GroupState Group
Control can be in 2 different states as long as Control can be in 2 different states as long as each of those states are in a different state each of those states are in a different state group.group.
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
TransitionsTransitions Visual transitions represent the way the Visual transitions represent the way the
control looks as it transitions from one visual control looks as it transitions from one visual state to another.state to another.
<Vi sual St at eManager. Vi sual St at eGroups> <Vi sual St at eGroup x: Name=" CommonSt at es" > <Vi sual St at eGroup. Transi t i ons> <Vi sual Transi t i on Generat edDurat i on=" 0: 0: 0. 5" / > <Vi sual Transi t i on To=" MouseOver" Generat edDurat i on=" 0: 0: 0. 5" / > <Vi sual Transi t i on From=" MouseOver" Generat edDurat i on=" 0: 0: 0. 5" / > <Vi sual Transi t i on From=" MouseOver" To=" Pressed" . . . / > </ Vi sual St at eGroup. Transi t i ons> </ Vi sual St at eGroup></ Vi sual St at eManager. Vi sual St at eGroups>
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
TransitionsTransitions
<Vi sual St at eManager. Vi sual St at eGroups> <Vi sual St at eGroup x: Name=" CommonSt at es" > <Vi sual St at eGroup. Transi t i ons> <Vi sual Transi t i on To=" MouseOver" Generat edDurat i on=" 0: 0: 0. 5" / > </ Vi sual St at eGroup. Transi t i ons> <Vi sual St at e x: Name=" Normal " / > <Vi sual St at e x: Name=" MouseOver" / > <Vi sual St at e x: Name=" Pressed" / > <Vi sual St at e x: Name=" Di sabl ed" / > </ Vi sual St at eGroup> . . .</ Vi sual St at eManager. Vi sual St at eGroups>
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Visual State ManagerVisual State ManagerIn XAMLIn XAML
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
TemplateVisualState AttributeTemplateVisualState Attribute
Inform template authors what states the Inform template authors what states the control can be in.control can be in.
Authors add Authors add VisualStateVisualState objects to the objects to the template to specify the appearance of a template to specify the appearance of a control when it is in a certain state.control when it is in a certain state.
[ Templ at eVi sual St at e(Name=" Normal " , GroupName=" CommonSt at es" ) ][ Templ at eVi sual St at e(Name=" MouseOver" , GroupName=" CommonSt at es" ) ][ Templ at eVi sual St at e(Name=" Pressed" , GroupName=" CommonSt at es" ) ]publ i c cl ass Numer i cUpDown : Cont rol } {
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Initiating State ChangesInitiating State Changes
The authors is responsible for telling The authors is responsible for telling VisualStateManager when a visual state VisualStateManager when a visual state change should occur.change should occur.
pr i vat e voi d GoToSt at e(bool useTransi t i ons) } i f ( i sPressed) Vi sual St at eManager. GoToSt at e( t hi s, " Pressed" , useTransi t i ons) ; el se i f ( i sMouseOver) Vi sual St at eManager. GoToSt at e( t hi s, " MouseOver" , useTransi t i ons) ; el se Vi sual St at eManager. GoToSt at e( t hi s, " Normal “ , useTransi t i ons) ; {
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Weather ControlWeather Control
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Triggers, Actions & BehaviorsTriggers, Actions & Behaviors
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Action WayAction Way<But t on Cont ent =" Cl i ck Me" > <But t on. Tr i ggers>
<Event Tr i gger Rout edEvent =" Cl i ck" > <Event Tr i gger. Act i ons> <Begi nSt oryboard St oryboard=" {St at i cResource sbSpi n} " / > </ Event Tr i gger. Act i ons> </ Event Tr i gger>
<Mul t i Tr i gger> <Mul t i Tr i gger. Condi t i ons> <Condi t i on Propert y=" I sMouseOver" Val ue=" True" / > <Condi t i on Propert y=" Cont ent " Val ue=" { x: Nul l } " / > </ Mul t i Tr i gger. Condi t i ons> <Set t er Propert y=" Background" Val ue=" Yel l ow" / > </ Mul t i Tr i gger> </ But t on. Tr i ggers> </ But t on>
<But t on Cont ent =" Cl i ck Me" > <i : I nt eract i on. Tr i ggers> <i : Event Tr i gger Event Name=" Cl i ck" > <E4D: MyAct i on Target Name=" l bTrace" / > </ i : Event Tr i gger></ i : I nt eract i on. Tr i ggers>
</ But t on>
publ i c cl ass MyAct i on : Target edTr i ggerAct i on<DependencyObj ect >{ publ i c MyAct i on( ) { . . . }
prot ect ed overr i de voi d I nvoke(obj ect o) { . . . }}
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
ActionAction
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Trigger Trigger ( When )( When )
Invokes a bunch of actions at a point when it Invokes a bunch of actions at a point when it decides to do that.decides to do that. Event TriggerEvent Trigger Timer TriggerTimer Trigger Size TriggerSize Trigger
The Attach & Detach connect toThe Attach & Detach connect tothe target.the target.
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Timer Trigger SampleTimer Trigger Samplepubl i c cl ass Ti merTr i gger : Tr i ggerBase<DependencyObj ect >{ publ i c Ti meSpan I nt erval { get ; set ; }
prot ect ed overr i de voi d OnAt t ached( ) { t i mer = new Di spat cherTi mer( ) ; t i mer. I nt erval = I nt erval ; t i mer. Ti ck += OnTi ck; t i mer. St art ( ) ; }
voi d OnTi ck( obj ect sender, Event Args e) { t hi s. I nvokeAct i ons(nul l ) ; }
prot ect ed overr i de voi d OnDet achi ng( ) { t i mer. Ti ck -= OnTi ck; t i mer = nul l ; } Di spat cherTi mer t i mer;}
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Custom TriggerCustom Trigger
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
BehaviorBehavior
Behavior Behavior don’t need don’t need the “the “WhenWhen” ( Trigger ),” ( Trigger ),and and don’t have don’t have the the I nvokeI nvoke ..
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Behavior with CommandBehavior with Commandpubl i c cl ass Met hodBehavi or : Behavi or<DependencyObj ect >{ publ i c I Command Command { get ; set ; }
publ i c Met hodBehavi or( ) {
Command = new Act i onCommand( MyMet hod ) ; }
pr i vat e voi d MyMet hod( ) { / / TODO: }}
<But t on Cont ent =" Cl i ck Me“> <i : I nt eract i on. Behavi ors> <E4D: Met hodBehavi or>
<i : I nt eract i on. Tr i ggers><i : KeyTr i gger SourceName=" . . . " > <i : I nvokeCommandAct i on CommandName=" Command"
/ ></ i : KeyTr i gger>
</ i : I nt eract i on. Tr i ggers></ E4D: Met hodBehavi or>
</ i : I nt eract i on. Behavi ors></ But t on>
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
BehaviorsBehaviors
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
FULL FULL MOCKUPMOCKUP
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Prism 2010Prism 2010
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Why Composite WPF?Why Composite WPF?
Modul ar i t yModul ar i t yDevelopment of applications by using Development of applications by using independent, but collaborating, modules.independent, but collaborating, modules.
Pr oduc t i vi t yPr oduc t i vi t yDeveloper (or team) is able to concentrate on Developer (or team) is able to concentrate on a specific task.a specific task.
Ext e ns i bi l i t yExt e ns i bi l i t yAllows you to replace the behaviors and Allows you to replace the behaviors and strategies provided as defaults strategies provided as defaults
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
UI Module UI Module Structure Structure ( MVVM )( MVVM )
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Prism Quick StartPrism Quick Start(David Hill)(David Hill)
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Prism & WCFPrism & WCF
RequestRequestUI ShellUI Shell
ResponseResponse
Com
munication
Com
munication
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Prism & NotificationPrism & Notification
UI ShellUI Shell NotificationNotification
Com
munication
Com
munication
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
Prism & BehaviorsPrism & Behaviors
RequestRequest
UI ShellUI Shell
ResponseResponse
Com
munication
Com
munication NotificationNotification
BB
© 2010 E4D LTD. All rights reserved. Tel: 054-5-767-300, Email: [email protected]
FINISHFINISH
Top Related