Advanced Rich App Graphics with XAML

מספר הקורס 1390

40 סה"כ שעות אקדמאיות
5 מפגשים
* מספר המפגשים והשעות למפגש עשויים להשתנות בין קורס לקורס

המועדים הקרובים

קורס לקבוצות

הקורס נפתח במתכונת של קבוצה בלבד, בהתאמה אישית לארגונים.
לפרטים נוספים:

ספרו לי עוד


This advanced course will teach you how to create stunning user interfaces using the most advanced markup language – XAML. We will dive deep into the graphics engine of XAML based applications. You will understand how XAML applications "Think" in vector graphics. We will introduce the basic elements that allow you to draw rich graphics in WPF and explain how to use them and how to arrange them so that they can be reused. You will learn how to create complex geometries and combine them with various brushes in order to create graphic entities. You will learn how to apply transformations in order to modify their layout and how to apply effects in order to modify their looks.  In order to arrange them on the screen, you will learn layout in depth. Once you have mastered the building blocks, we will show you how to manipulate them programmatically. You will learn how to create animations, and how to apply the same principals in 3D. Finally, we will talk about practical design work and how to convert graphical design into a real life UI.


On Completion, Delegates will be able to

Build stunning fluid and rich GUI using XAML

Apply the most challenging graphics designs in their applications

Create elegant animations and transitions and use them in their apps

Use Microsoft Blend effectively to improve their development process


Who Should Attend

This course is intended for professional developers with one or more years of experience creating applications for windows or the web, who are comfortable programming C# and would like to learn how to create the most stunning applications using XAML.


תכנית הלימודים

Full Sylabus
PDF להורדה

Module 1: Vector Graphics

  • Raster Graphics         
  • What is Vector Graphics       
  • DPI Independence    
  • Demo: Effective Pixel and Scaling

Module 2: Shapes

  • Shapes Overview      
  • Ellipse and Rectangle
  • Polyline and Polygon
  • The Path        
  • The Stretch Property 
  • The Path Language   
  • Demo: Drawing Shapes in Blend

Module 3: The Colors Theory

  • Named colors overview        
  • ARGB Model
  • Additive Colors explained    
  • HSV Model   
  • Alpha Channel          
  • HTML Format

Module 4: Brushes

  • Overview of Brushes
  • Solid Color Brush     
  • Overview of Gradients         
  • Editing Linear Gradients      
  • Editing Radial Gradients      
  • Editing Gradients with Blend           
  • Image Brushes          
  • Tile Brushes  
  • Demo: Brush with Tiles        
  • Drawing Brushes      
  • Visual Brushes          
  • Demo: Form Reflection using Visual Brush

Module 5: Geometries         

  • Geometries Overview           
  • Simple geometries (Ellipse and Rectangle)  
  • Path Geometry, Figures and Segments         
  • Composition (GeometryGroup and CombinedGeometry)   
  • StreamGeometry       
  • The path markup syntax       
  • Filling Geometries    
  • Programming Geometries     
  • Demo: Creating Interactive Callout geometry         

Module 6: Drawings

  • Drawing Overview   
  • Geometry Drawings  
  • Image Drawings        
  • Other Drawings         
  • Demo: Interactive Drawing brush    

Module 7: Transformations

  • Render Transform Vs. Layout Transforms   
  • Rotate Transforms     
  • Translate Transforms
  • Skew Transforms      
  • Scale Transforms      
  • Combining Transforms         
  • Demo: transforming a drawing         
  • About Origin of transforms  

Module 8: Effects     

  • Blur and Drop Shadows       
  • Pixel Shaders

Module 9: Panels and the Layout System

  • The layout system explained
  • Layout Properties      
  • Basic Panels: Canvas, Stack Panel and Wrap Panel 
  • The Grid       
  • Additional Panels: Uniform Grid, Dock Panel         
  • The Scroll Viewer     
  • The View Box          
  • On Scrolling and Virtualization        
  • The Virtualizing Stack Panel
  • Virtualization properties       
  • Sample: Responsive Layout: Calculator       
  • Sample: Responsive Layout: Screen Layout

Module 10: Clipping and Opacity

  • The Clip property     
  • The Opacity Mask Property  
  • Demo: Interactive Clipping  

Module 11: Animation         

  • Animation overview 
  • Demo: Programmatic Animations using Composition Target         
  • Animation classes     
  • Demo: Using Animations in code    
  • Key Frame animations          
  • The Storyboard         
  • Demo: Animations in Blend 
  • Easing Functions      
  • Path Based Animations         
  • Demo: Morphing Geometry 
  • Demo: Animating Gradient  
  • Demo: Starting storyboards from Triggers

Module 12: 3D Graphics

  • Getting Started with 3D Graphics    
  • Cameras and Coordinate Systems    
  • Transform 3D
  • Model 3D      
  • Visual 3D      
  • Viewport 3D 
  • 2D and 3D coordinate system transformations         

Module 13: Working with Designs

  • Developer Designer interaction        
  • Importing from Photoshop   
  • Importing from Illustrator     


  • At least 2 years' experience programming in C#
  • Previous experience building GUI

Schedule Appointment

Fill out the form below, and we will be in touch shortly.

לא הצלחנו לאתר את הטופס.