pulse news: porting android app to tablet

ALL SIZES FIT ONEA Thrilling Adventure in Application Design for

Tablets

Monday, September 12, 2011

ALBERT LAI@albertlaiJEAN HSU@jyhsu

ANDROID AT PULSE


SHAMELESS PLUG!


PART Ie Human Component


WHEN DEVELOPERS SAY SOMETHING IS IMPOSSIBLE... THEY’RE LYING


TABLETS ARE A COMPLETELY NEW EXPERIENCE. DESIGN APPROPRIATELY.


NEVER TRUST THE SYSTEM TO DO A HUMAN’S JOB


DIALOGS CAN KEEP YOUR APP FROM LOOKING SILLY


stretchySILLY


dialogBETTER!


USERS ROTATE TABLETS. THIS IS A FACT OF LIFE.


THINK OF HANDHELD AND TABLET-STAND STYLE USAGES


THUMB FRIENDLY NAVIGATIONMonday, September 12, 2011

PART IINow for the Technical Stuff


RELATIVE LAYOUTS ARE AN ANDROID DEVELOPER’S BEST FRIEND


ALIGN PARENT RIGHTCENTER VERTICAL

ALIGN PARENT BOTTOMCENTER HORIZONTAL

ALIGN PARENT TOPALIGN PARENT LEFT


DEFINING A TABLET IS LIKE NAILING JELLO TO A WALL

??????


IS THIS A REALLY BIG PHONE?


OR A REALLY SMALL TABLET?


IT’S DANGEROUS TO GO ALONE. TAKE THESE RESOURCE FOLDERS

large, xlarge mdpi, hdpi, xhdpi


HOW DO YOU KNOW WHAT SIZE DEVICE YOU’RE ON IN CODE?


IN YOUR LAYOUT XML FILE:

<include layout="@layout/screen_size" />


<?xml version="1.0" encoding="utf-8"?><View xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/screen_size_normal" android:layout_width="wrap_content" android:layout_height="wrap_content" android:visibility="gone"/>

layout/theme.xml


http://schemas.android.com/apk/res/android


<?xml version="1.0" encoding="utf-8"?><View xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/screen_size_large" android:layout_width="wrap_content" android:layout_height="wrap_content" android:visibility="gone"/>

layout-large/theme.xml




THERE ARE NO MAGIC NUMBERS.


THERE ARE NO MAGIC NUMBERS.

DIMENS.XMLINTEGERS.XML


NEVER SCALE UP ASSETS. USERS CAN TELL FROM THE PIXELS.


USE A HELPER CLASS FOR THE TRICKIER DIMENSIONS


screen_width / 3


PART IIIHoneycombs


I CAN HAZ FEATURES?


I CAN HAZ FEATURES?

mEditor.apply();

since API Level 9Monday, September 12, 2011

REFLECTION

Method m = SharedPreferences.Editor.class.getMethod("apply");

// ...

if (m != null) {m.invoke(mEditor);

} else { mEditor.commit(); }


WRAPPER

classes not loaded (and verified) until it is called the first time

only load the wrapper class if new functionality exists


PART IVOptimizing for the

Honeycombs


ONE-LINERS FTW

android:hardwareAccelerated="true"

android:targetSdkVersion="11"


MENU PLEASE..

pulse before

??Monday, September 12, 2011

BYOACTION BARS

TextOVERFLOW

NO MENU

LEFT-ALIGNED LOGO ACTIONS


FRAGMENTS (NOT THE BAD KIND)


PART IVAPKs


MULTIPLE APK SUPPORT

PHONE APK

TABLET APK


ONE APK TO RULE THEM ALL

SUPER AWESOME

APK


TEST LIKE YOUR LIFE DEPENDS ON IT

before each releaseand all the timewherever you canon every deviceand every api level


BUT DON’T TAKE OUR WORD FOR IT EXPLORE AND CREATE!


pulse news: porting android app to tablet

Technology

parent topalign parent

nomagic numbers

haz features

jyhsu android

wrapper classes

stretchy sillymonday

api levelmonday

big phone