summaryrefslogtreecommitdiffstats
path: root/docs/html/design/patterns/compatibility.html
blob: d6e59f572037a8c4487455e6394ceaa59e59fd6c (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>

Android Design - Backwards Compatibility
    </title>
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:regular,medium,thin,italic,mediumitalic">
    <link rel="stylesheet" href="../static/yui-3.3.0-reset-min.css">
    <link rel="stylesheet" href="../static/default.css">

  </head>
  <body>

    <div id="page-container">

      <div id="page-header"><a href="../index.html">Android Design</a></div>

      <div id="main-row">

        <ul id="nav">

          <li class="nav-section">
            <div class="nav-section-header"><a href="../index.html">Get Started</a></div>
            <ul>
              <li><a href="../get-started/creative-vision.html">Creative Vision</a></li>
              <li><a href="../get-started/principles.html">Design Principles</a></li>
              <li><a href="../get-started/ui-overview.html">UI Overview</a></li>
            </ul>
          </li>

          <li class="nav-section">
            <div class="nav-section-header"><a href="../style/index.html">Style</a></div>
            <ul>
              <li><a href="../style/devices-displays.html">Devices and Displays</a></li>
              <li><a href="../style/themes.html">Themes</a></li>
              <li><a href="../style/touch-feedback.html">Touch Feedback</a></li>
              <li><a href="../style/metrics-grids.html">Metrics and Grids</a></li>
              <li><a href="../style/typography.html">Typography</a></li>
              <li><a href="../style/color.html">Color</a></li>
              <li><a href="../style/iconography.html">Iconography</a></li>
              <li><a href="../style/writing.html">Writing Style</a></li>
            </ul>
          </li>

          <li class="nav-section">
            <div class="nav-section-header"><a href="../patterns/index.html">Patterns</a></div>
            <ul>
              <li><a href="../patterns/new-4-0.html">New in Android 4.0</a></li>
              <li><a href="../patterns/gestures.html">Gestures</a></li>
              <li><a href="../patterns/app-structure.html">App Structure</a></li>
              <li><a href="../patterns/navigation.html">Navigation</a></li>
              <li><a href="../patterns/actionbar.html">Action Bar</a></li>
              <li><a href="../patterns/multi-pane-layouts.html">Multi-pane Layouts</a></li>
              <li><a href="../patterns/swipe-views.html">Swipe Views</a></li>
              <li><a href="../patterns/selection.html">Selection</a></li>
              <li><a href="../patterns/notifications.html">Notifications</a></li>
              <li><a href="../patterns/compatibility.html">Compatibility</a></li>
              <li><a href="../patterns/pure-android.html">Pure Android</a></li>
            </ul>
          </li>

          <li class="nav-section">
            <div class="nav-section-header"><a href="../building-blocks/index.html">Building Blocks</a></div>
            <ul>
              <li><a href="../building-blocks/tabs.html">Tabs</a></li>
              <li><a href="../building-blocks/lists.html">Lists</a></li>
              <li><a href="../building-blocks/grid-lists.html">Grid Lists</a></li>
              <li><a href="../building-blocks/scrolling.html">Scrolling</a></li>
              <li><a href="../building-blocks/spinners.html">Spinners</a></li>
              <li><a href="../building-blocks/buttons.html">Buttons</a></li>
              <li><a href="../building-blocks/text-fields.html">Text Fields</a></li>
              <li><a href="../building-blocks/seek-bars.html">Seek Bars</a></li>
              <li><a href="../building-blocks/progress.html">Progress &amp; Activity</a></li>
              <li><a href="../building-blocks/switches.html">Switches</a></li>
              <li><a href="../building-blocks/dialogs.html">Dialogs</a></li>
              <li><a href="../building-blocks/pickers.html">Pickers</a></li>
            </ul>
          </li>

          <li class="nav-section">
            <div class="nav-section-header empty"><a href="../downloads/index.html">Downloads</a></div>
          </li>

          <li>
            <div id="back-dac-section"><a href="../../index.html">Developers</a></div>
          </li>

        </ul>

        <div id="content">

          
          <div class="layout-content-row content-header">
            <div class="layout-content-col span-9">
              <h2>Backwards Compatibility</h2>
            </div>
            <div class="paging-links layout-content-col span-4">
              <a href="#" class="prev-page-link">Previous</a>
              <a href="#" class="next-page-link">Next</a>
            </div>
          </div>
          

          

<p>Significant changes in Android 3.0 included:</p>
<ul>
<li>Deprecation of navigation hardware keys (Back, Menu, Search, Home) in favor of handling navigation
  via virtual controls (Back, Home, Recents).</li>
<li>Robust pattern for the use of menus in action bars.</li>
</ul>
<p>Android 4.0 brings these changes for tablets to the phone platform.</p>

<h2 id="older-hardware">Adapting Android 4.0 to Older Hardware and Apps</h2>

<div class="layout-content-row">
  <div class="layout-content-col span-6">

<h4>Phones with virtual navigation controls</h4>
<p>Android apps written for Android 3.0 and later display actions in the action bar. Actions that don't
fit in the action bar or aren't important enough to be displayed at the top level appear in the
action overflow.</p>
<p>Users access the action overflow by touching it in the action bar.</p>

  </div>
  <div class="layout-content-col span-7">

    <img src="../static/content/compatibility_virtual_nav.png">

  </div>
</div>

<div class="layout-content-row">
  <div class="layout-content-col span-6">

<h4>Phones with physical navigation keys</h4>
<p>Android phones with traditional navigation hardware keys don't display the virtual navigation bar at
the bottom of the screen. Instead, the action overflow is available from the menu hardware key. The
resulting actions popup has the same style as in the previous example, but is displayed at the bottom of the screen.</p>

  </div>
  <div class="layout-content-col span-7">

    <img src="../static/content/compatibility_physical_buttons.png">

  </div>
</div>

<div class="layout-content-row">
  <div class="layout-content-col span-6">

<h4>Legacy apps on phones with virtual navigation controls</h4>
<p>When you run an app that was built for Android 2.3 or earlier on a phone with virtual navigation
controls, an action overflow control appears at the right side of the virtual navigation bar. You
can touch the control to display the app's actions in the traditional Android menu styling.</p>

  </div>
  <div class="layout-content-col span-7">

    <img src="../static/content/compatibility_legacy_apps.png">

  </div>
</div>



          
          <div class="layout-content-row content-footer">
            <div class="paging-links layout-content-col span-9">&nbsp;</div>
            <div class="paging-links layout-content-col span-4">
              <a href="#" class="prev-page-link">Previous</a>
              <a href="#" class="next-page-link">Next</a>
            </div>
          </div>
          
        </div>

      </div>

      <div id="page-footer">

        <p id="copyright">
          Except as noted, this content is licensed under
          <a href="http://creativecommons.org/licenses/by/2.5/">
          Creative Commons Attribution 2.5</a>.<br>
          For details and restrictions, see the
          <a href="http://developer.android.com/license.html">Content License</a>.
        </p>

        <p>
          <a href="http://www.android.com/terms.html">Site Terms of Service</a> &ndash;
          <a href="http://www.android.com/privacy.html">Privacy Policy</a> &ndash;
          <a href="http://www.android.com/branding.html">Brand Guidelines</a>
        </p>

      </div>
    </div>

    <script src="../static/jquery-1.6.2.min.js"></script>
    <script>
    var SITE_ROOT = '../';
    </script>
    <script src="../static/default.js"></script>


    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
    var pageTracker = _gat._getTracker("UA-5831155-1");
    pageTracker._trackPageview();
    </script>
  </body>
</html>