Degrafa Top 5 Features
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Degrafa Top 5 Features

  • 12,419 views
Uploaded on

Presentation given at Flex Camp Orange County discussing the "Top 5" features of Degrafa.

Presentation given at Flex Camp Orange County discussing the "Top 5" features of Degrafa.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
12,419
On Slideshare
6,941
From Embeds
5,478
Number of Embeds
8

Actions

Shares
Downloads
57
Comments
0
Likes
5

Embeds 5,478

http://www.degrafa.org 5,344
http://creative-geeks.com 107
http://www.slideshare.net 13
http://translate.googleusercontent.com 9
http://www.degrafa.org.suite-qa.codebaby.com 2
http://static.slideshare.net 1
http://74.125.77.132 1
http://webcache.googleusercontent.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. What are we talking about? introduction to Degrafa some of the basics top 5 features samples future stuff?
  • 2. What is Degrafa?
  • 3. Degrafa is: a declarative graphics framework open source licensed under MIT works with Flex 2, 3 and Flex 4* community driven for designers & developers at version Beta 3.1
  • 4. Declarative Graphics Framework?
  • 5. graphics.beginFill(#666666,.5); ActionScript graphics.drawCircle(0,0,100); graphics.endFill(); <Circle radius=quot;100quot;> <fill> <SolidFill Degrafa MXML color=quot;#666quot; alpha=quot;.5quot;/> </fill> </Circle>
  • 6. Geometry T SVG
  • 7. Geometry: draw to anything* bindable properties base shapes auto shapes svg path data raster & vector text contributions by jim armstrong
  • 8. Beyond Geometry states lls & strokes transforms layout masks lters extending
  • 9. Demo: Degrafa Basics
  • 10. Top 5 Features of Degrafa (debatable)
  • 11. VectorFill
  • 12. What’s VectorFill? create a ll using Degrafa markup treat it just like a BitmapFill no external assets easy to make changes
  • 13. Demo: VectorFill
  • 14. IGraphicSkin Button
  • 15. What’s IGraphicSkin do? create skins for components uses the new Degrafa states skin charts completely customize your UI
  • 16. Demo: IGraphicSkin
  • 17. Repeaters
  • 18. What are Repeaters? repeat any geometry modify any property on each repetition do complex things with minimal code
  • 19. Repeaters are great for: patterns data visualization artistic explorations skinning
  • 20. Demo: Repeaters
  • 21. Advanced CSS
  • 22. Advanced CSS do much more via CSS gradient backgrounds layer graphics multiple backgrounds rounded corners blends lters?
  • 23. Why Advanced CSS? customize your entire UI using just CSS external access for designers easily repurpose complex styles
  • 24. Demo: Advanced CSS
  • 25. Decorators
  • 26. Decorators externally alters geometry possible because of the Degrafa command stack get to the point-by-point data easy way to extend Degrafa without altering the source
  • 27. Possibilities with Decorators? change angles to curves dashed lines start & end caps multiple & shape borders a ton of possibilities... group them together!
  • 28. Demo: Decorators
  • 29. So what does this mean?
  • 30. Drawing is easy! <Surface> <GeometryGroup> <Circle radius=quot;100quot;> <fill> <SolidFill alpha=quot;.5quot; color=quot;#62ABCDquot;/> </fill> </Circle> </GeometryGroup> </Surface>
  • 31. Less External Assets
  • 32. Do really complex stuff with minimal code.
  • 33. Fine-grained control.
  • 34. Endless Possibilities?
  • 35. What’s Next?
  • 36. What’s Next: feature set is de ned time to re ne and nish these features x bugs and optimize VectorText Text on a Path union, punch, join, etc. AutoShapes extenions
  • 37. Thanks! degrafa.org