Android ManchesterWeek 7 - Rich & Responsive Layouts

Overview

● Retro○ Lesson 5 rich & responsive layouts

● Looking Forward○ Lesson 6 services & notifications

● Stickers● Next Tues is the last retro● Next Tues 7-8pm SpacePortX

Energizer

Stand up and introduce yourself to somebody around you, you don’t know

Prime Directive

‘Regardless of where we are up to, we understand and truly believe that everyone did the best job he or she could, given his or her skills and abilities, the personal time available, and the situation at hand.’

Difficulty Check● Who completed the class?

● How long did it take?

● Hands up 1-10 difficulty of the weeks lesson

● Any specific areas of the lesson that require particular focus?

Retro lesson 4 rich & responsive layouts

What we learnt last week● Design principles● Views & ViewGroups● ViewHolder pattern● Optimising layouts with hierarchy viewer● Resource folders with buckets & qualifiers● Fragments● Custom Views

Design Principles

● Enchant me● Simplify my life● Make me amazing

http://developer.android.com/design/get-started/creative-vision.html

● 30 seconds to win people over● Suprise & delight● Subtle animations● Contribute to a feeling of power

and effortlessness● Touch & interact with objects

directly

Wireframes

Visual Mocks

Views & ViewGroups

● Views are just rectangles on the screen● Manages drawing & event handling ● TextFields● Buttons● Spinners● Progress bars

http://developer.android.com/design/building-blocks/index.html

ViewGroup

● Container for children views● ViewGroup is a View

Gravity

● android:layout_ - parent inherits this attribute

Padding & Margin

● android:layout_ - parent inherits this attribute

Implementing list item

Implementing list item

● Protip - use tools:src / tools:text● Preview in design pane

layout_weight

● Use weight to absorb any extra space● Prefer to use ratios of 100● android:layout_width=”0dip”● android:layout_weight=”33”

Binding data to views

● newView● bindView● Remember to remove hardcoded values

(or did you use android:tools)

Adapter view types

● getViewTypeCount● getItemViewType(position)

ViewHolder pattern

● findViewById() is a heavy call that does view hierarchy traversal

● Remove unnecessary calls to findViewById()● stored in the “tag” field of the view, setTag(Object) getTag()

Hierarchy ViewerFrom a terminal, launch hierarchyviewer from the <sdk>/tools/directory.

http://developer.android.com/tools/debugging/debugging-ui.html

Resource buckets

Resource folders

Resource drawables

http://developer.android.com/guide/practices/screens_support.html#dips-pels

Master Detail Flow

Fragment separation

Fragment design patterns

Headless Fragments

● setRetainInstance(true);● Lives separate from the Activity● Doesn’t create a view● Doesn’t need to be destroyed & recreated● Lifecycle is slightly different● Great for networking● Holding cache data

Visual Mocks

Redlines

Developer Options

Show layout bounds

Custom views

● Class extends View or SurfaceView (Video +Games)

● onMeasure and onDraw usually overridden

● Referred to in Layout file as:

What went well

What went well

● Wireframing first always give me a better insight into what layouts to use

● Understanding navigation should always be done by an Activity

● Headless fragments are a powerful feature● Fragments and rotation● Themes & Styles● Accessibility Developer Checklist is great http:

//developer.android.com/guide/topics/ui/accessibility/checklist.html

What didn’t go so well

What didn’t go so well

● android:gravity vs android:layout_gravity is so confusing

● ActionBar● Flag to remember if you’re in a 2-pane layout or

single-pane● User icon naming convention “ic_”● Lesson has a lot of stuff to cover● having v21 & v14 styles is a lot of overhead

Q&AFree money: http://goo.gl/JHulAu

Next Week - Android Jam

Services & Notifications

Next Lesson - Services & Notifications

Learning Objectives:- Background work & Services- Efficient data transferring- Sync Adapters- Notifications- Final Project

See you next week..

- Time: Tuesday 7pm - Place: SpacePort- Things needed: You + Questions +

Feedback- Can contact us if issues:

@blundell_apps / @android_mcr

Go forth and discuss