5

I'm trying to figure out the best way to procedurally animate the growing of a 2D plant in iOS.

I want the plant to animate to give an encroaching feeling to the user. Basically, to animate the growing of a branch, with little buds that will eventually animate into full grown leaves. To breathe a little life into it, I'd also like the plant to sway a bit as it grows, rather than feeling hand painted on the screen.

One way I've thought of is to use CGPaths and Bezier curves to create the shape of the stalk and the leaves, but I'm not entirely sure how to animate the drawing of the paths. Once I get the "drawing" of the stalk, i'd like to "plant" little buds at certain points on the stalk, as the line is growing/animating and these buds will also start to grow outwards from the plant.

Any suggestions on what route to take to accomplish this task? I'd prefer to procedurally animate as opposed to hand drawing each frame and animating that way. My reasoning is that I imagine procedurally animating will be less time consuming, give me more control over different aspects of the animation, and be reusable in other projects (not to mention, it will be fun to program!)

I've come across this blog posting for the drawing of animated lines: http://oleb.net/blog/2010/12/animating-drawing-of-cgpath-with-cashapelayer/ Perhaps this would be a starting approach for achieving the results I want, I need to sit down and go through the code he posted.

Also, maybe this is something that would be easier to do using cocos2d or something similar? Or perhaps quartzcore and core animation will work fine.

Thanks for any suggestions you might have, any information is helpful at this point.

pasawaya
  • 11,515
  • 7
  • 53
  • 92
  • You're definitely on the right track with CAShapeLayers, but what you're trying to do is tricky. Nevertheless, great question! Definitely on my favorites list. – pasawaya Aug 25 '12 at 06:50
  • Added some resource links as a non-answer. Maybe more than you were looking for but it is a really rich algorithmic area (and maybe more than you were looking for). Nonetheless, might give some ideas. – spring Aug 25 '12 at 08:02
  • I added some resources to the CW answer, but I get the feeling you're not looking for complex 3D tree generation algorithms with L-Systems and the like, but rather for how to animate a simple 2D, cartoonish tree's growth, right? – pasawaya Aug 25 '12 at 08:20

1 Answers1

3

(Great question! Posting this as a "community wiki" since it is not an answer but just some references and I didn't want the links to get screwed up in comments. Perhaps people want to add to this?)

I did a simple search on "procedural tree branching code" and there were lots of interesting hits - really rich area.

A post on gameDev.stackExhange pointed to this great resource: Algorithmic Botany

Also Snappy Tree is pretty amazing and the source code is available.

These two also sound interesting:

TReal is a program capable of generating realistic 3D tree models.

Arbaro is an implementation of the tree generating algorithm described in Jason Weber & Joseph Penn: "Creation and Rendering of Realistic Trees" written in Java.

Perhaps more accessible to the OP and with a less complex result are these actionScript tutorials on fractal trees. ActionScript drawing code is pretty easily translated to Core Graphics.

Community
  • 1
  • 1
spring
  • 18,009
  • 15
  • 80
  • 160