Denver Droids: UI

My first ever Android presentation. Uploaded for posterity.

Transcript

1. Crea%ng(UI(the(Smart/Kid(Way( Dave(Smith( April(20,(2011( @devunwired(
2. Who(is(this(guy?( •  Mobile(Developer((Android(&(iOS)( •  Recovering(Spark(Chaser( – Embedded(Systems( – Hardware(Integrator( •  Co/Author(of(Android(Recipes( – Shameless(Plug(&(Giveaway(
3. 10,000(Foot(View( •  UI(Libraries( •  Using(Resources(to(make(DIY(Easier( – Screen(Support( – Rota%on( •  Sample(Applica%on(
4. Google’s(UI(Design(PaWerns( •  Dashboard( •  Ac%on(Bar( •  Quick(Ac%on( Images(Courtesy(of(androiduipaWerns.com(
5. Use(a(Library.((Move(on.( •  DashboardLayout( –  Roman(Nurik(@(Google( –  Custom(Layout(for(Dashboard(Grids( –  gist.github.com/882650( •  GreenDroid( –  Requires(a(custom(Applica%on(class((Boo)( –  Ac%onBar( –  QuickAc%on( –  AsyncImageView( –  github.com/cyrilmoaer/GreenDroid( •  Ac%onBarSherlock( –  Drop/in(Widget( –  Honeycomb(Compa%ble(Ac%onBar( –  github.com/JakeWharton/Ac%onBarSherlock( •  CommonsWare(Android(Components((CWAC)( –  EndlessAdapter( –  ColorMixer( –  github.com/commonsguy(
6. GreenDroid(Sample(Demo( •  Ac%onBar( – Ac%onBarItem( – LoaderAc%onBarItem( •  QuickAc%on( •  AsyncImageView(
7. How(Android(Classifies(Screens( •  Size( –  Small((<3")( –  Normal((3"/5")( –  Large((5"/7")( –  xLarge((7"/10";(Android(2.3)( •  Density( –  Low((ldpi)( •  75%(MDPI( –  Medium((mdpi)( –  High((hdpi)( •  150%(MDPI( –  Xtra/High((xhdpi;(Android(2.2)( •  200%(MDPI( •  Eek!((That's(16(Different(Configura%ons(to(support!(…Not(really(
8. Recipe(for(Phone(UI( •  Scale(Images(for(all(Densi%es( •  Build(Layouts(for(one(size( res/drawable( res/drawable/ldpi( res/drawable/mdpi( res/drawable/hdpi( res/layout( res/layout/land( •  Shut(out(tablets(by(adding(the(following(manifest(item:( <uses-feature !android:name="android.hardware.telephony"/>!
9. Recipe(for(Adding(Tablet(Support( •  Double(your(MDPI(Assets(Resolu%ons( •  Add(layouts(for(larger(screens( res/layout/large( res/layout/large/land( res/layout/xlarge( res/layout/xlarge/land( •  "3.0(only"(support(can(use(the(v11(qualifier(instead( res/layout/v11( res/layout/v11/land( •  Shut(out(phones(by(adding(the(following(manifest(item:( <supports-screens! !!android:smallScreens="false"! !!android:normalScreens="false"/>!
10. Smart(Kids(Use(XML( •  Use(XML(whenever(possible!( –  Android(itself(has(more(lines(of(XML(than(any(other( language((Java,(C,(or(C++)…learn(from(that.( –  XML(Resources(are(inherently(scalable( •  Shapes( •  Gradients( •  Selectors((Color,(Image)( •  Place(all(XML(drawables(into(res/drawable( –  Resolu%on(Independent( •  9/Patches(are(annoying,(try(to(avoid(them(
11. Suppor%ng(Rota%on( •  Why(should(I?((It's(Hard!( – Tablets(are(na%ve(landscape( – Physical(keyboard(devices( •  Plus…it's(not(that(hard.( •  Ease(the(pain(by(handling( yourself(where(possible,(and( locking(where(appropriate.(
12. The(Problem( •  Tradi%onal(Rota%on(destroys(the(Ac%vity(and( then(recreates(it.( – This(requires(saving(of(UI(state( – It's(slow( – WTH(do(we(do(with(running(background( opera%ons?(
13. Easy(Road:(Lock(It!( •  Some%mes,(locking(an(Ac%vity(is(appropriate( – Video(Player(or(Camera(Overlay(always(displaying( in(Landscape( •  To(lock,(simply(add( android:screenOrientation="portrait"(or( android:screenOrientation="landscape"(to( the(<activity>(element( – Locking(is(per(Ac%vity,(not(global(to(the( applica%on(
14. Smart/Kid(Road:(Handle(It(Yourself( •  Tell(Android(to(no%fy(you(of(the(change,(and(you'll(take(care(of(the( upkeep( •  Add(android:configChanges="keyboardHidden|orientation"(to( the(<activity>(element( •  Implement(onConfigurationChanged()(in(the(Ac%vity(code.( •  Android(will(not(destroy(your(Ac%vity( •  If(you(do(not(have(separate(resources((layouts,(etc.)(for(landscape( vs.(portrait…you're(done!( •  If(you(DO(have(a(special("layout/land"(or(the(like,(a(quick(call(to( setContentView()(will(redraw(your(view(with(the(right(resources.( –  You(will(also(have(to(reaWach(any(pointers(grabbed(through( findViewById()! •  No(other(state(need(be(saved(or(restored.!
15. Fixing(a(Tradi%onal(Headache( •  With(tradi%onal(rota%on,(persis%ng(objects(is( s%ll(a(mess.( •  A(background(opera%ons((like(AsyncTask)(can't( be(stuffed(in(a(Bundle.( •  onRetainNonConfigurationInstance()( – Pass(any(single(object(across(a(rota%on(life/cycle.( •  getLastNonConfigurationInstance()! – Retrieve(the(object(upon(re/crea%on.(
16. Let's(Play(With(Some(Code!(