I have an iPad app that draws something like tracing paper: a translucent surface with marks on one side. In the app the user can "fold" the paper over to line up the marks.
The initial prototype is just a drawRect override in a custom view, with low-level CGxxx calls to do the drawing, and I just manually handle the draw order: for the "right side up" sections I draw the paper first, then draw marks on top of that, and for the folded over parts, I draw the marks first, then the translucent "paper" over that. This works well, but is very low level. I'd like to take better advantage of iOS.
Since Core Animation has 3D transforms, I was hoping that a 3D rotation (flipping the paper over) would also change the drawing order of the CALayers automatically (paper is a translucent layer, marks are a sublayer. Alas, that doesn't happen...after the animation, t开发者_开发技巧he drawing order is the same as previously.
Questions:
1) Is there any way to automatically handle the drawing order as I was hoping? I suspect the answer is no, but wanted to ask folks who know lots more than I.
2) What technology is appropriate for this kind of drawing? Core Animation? CGLayers? Just stick to familiar low-level calls? I'm at a bit of a loss.
Just FYI, drawing the folded paper involves a lot of transformation and clipping. The procedure is: clip to the bottom bit, draw paper (an image) then marks (a path), then clip to the top bit, do a reflection transform across the fold line, draw marks then paper. Again, it is working well, but the code is voluminous (if straightforward). Is there a better way to go?
Thanks for any opinions,
Dave Johnson
Although Core Animation has 3D transforms, it is still very much 2.5D when it comes to compositing layers. What you CAN do is modify the layer z-order (zPosition
property of CALayer
) to give the impression of the marks being "in front of" or "beneath" the translucent paper.
For this, you will need to have paper and marks on two separate CALayer
s, as I understand you already have. Note, however, that sublayers will be rendered on top of their parents... so instead of making the "marks" layer a sublayer of your "paper" layer, you need to make them siblings for the z-order to take effect, for example by making them sublayers of a common parent layer:
- (invisible) container layer
- marks layer (zPosition 2)
- paper layer (zPosition 1)
Now to display the marks beneath the paper, it suffices to rearrange them in the z-order. (In order to apply a transformation to both of them at once, you may want to assign the sublayerTransform
property of the container layer, instead of modifying their individual transform
properties.)
精彩评论