Upcoming SlideShare
×

# Windows 8: Shapes and Geometries

915 views

Published on

Learn to use basic shapes (lines, ellipses, rectangles, and polygons), add line caps and joins, work with geometries and paths, and investigate the geometry mini-language.

Published in: Technology
0 Likes
Statistics
Notes
• Full Name
Comment goes here.

Are you sure you want to Yes No
• Be the first to comment

• Be the first to like this

Views
Total views
915
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
0
0
Likes
0
Embeds 0
No embeds

No notes for slide

### Windows 8: Shapes and Geometries

1. 1. Windows 8:Shapes and Geometries – Part2Shapes and Geometries – Part2 http://www.LearnNowOnline.com Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
2. 2. Objectives• Learn to use basic shapes: lines, ellipses, rectangles, and polygons• Add line caps and joins• Work with geometries and paths• Investigate the geometry mini-language Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
3. 3. Agenda• Working with Shapes• Digging Deeper: Using Paths and Geometries Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
4. 4. Using Paths and Geometries• Geometry class abstract, so must use: • EllipseGeometry, LineGeometry, RectangleGeometry • PathGeometry (can contain arcs, curves, lines) • GeometryGroup • Allows you to add any number of Geometry objects to a single Path Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
5. 5. Paths vs Geometries?• Why both paths and geometries? • Geometry defines a single shape • Coordinates and properties • Doesn’t draw the shape • Path can group shapes • Allows you to draw the shape(s)• Path provides Stroke and Fill • Also handles mouse and keyboard handling Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
6. 6. Ellipse, Line, RectangleGeometry• Work much like Ellipse, Line, Rectangle shapes• EllipseGeometry defines Center and Radius rather than width and height• Real power comes in combining within Path Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
8. 8. Using GeometryGroup Element• Create several shapes that share fill and stroke characteristics?• Place within single Path element, using GeometryGroup element• All shapes in group share fill and stroke• No z-order implications—all borders show Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
9. 9. Using GeometryGroup Element• GeometryGroup provides FillRule, treating entire group as a single "drawing"• Using GeometryGroup reduces element count • Optimizes XAML slightly Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
11. 11. Curves/Lines with PathGeometry• Need to draw curves and specific shapes that dont fit other categories? • Use PathGeometry• Can contain one or more PathFigure elements • Each PathFigure contains information about one or more segments • Segment can be line, or curve• PathFigure properties: IsClosed, IsFilled, Segments, StartPoint Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
12. 12. PathFigure Properties• IsClosed: Determines if first and last segments are connected• IsFilled: Determines if contained area should be filled using brush in Path.Fill• Segments: Collection of segments that define the shape; collection of PathSegment objects• StartPoint: Determines the starting point for PathFigure Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
14. 14. PathGeometry Markup• PathGeometry element<Path.Data> <Path …> generally looks like <PathGeometry> <PathFigure … > this: <LineSegment … /> <ArcSegment … /> </PathFigure> <PathFigure … /> </PathGeometry> </Path.Data> </Path> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
16. 16. Working with Lines• Path describes Fill, Stroke, StrokeThickness for entire path; also contains StrokeLineJoin and StrokeEndLineCap• PathGeometry contains FillRule• PathFigure maintains StartPoint• Continuous line segments could be represented as PolyLineSegment Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
17. 17. Working with Arcs• ArcSegment element defines an elliptical arc• Many different ways to describe portion of ellipse; must study various properties• PathFigure defines start point, ArcSegment defines end point in its Point property Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
18. 18. Working with Arcs• X and Y radius in Size property as ordered pair• RotationAngle defines rotation• IsLargeArc: Using large or small portion or ellipse?• SweepDirection: Clockwise? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company