Home | History | Annotate | Download | only in patterns
      1 page.title=Gestures
      2 page.tags="gesture","input","touch"
      3 @jd:body
      4 
      5 <p>Gestures allow users to interact with your app by manipulating the screen objects you provide. The
      6 following table shows the core gesture set that is supported in Android.</p>
      7 
      8 <div class="layout-content-row">
      9   <div class="layout-content-col span-4">
     10 
     11     <img src="{@docRoot}design/media/gesture_touch.png">
     12 
     13 <h4>Touch</h4>
     14 <p>Triggers the default functionality for a given item.</p>
     15 
     16 <ul>
     17   <li class="no-bullet with-icon action">
     18     <h4>Action</h4>
     19     <p>Press, lift</p></li>
     20 </ul>
     21 
     22   </div>
     23   <div class="layout-content-col span-4">
     24 
     25     <img src="{@docRoot}design/media/gesture_longtouch.png">
     26 
     27 <h4>Long press</h4>
     28 <p>Enters data selection mode. Allows you to select one or more items in a view and act upon
     29   the data using a contextual action bar. Avoid using long press for showing contextual menus.</p>
     30 
     31 <ul>
     32   <li class="no-bullet with-icon action">
     33     <h4>Action</h4>
     34     <p>Press, wait, lift</p></li>
     35 </ul>
     36 
     37   </div>
     38   <div class="layout-content-col span-4">
     39 
     40     <img src="{@docRoot}design/media/gesture_swipe.png">
     41 
     42 <h4>Swipe</h4>
     43 <p>Scrolls overflowing content, or navigates between views in the same hierarchy.</p>
     44 
     45 <ul>
     46   <li class="no-bullet with-icon action">
     47     <h4>Action</h4>
     48     <p>Press, move, lift</p></li>
     49 </ul>
     50 
     51   </div>
     52 </div>
     53 
     54 
     55 <div class="layout-content-row">
     56   <div class="layout-content-col span-4">
     57 
     58     <img src="{@docRoot}design/media/gesture_drag.png">
     59 
     60 <h4>Drag</h4>
     61 <p>Rearranges data within a view, or moves data into a container (e.g. folders on Home Screen).</p>
     62 
     63 <ul>
     64   <li class="no-bullet with-icon action">
     65     <h4>Action</h4>
     66     <p>Long press, move, lift</p></li>
     67 </ul>
     68 
     69   </div>
     70   <div class="layout-content-col span-4">
     71 
     72     <img src="{@docRoot}design/media/gesture_doubletouch.png">
     73 
     74 <h4>Double touch</h4>
     75 <p>Zooms into content. Also used as a secondary gesture for text selection.</p>
     76 
     77 <ul>
     78   <li class="no-bullet with-icon action">
     79     <h4>Action</h4>
     80     <p>Two touches in quick succession</p></li>
     81 </ul>
     82 
     83   </div>
     84   <div class="layout-content-col span-4">
     85 
     86     <img src="{@docRoot}design/media/gesture_pinchopen.png" style="margin-left:-4px">
     87 
     88 <h4>Pinch open</h4>
     89 <p>Zooms into content.</p>
     90 
     91 <ul>
     92   <li class="no-bullet with-icon action">
     93     <h4>Action</h4>
     94     <p>2-finger press, move outwards, lift</p></li>
     95 </ul>
     96 
     97   </div>
     98 </div>
     99 
    100 
    101 <div class="layout-content-row">
    102   <div class="layout-content-col span-4">
    103 
    104     <img src="{@docRoot}design/media/gesture_pinchclose.png">
    105 
    106 <h4>Pinch close</h4>
    107 <p>Zooms out of content.</p>
    108 
    109 <ul>
    110   <li class="no-bullet with-icon action">
    111     <h4>Action</h4>
    112     <p>2-finger press, move inwards, lift</p></li>
    113 </ul>
    114 
    115   </div>
    116 </div>
    117