Search code examples
ioscanvasdiagramquartz-2ddraw2d

Best Practice for interactive 2D programming way in iOS

I want to create a diagram application, I can create some shapes. Every shape can be moved in the canvas. What is the best way to implement it? Now I know is just two way:

  1. with only UIView, draw all shapes in this UIView. When touch events reached, redraw everything.
  2. Create a UIView for each Shape, and every UIView can response UIEvent independently

Is there any other good way? The first is too complicated. The second seems has bad performance ?

Solution

  • Either will work, but each have pros and cons. Specifically:

    1. Single UIView: This approach would require you to create a CALayer for each shape and then do your own hit-testing and finger-dragging when the shape is moved. This approach will perform much better if you have many shapes (be sure to use an indexed lookup to do hit testing rather than an O(N) search) since CALayers are lightweight.
      • Do not take the approach o drawing the shapes in their current location in a single UIView via a single call to drawRect:. This will perform extremely poorly, especially when you are move the shapes during a drag, and as you indicate, is very complicated to implement well
    2. One UIView Per Shape: This approach is very easy to program, as you don't have to do the hit-testing and the touch get's sent to the shape being touched. This approach will perform well if you have a few shapes (<30, in my experience). If you have a large number of shapes, you start to see issues with frame rate.