blob: d6e59f572037a8c4487455e6394ceaa59e59fd6c [file] [log] [blame]
Roman Nurik73790462011-12-22 16:18:19 -08001<!DOCTYPE html>
2<html lang="en">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5 <title>
6
7Android Design - Backwards Compatibility
8 </title>
9 <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
10 <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:regular,medium,thin,italic,mediumitalic">
11 <link rel="stylesheet" href="../static/yui-3.3.0-reset-min.css">
12 <link rel="stylesheet" href="../static/default.css">
13
14 </head>
15 <body>
16
17 <div id="page-container">
18
19 <div id="page-header"><a href="../index.html">Android Design</a></div>
20
21 <div id="main-row">
22
23 <ul id="nav">
24
25 <li class="nav-section">
26 <div class="nav-section-header"><a href="../index.html">Get Started</a></div>
27 <ul>
28 <li><a href="../get-started/creative-vision.html">Creative Vision</a></li>
29 <li><a href="../get-started/principles.html">Design Principles</a></li>
30 <li><a href="../get-started/ui-overview.html">UI Overview</a></li>
31 </ul>
32 </li>
33
34 <li class="nav-section">
35 <div class="nav-section-header"><a href="../style/index.html">Style</a></div>
36 <ul>
37 <li><a href="../style/devices-displays.html">Devices and Displays</a></li>
38 <li><a href="../style/themes.html">Themes</a></li>
39 <li><a href="../style/touch-feedback.html">Touch Feedback</a></li>
40 <li><a href="../style/metrics-grids.html">Metrics and Grids</a></li>
41 <li><a href="../style/typography.html">Typography</a></li>
42 <li><a href="../style/color.html">Color</a></li>
43 <li><a href="../style/iconography.html">Iconography</a></li>
44 <li><a href="../style/writing.html">Writing Style</a></li>
45 </ul>
46 </li>
47
48 <li class="nav-section">
49 <div class="nav-section-header"><a href="../patterns/index.html">Patterns</a></div>
50 <ul>
51 <li><a href="../patterns/new-4-0.html">New in Android 4.0</a></li>
52 <li><a href="../patterns/gestures.html">Gestures</a></li>
53 <li><a href="../patterns/app-structure.html">App Structure</a></li>
54 <li><a href="../patterns/navigation.html">Navigation</a></li>
55 <li><a href="../patterns/actionbar.html">Action Bar</a></li>
56 <li><a href="../patterns/multi-pane-layouts.html">Multi-pane Layouts</a></li>
57 <li><a href="../patterns/swipe-views.html">Swipe Views</a></li>
58 <li><a href="../patterns/selection.html">Selection</a></li>
59 <li><a href="../patterns/notifications.html">Notifications</a></li>
60 <li><a href="../patterns/compatibility.html">Compatibility</a></li>
61 <li><a href="../patterns/pure-android.html">Pure Android</a></li>
62 </ul>
63 </li>
64
65 <li class="nav-section">
66 <div class="nav-section-header"><a href="../building-blocks/index.html">Building Blocks</a></div>
67 <ul>
68 <li><a href="../building-blocks/tabs.html">Tabs</a></li>
69 <li><a href="../building-blocks/lists.html">Lists</a></li>
70 <li><a href="../building-blocks/grid-lists.html">Grid Lists</a></li>
71 <li><a href="../building-blocks/scrolling.html">Scrolling</a></li>
72 <li><a href="../building-blocks/spinners.html">Spinners</a></li>
73 <li><a href="../building-blocks/buttons.html">Buttons</a></li>
74 <li><a href="../building-blocks/text-fields.html">Text Fields</a></li>
75 <li><a href="../building-blocks/seek-bars.html">Seek Bars</a></li>
76 <li><a href="../building-blocks/progress.html">Progress &amp; Activity</a></li>
77 <li><a href="../building-blocks/switches.html">Switches</a></li>
78 <li><a href="../building-blocks/dialogs.html">Dialogs</a></li>
79 <li><a href="../building-blocks/pickers.html">Pickers</a></li>
80 </ul>
81 </li>
82
Roman Nurika53b3bf2012-02-29 11:59:32 -080083 <li class="nav-section">
84 <div class="nav-section-header empty"><a href="../downloads/index.html">Downloads</a></div>
85 </li>
86
Roman Nurik73790462011-12-22 16:18:19 -080087 <li>
Roman Nurikc894fb72012-01-10 23:59:20 -080088 <div id="back-dac-section"><a href="../../index.html">Developers</a></div>
Roman Nurik73790462011-12-22 16:18:19 -080089 </li>
90
91 </ul>
92
93 <div id="content">
94
95
96 <div class="layout-content-row content-header">
97 <div class="layout-content-col span-9">
98 <h2>Backwards Compatibility</h2>
99 </div>
100 <div class="paging-links layout-content-col span-4">
101 <a href="#" class="prev-page-link">Previous</a>
102 <a href="#" class="next-page-link">Next</a>
103 </div>
104 </div>
105
106
107
108
109<p>Significant changes in Android 3.0 included:</p>
110<ul>
111<li>Deprecation of navigation hardware keys (Back, Menu, Search, Home) in favor of handling navigation
112 via virtual controls (Back, Home, Recents).</li>
113<li>Robust pattern for the use of menus in action bars.</li>
114</ul>
115<p>Android 4.0 brings these changes for tablets to the phone platform.</p>
116
Roman Nurika53b3bf2012-02-29 11:59:32 -0800117<h2 id="older-hardware">Adapting Android 4.0 to Older Hardware and Apps</h2>
Roman Nurik73790462011-12-22 16:18:19 -0800118
119<div class="layout-content-row">
120 <div class="layout-content-col span-6">
121
122<h4>Phones with virtual navigation controls</h4>
123<p>Android apps written for Android 3.0 and later display actions in the action bar. Actions that don't
124fit in the action bar or aren't important enough to be displayed at the top level appear in the
125action overflow.</p>
126<p>Users access the action overflow by touching it in the action bar.</p>
127
128 </div>
129 <div class="layout-content-col span-7">
130
131 <img src="../static/content/compatibility_virtual_nav.png">
132
133 </div>
134</div>
135
136<div class="layout-content-row">
137 <div class="layout-content-col span-6">
138
139<h4>Phones with physical navigation keys</h4>
140<p>Android phones with traditional navigation hardware keys don't display the virtual navigation bar at
141the bottom of the screen. Instead, the action overflow is available from the menu hardware key. The
142resulting actions popup has the same style as in the previous example, but is displayed at the bottom of the screen.</p>
143
144 </div>
145 <div class="layout-content-col span-7">
146
147 <img src="../static/content/compatibility_physical_buttons.png">
148
149 </div>
150</div>
151
152<div class="layout-content-row">
153 <div class="layout-content-col span-6">
154
155<h4>Legacy apps on phones with virtual navigation controls</h4>
156<p>When you run an app that was built for Android 2.3 or earlier on a phone with virtual navigation
157controls, an action overflow control appears at the right side of the virtual navigation bar. You
158can touch the control to display the app's actions in the traditional Android menu styling.</p>
159
160 </div>
161 <div class="layout-content-col span-7">
162
163 <img src="../static/content/compatibility_legacy_apps.png">
164
165 </div>
166</div>
167
168
169
170
171 <div class="layout-content-row content-footer">
172 <div class="paging-links layout-content-col span-9">&nbsp;</div>
173 <div class="paging-links layout-content-col span-4">
174 <a href="#" class="prev-page-link">Previous</a>
175 <a href="#" class="next-page-link">Next</a>
176 </div>
177 </div>
178
179 </div>
180
181 </div>
182
183 <div id="page-footer">
184
185 <p id="copyright">
186 Except as noted, this content is licensed under
Roman Nurikc894fb72012-01-10 23:59:20 -0800187 <a href="http://creativecommons.org/licenses/by/2.5/">
Roman Nurik73790462011-12-22 16:18:19 -0800188 Creative Commons Attribution 2.5</a>.<br>
189 For details and restrictions, see the
Roman Nurikc894fb72012-01-10 23:59:20 -0800190 <a href="http://developer.android.com/license.html">Content License</a>.
Roman Nurik73790462011-12-22 16:18:19 -0800191 </p>
192
193 <p>
Roman Nurikc894fb72012-01-10 23:59:20 -0800194 <a href="http://www.android.com/terms.html">Site Terms of Service</a> &ndash;
195 <a href="http://www.android.com/privacy.html">Privacy Policy</a> &ndash;
196 <a href="http://www.android.com/branding.html">Brand Guidelines</a>
Roman Nurik73790462011-12-22 16:18:19 -0800197 </p>
198
199 </div>
200 </div>
201
202 <script src="../static/jquery-1.6.2.min.js"></script>
203 <script>
204 var SITE_ROOT = '../';
205 </script>
206 <script src="../static/default.js"></script>
207
208
209 <script type="text/javascript">
210 var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
211 document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
212 </script>
213 <script type="text/javascript">
214 var pageTracker = _gat._getTracker("UA-5831155-1");
215 pageTracker._trackPageview();
216 </script>
217 </body>
218</html>