Zooming

Figure 1. Zooming
Summary
  • Pinching gesture
  • Pinch zoom in (swiping two fingers away from each other) increases the overall size of the content
  • Pinch zoom out (swiping two fingers towards each other) reduces the overall size of the content
  • Exceptions:
    • Use a Gauge to adjust the zoom level.
    • Toggle between zoomed-out and zoomed-in view by double tapping.
Java:

Related design guidelines:

Patterns

Pinch open  
Figure 2. Pinch open
  • Two fingers drag away from each other.
  • Used to zoom in.
    • Overall content size increases.
    • Content is magnified.

Pinch close  
Figure 3. Pinch close
  • Two fingers drag to each other.
  • Used to zoom out.
    • Overall content size decreases.
    • Content is demagnified.

Exception: Double tapping  
Figure 4. Double tapping to zoom
  • Can be used to easily find back to the original size.
  • Toggles between zoomed in and zoomed out state.