Make Your Android UI Rock Everywhere http://developer.motorola.com

1. Working with Multiple Screens Make Your Android UI Rock Everywhere

2. Suzanne Alexandra Android Developer Advocate, Motorola @suzalex http://moto.ly/samples © 2010 Motorola Mobility, Inc. All rights reserved except as otherwise explicitly indicated.

3. Why does it matter?

4. Make users happy Extend your reach

5. Size really mattersPause & Watch DialingWandhttp://moto.ly/dialingwand

6. Key Point #1Choose your target devices

7. Android 1.5? QVGA? Global? As of November 2010, developer.android.com

8. FLIPOUT DROID PRO DROID X

9. Comparing resolution DROID X480 x 854 Normal DROID PRO320 x 480 Normal FLIPOUT320 x 240 Small

10. Comparing resolution DROID XHigh240 dpi DROID PROMedium160 dpi FLIPOUTLow120 dpi

12. Key Point #2Start with a fewsimple guidelines.

13. Pause the slides & watch the PhotoDemo video on YouTube

14. Adjust your AndroidManifestfor versions and screen sizes.

15. <uses-sdk android:minSdkVersion= "7" android:targetSdkVersion= "8" />

16. <supports-screens android:largeScreens= "true" android:normalScreens="true" android:smallScreens="true" android:anyDensity="true" />

18. Test thoroughly on your targetSdkVersion

21. BonusScreen orientation and performance

22. Use adaptable measurements,like dip and sp.

23. Low 1 dip = 0.75 pixels High 1 dip = 1.5 pixels Medium 1 dip = 1 pixel What’s a DIP? A pixel that changes size

24. Pause the slides & Watch the RelativeLayout video on YouTube

25. Use one set of images andlet Android scale them, for now. But we’ll look at this more later.

27. Key Point #3 Add custom resources as needed, but watch performance.

28. Add custom layouts, if you need them.But you might not.

31. Custom resource sets for low, medium, and high density?

32. Target the most commonly used density?

35. 150% for high 100% for normal 75% for low

36. Memory vs file size PhotoOne 32 MBmemory 324 KB size PhotoThree 23 MBmemory 728 KB size

37. In other words Autoscaling uses memory.Custom image sets increase file size.

38. What happens if you load a really big image into a small view?

39. You might get No image Or a memory error

40. Your application UI can behave differently across devicesor in different conditionsdue to memory

41. Pause the slides & Watch the handling images video on YouTube

42. private Bitmap loadBitmap() { DisplayMetrics metrics = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetrics(metrics); int screenDensity = metrics.densityDpi; BitmapFactory.Options options = new BitmapFactory.Options(); options.inJustDecodeBounds = false; options.inSampleSize = 4; options.inScaled = true; options.inTargetDensity = screenDensity; Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.clover, options); return bitmap; }

43. If you need to detect density at runtimeandroid.util.DisplayMetricsis cool

44. Pause the slides &Watch the detecting device density video on YouTube

45. 240 and 1.5 120 and 0.75 160 and 1.0

46. public void checkDensity() { DisplayMetrics metrics = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetrics(metrics); String logical_density = Float.toString(metrics.density); Log.e (TAG, "Logical density is " + logical_density); // for API level 4 (Android 1.6) and forward String screen_density = Integer.toString(metrics.densityDpi); Log.e (TAG, "Screen density is " + screen_density); }

47. Key Point #4 Touch and gesture are key. Make sure they’re density independent too.

48. Pause the slides &Watch the buttons video on YouTube

49. <ImageButton android:id="@+id/button" android:src="@drawable/button" android:clickable="true" android:layout_gravity="center_vertical|center_horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@null" android:padding="40dip" />

50. 16 pixels 3.3 mm 1.7 mm 2.5 mm

51. private static final float DISTANCE_DIP = 16.0f; private static final float PATH_DIP = 40.0f; // convert dip measurements to pixels final float scale = getResources().getDisplayMetrics().density; scaledDistance = (int) ( DISTANCE_DIP * scale + 0.5f ); scaledPath = (int) ( PATH_DIP * scale + 0.5f );

52. Okay .. Remember the key points?

54. Start with a few simple guidelines.

55. Add custom resources as needed, but watch performance.

58. Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.

59. Neither the name of the Motorola, Inc. nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission. THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. Other source code displayed in this presentation may be licensed under Apache License, Version 2 Copyright © 2010, Android Open Source Project. All rights reserved unless otherwise explicitly indicated. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0. Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. DROID is a trademark of Lucasfilm Ltd. and its related companies. Used under license.