Download pdf - Mastering the Master Detail Pattern

Copyright © 2013 CommonsWare, LLC

Mastering the Master/Detail

Pattern

AnDevCon SF 2013


Who Made You the Master?

● Master/Detail Pattern– Master = a collection of content

● Title/display name● Other metadata

– Detail = specifics about one piece of content● Pattern

– Show master or detail on smaller screens– Show master and detail on larger screens


Who Made You the Master?

Image courtesy of Google and AOSP


Stamping Out a Template

● Master/Detail Flow App Template– Option in Eclipse when creating a new project– Results

● Two activities (master/detail and detail-only)● Two fragments (master and detail)● Four layouts (plus a layout alias)● Always single-pane or dual-pane, based on screen

size


Nuking an Activity

● One Activity/Two Fragments– In single-pane mode, Activity executes a

FragmentTransaction to replace list with detail● Adds to back stack to allow BACK to reverse the

transaction and return to master

– In dual-pane mode, just shows both fragments


Nuking an Activity

● Pros– One less activity (class, manifest, etc.)– Not limited by Intent extras


Nuking an Activity

● Cons: Too Many Scenarios– Do we have a master fragment in the FragmentManager?

● If yes, is it visible? Should it be?– Do we have a detail fragment in the FragmentManager?

● If yes, is it visible? Should it be?– What happens when the user presses BACK?

– What happens if we rotate the screen and change strategies?


Slip Sliding Away

● SlidingPaneLayout– Android Support package– Handles complexity for you

● Single-pane vs. dual-pane● Swipe gesture to show, hide master in single-pane

mode● All the configuration change idiosyncrasies


Slip Sliding Away

● SlidingPaneLayout Pros– Simplicity

● SlidingPaneLayout Cons– Confusion over swipe gesture– Detail-first single-pane flow

● Can be fixed, requires a bit of extra code


Yet More Horizontal Swiping

● ViewPager– ViewGroup, attached to a PagerAdapter

● FragmentPagerAdapter, FragmentStatePagerAdapter, or custom implementation

– Horizontal swipes move between pages– Optional “indicators” to show where the user is

in the sea of pages



● ViewPager and Design– “On a phone, since the master and detail are on

separate screens, this typically requires the user to jump back and forth between the list and the detail view, aka "pogo-sticking".”

– “In cases where users will want to view multiple detail items in succession, avoid pogo-sticking by using the swipe gesture to navigate to the next/previous detail view.”





● ViewPager in Master/Detail– Single-Pane: Consider ViewPager for Detail

● Swipe between peer details● BACK to return to master● Ideal: context provided by content, so no tabs, etc.

– Dual-Pane: Probably Not Necessary● Can randomly access any detail via master pane, so

swiping not necessary



● ViewPager Challenges– Switching Between Single-Pane/Dual-Pane

● Fragment*PagerAdapter is very “grabby”, does not like others messing with its contents

● Net: need another PagerAdapter implementation

– Yet More Collisions with Horizontal Swipe Gestures

● Probably need to skip SlidingPaneLayout


Lights Mode! Camera Mode! Action Mode!

● Action Modes– A.k.a., contextual action bar– Replaces regular action bar for contextual

actions● When 1+ selected for such actions● Can perform actions upon group of selected items,

such as “delete” or “move”

– Dismissed via Done or BACK



● Action Modes and Design– Replacement for old-style context menu– Trigger Options

● Always-available checklist● Long-press to select first, moves into a multi-select

mode



● Action Modes and Master/Detail– Master should support action modes

● Exception: no relevant actions (unlikely)● Read-only vs. read-write actions● Emphasis on multiple-selection scenario

– Detail should support actions● Single-pane: action bar● Dual-pane: action bar and action mode



● Action Mode Challenges– Multiple Flavors of Master List Highlighting

● Single-pane: regular or multiple-selection● Dual-pane: activated or multiple-selection

– Detail in Multiple-Selection?● First detail? Last detail? Empty? Special content?

– Retaining Action Mode and Selections● Configuration changes, etc.


But Wait! There's More!

● Presentation– What do we do when there is a secondary

screen?● Splitter

– Should we allow resizing of panes in dual-pane mode?


But Wait! There's More!

● Action Bar Items– Need to ensure change properly

● Moving between master, detail in single-pane mode● Reasonable blend of both in dual-pane mode

● Navigation Drawer– Yet more conflict with horizontal gestures– Fallacy of the “bezel swipe”



CWAC-MasterDetail

● Canned “best practices” in reusable form● Objectives

– Maximum adherence to design guidelines– Minimum additional code to plug in your content


CWAC-MasterDetail

● Library Usage– Subclass MasterDetailActivity– Override buildMasterDetailHelper(),

returning instance of own subclass of MasterDetailHelper

– Override buildPagerAdapter() and buildModelCollection() in MasterDetailHelper

– Beer!


CWAC-MasterDetail

● Library Functionality, Today– Automatic handling of configuration changes– ViewPager in single-pane mode– Splitter support– Custom empty views (list, detail) and

multiple-choice view (detail)– Optional action mode support– Optional custom master contents


CWAC-MasterDetail

● Library Functionality, Future– Undo bar– Display vs. edit modes for detail– Presentation support– Filtering support– Ordered list support– And more!