SlideShare una empresa de Scribd logo
1 de 25
Descargar para leer sin conexión
AnDevCon SF 2013

Mastering the
Master/Detail
Pattern
Copyright © 2013 CommonsWare, LLC
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
Copyright © 2013 CommonsWare, LLC
Who Made You the Master?

Copyright © 2013 CommonsWare, LLC
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
Copyright © 2013 CommonsWare, LLC
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

Copyright © 2013 CommonsWare, LLC
Nuking an Activity
●

Pros
–

One less activity (class, manifest, etc.)

–

Not limited by Intent extras

Copyright © 2013 CommonsWare, LLC
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?

Copyright © 2013 CommonsWare, LLC
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

Copyright © 2013 CommonsWare, LLC
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

Copyright © 2013 CommonsWare, LLC
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
Copyright © 2013 CommonsWare, LLC
Yet More Horizontal Swiping
●

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.”
Copyright © 2013 CommonsWare, LLC
Yet More Horizontal Swiping

Copyright © 2013 CommonsWare, LLC
Yet More Horizontal Swiping
●

ViewPager in Master/Detail
–

Single-Pane: Consider ViewPager for Detail
●
●

BACK to return to master

●

–

Swipe between peer details
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
Copyright © 2013 CommonsWare, LLC
Yet More Horizontal Swiping
●

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
Copyright © 2013 CommonsWare, LLC
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
Copyright © 2013 CommonsWare, LLC
Lights Mode! Camera Mode! Action Mode!
●

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

Copyright © 2013 CommonsWare, LLC
Lights Mode! Camera Mode! Action Mode!
●

Action Modes and Master/Detail
–

Master should support action modes
●
●

Read-only vs. read-write actions

●

–

Exception: no relevant actions (unlikely)
Emphasis on multiple-selection scenario

Detail should support actions
●

Single-pane: action bar

●

Dual-pane: action bar and action mode
Copyright © 2013 CommonsWare, LLC
Lights Mode! Camera Mode! 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.
Copyright © 2013 CommonsWare, LLC
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?

Copyright © 2013 CommonsWare, LLC
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”
Copyright © 2013 CommonsWare, LLC
Copyright © 2013 CommonsWare, LLC
CWAC-MasterDetail
●

Canned “best practices” in reusable form

●

Objectives
–

Maximum adherence to design guidelines

–

Minimum additional code to plug in your content

Copyright © 2013 CommonsWare, LLC
CWAC-MasterDetail
●

Library Usage
–

Subclass MasterDetailActivity

–

Override buildMasterDetailHelper(),
returning instance of own subclass of
MasterDetailHelper

–

Override buildPagerAdapter() and
buildModelCollection() in
MasterDetailHelper

–

Beer!

Copyright © 2013 CommonsWare, LLC
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
Copyright © 2013 CommonsWare, LLC
CWAC-MasterDetail
●

Library Functionality, Future
–

Undo bar

–

Display vs. edit modes for detail

–

Presentation support

–

Filtering support

–

Ordered list support

–

And more!
Copyright © 2013 CommonsWare, LLC

Más contenido relacionado

Destacado

Design pattern in android
Design pattern in androidDesign pattern in android
Design pattern in androidJay Kumarr
 
Physical change review
Physical change reviewPhysical change review
Physical change reviewMelodee Peters
 
Pewter squirrel and acorn
Pewter squirrel and acornPewter squirrel and acorn
Pewter squirrel and acornydoornbos
 
Montageplan kookhulp
Montageplan kookhulpMontageplan kookhulp
Montageplan kookhulpBrutcat
 
Kuinka teen angry bird´s avaimen perän ja kiinnitän mangneetin
Kuinka teen angry bird´s avaimen perän ja kiinnitän mangneetinKuinka teen angry bird´s avaimen perän ja kiinnitän mangneetin
Kuinka teen angry bird´s avaimen perän ja kiinnitän mangneetinThanyaphat Kittinarongkul
 
★Topwell Presentation
★Topwell Presentation★Topwell Presentation
★Topwell PresentationEmily Xu
 
King penguins on scale 1:25 cm
King penguins on  scale 1:25 cmKing penguins on  scale 1:25 cm
King penguins on scale 1:25 cmydoornbos
 
Amazing Candle Arts
Amazing Candle ArtsAmazing Candle Arts
Amazing Candle ArtsDINISHA
 
Clay Process Presentation
Clay Process PresentationClay Process Presentation
Clay Process Presentationpsshakespeare
 
18 Liquid Polymer Clay Techniques For Making Jewelery And Home Accents
18 Liquid Polymer Clay   Techniques For Making Jewelery And Home Accents18 Liquid Polymer Clay   Techniques For Making Jewelery And Home Accents
18 Liquid Polymer Clay Techniques For Making Jewelery And Home AccentsBijouxnatu
 
House Of Wax Presentation
House Of Wax PresentationHouse Of Wax Presentation
House Of Wax Presentationbabbeyrachel
 

Destacado (15)

Design pattern in android
Design pattern in androidDesign pattern in android
Design pattern in android
 
Physical change review
Physical change reviewPhysical change review
Physical change review
 
Pewter squirrel and acorn
Pewter squirrel and acornPewter squirrel and acorn
Pewter squirrel and acorn
 
Unit 2 Clay & Artifacts
Unit 2 Clay & ArtifactsUnit 2 Clay & Artifacts
Unit 2 Clay & Artifacts
 
Montageplan kookhulp
Montageplan kookhulpMontageplan kookhulp
Montageplan kookhulp
 
Kuinka teen angry bird´s avaimen perän ja kiinnitän mangneetin
Kuinka teen angry bird´s avaimen perän ja kiinnitän mangneetinKuinka teen angry bird´s avaimen perän ja kiinnitän mangneetin
Kuinka teen angry bird´s avaimen perän ja kiinnitän mangneetin
 
★Topwell Presentation
★Topwell Presentation★Topwell Presentation
★Topwell Presentation
 
King penguins on scale 1:25 cm
King penguins on  scale 1:25 cmKing penguins on  scale 1:25 cm
King penguins on scale 1:25 cm
 
Amazing Candle Arts
Amazing Candle ArtsAmazing Candle Arts
Amazing Candle Arts
 
Vases & Oasis
Vases & OasisVases & Oasis
Vases & Oasis
 
Clay Process Presentation
Clay Process PresentationClay Process Presentation
Clay Process Presentation
 
18 Liquid Polymer Clay Techniques For Making Jewelery And Home Accents
18 Liquid Polymer Clay   Techniques For Making Jewelery And Home Accents18 Liquid Polymer Clay   Techniques For Making Jewelery And Home Accents
18 Liquid Polymer Clay Techniques For Making Jewelery And Home Accents
 
How do thai clay
How do thai clayHow do thai clay
How do thai clay
 
Kuinka teen thai massan.
Kuinka teen thai massan.Kuinka teen thai massan.
Kuinka teen thai massan.
 
House Of Wax Presentation
House Of Wax PresentationHouse Of Wax Presentation
House Of Wax Presentation
 

Similar a Mastering the Master Detail Pattern

From Android to the Mobile Web
From Android to the Mobile WebFrom Android to the Mobile Web
From Android to the Mobile WebCommonsWare
 
Introducing Honeycomb
Introducing HoneycombIntroducing Honeycomb
Introducing HoneycombCommonsWare
 
What's New in Jelly Bean
What's New in Jelly BeanWhat's New in Jelly Bean
What's New in Jelly BeanCommonsWare
 
Second-Screen Support in Android 4.2
Second-Screen Support in Android 4.2Second-Screen Support in Android 4.2
Second-Screen Support in Android 4.2CommonsWare
 
React - The JavaScript Library for User Interfaces
React - The JavaScript Library for User InterfacesReact - The JavaScript Library for User Interfaces
React - The JavaScript Library for User InterfacesJumping Bean
 
Android design patterns
Android design patternsAndroid design patterns
Android design patternsPlatty Soft
 
Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3
Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3
Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3Paris Android User Group
 
Angular js 1.3 presentation for fed nov 2014
Angular js 1.3 presentation for fed   nov 2014Angular js 1.3 presentation for fed   nov 2014
Angular js 1.3 presentation for fed nov 2014Sarah Hudson
 
Android N multi window
Android N multi windowAndroid N multi window
Android N multi windowYu-Wei Chuang
 
Real World AngularJS recipes: beyond TodoMVC
Real World AngularJS recipes: beyond TodoMVCReal World AngularJS recipes: beyond TodoMVC
Real World AngularJS recipes: beyond TodoMVCCarlo Bonamico
 
Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...
Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...
Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...Codemotion
 
Google I/O 2019 - what's new in Android Q and Jetpack
Google I/O 2019 - what's new in Android Q and JetpackGoogle I/O 2019 - what's new in Android Q and Jetpack
Google I/O 2019 - what's new in Android Q and JetpackSunita Singh
 
Automating Tests with Chrome DevTools Recorder
Automating Tests with Chrome DevTools RecorderAutomating Tests with Chrome DevTools Recorder
Automating Tests with Chrome DevTools RecorderApplitools
 
Win8 development lessons learned jayway
Win8 development lessons learned jaywayWin8 development lessons learned jayway
Win8 development lessons learned jaywayAndreas Hammar
 
Replication with postgres and Getting started with Logical Replication
Replication with postgres and Getting started with Logical ReplicationReplication with postgres and Getting started with Logical Replication
Replication with postgres and Getting started with Logical ReplicationPat Wright
 
New power of Angular2 Router
New power of Angular2 RouterNew power of Angular2 Router
New power of Angular2 RouterZhentian Wan
 
Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...
Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...
Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...Ruth Cheesley
 
The Action Bar: Front to Back
The Action Bar: Front to BackThe Action Bar: Front to Back
The Action Bar: Front to BackCommonsWare
 
Ugnius vaznys tesonet
Ugnius vaznys   tesonetUgnius vaznys   tesonet
Ugnius vaznys tesonetUgniusVaznys
 

Similar a Mastering the Master Detail Pattern (20)

From Android to the Mobile Web
From Android to the Mobile WebFrom Android to the Mobile Web
From Android to the Mobile Web
 
Introducing Honeycomb
Introducing HoneycombIntroducing Honeycomb
Introducing Honeycomb
 
What's New in Jelly Bean
What's New in Jelly BeanWhat's New in Jelly Bean
What's New in Jelly Bean
 
Second-Screen Support in Android 4.2
Second-Screen Support in Android 4.2Second-Screen Support in Android 4.2
Second-Screen Support in Android 4.2
 
React - The JavaScript Library for User Interfaces
React - The JavaScript Library for User InterfacesReact - The JavaScript Library for User Interfaces
React - The JavaScript Library for User Interfaces
 
Android design patterns
Android design patternsAndroid design patterns
Android design patterns
 
Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3
Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3
Introduction to Honeycomb APIs - Android Developer Lab 2011 Q3
 
Angular js 1.3 presentation for fed nov 2014
Angular js 1.3 presentation for fed   nov 2014Angular js 1.3 presentation for fed   nov 2014
Angular js 1.3 presentation for fed nov 2014
 
Android N multi window
Android N multi windowAndroid N multi window
Android N multi window
 
Real World AngularJS recipes: beyond TodoMVC
Real World AngularJS recipes: beyond TodoMVCReal World AngularJS recipes: beyond TodoMVC
Real World AngularJS recipes: beyond TodoMVC
 
Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...
Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...
Real World AngularJS recipes: beyond TodoMVC - Carlo Bonamico, Sonia Pini - C...
 
Google I/O 2019 - what's new in Android Q and Jetpack
Google I/O 2019 - what's new in Android Q and JetpackGoogle I/O 2019 - what's new in Android Q and Jetpack
Google I/O 2019 - what's new in Android Q and Jetpack
 
Automating Tests with Chrome DevTools Recorder
Automating Tests with Chrome DevTools RecorderAutomating Tests with Chrome DevTools Recorder
Automating Tests with Chrome DevTools Recorder
 
Win8 development lessons learned jayway
Win8 development lessons learned jaywayWin8 development lessons learned jayway
Win8 development lessons learned jayway
 
Replication with postgres and Getting started with Logical Replication
Replication with postgres and Getting started with Logical ReplicationReplication with postgres and Getting started with Logical Replication
Replication with postgres and Getting started with Logical Replication
 
How to develop browser extension
How to develop browser extensionHow to develop browser extension
How to develop browser extension
 
New power of Angular2 Router
New power of Angular2 RouterNew power of Angular2 Router
New power of Angular2 Router
 
Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...
Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...
Joomla User Group Suffolk - July 2012 - Crossing the line first or last - per...
 
The Action Bar: Front to Back
The Action Bar: Front to BackThe Action Bar: Front to Back
The Action Bar: Front to Back
 
Ugnius vaznys tesonet
Ugnius vaznys   tesonetUgnius vaznys   tesonet
Ugnius vaznys tesonet
 

Más de CommonsWare

Gradle and Your Android Wearable Projects
Gradle and Your Android Wearable ProjectsGradle and Your Android Wearable Projects
Gradle and Your Android Wearable ProjectsCommonsWare
 
Getting Android Developers for Your Wearables
Getting Android Developers for Your WearablesGetting Android Developers for Your Wearables
Getting Android Developers for Your WearablesCommonsWare
 
When Microwatts Are Precious: Battery Tips for Wearable Apps
When Microwatts Are Precious: Battery Tips for Wearable AppsWhen Microwatts Are Precious: Battery Tips for Wearable Apps
When Microwatts Are Precious: Battery Tips for Wearable AppsCommonsWare
 
Android Security: Defending Your Users
Android Security: Defending Your UsersAndroid Security: Defending Your Users
Android Security: Defending Your UsersCommonsWare
 
Secondary Screen Support Using DisplayManager
Secondary Screen Support Using DisplayManagerSecondary Screen Support Using DisplayManager
Secondary Screen Support Using DisplayManagerCommonsWare
 
Not Quite As Painful Threading
Not Quite As Painful ThreadingNot Quite As Painful Threading
Not Quite As Painful ThreadingCommonsWare
 
Android Development: The 20,000-Foot View
Android Development: The 20,000-Foot ViewAndroid Development: The 20,000-Foot View
Android Development: The 20,000-Foot ViewCommonsWare
 
Maps V2... And You!
Maps V2... And You!Maps V2... And You!
Maps V2... And You!CommonsWare
 
Integrate Android Apps and Web Apps
Integrate Android Apps and Web AppsIntegrate Android Apps and Web Apps
Integrate Android Apps and Web AppsCommonsWare
 
The Wonderful World of Wearables
The Wonderful World of WearablesThe Wonderful World of Wearables
The Wonderful World of WearablesCommonsWare
 
Securing User Data with SQLCipher
Securing User Data with SQLCipherSecuring User Data with SQLCipher
Securing User Data with SQLCipherCommonsWare
 
Beaming Data to Devices with NFC
Beaming Data to Devices with NFCBeaming Data to Devices with NFC
Beaming Data to Devices with NFCCommonsWare
 
Making Money at Mobile: 60 Business Models
Making Money at Mobile: 60 Business ModelsMaking Money at Mobile: 60 Business Models
Making Money at Mobile: 60 Business ModelsCommonsWare
 
AppsWorld Keynote
AppsWorld KeynoteAppsWorld Keynote
AppsWorld KeynoteCommonsWare
 
App Integration (Revised and Updated)
App Integration (Revised and Updated)App Integration (Revised and Updated)
App Integration (Revised and Updated)CommonsWare
 
Rich Text Editing and Beyond
Rich Text Editing and BeyondRich Text Editing and Beyond
Rich Text Editing and BeyondCommonsWare
 
App integration: Strategies and Tactics
App integration: Strategies and TacticsApp integration: Strategies and Tactics
App integration: Strategies and TacticsCommonsWare
 
Backwards Compatibility: Strategies and Tactics
Backwards Compatibility: Strategies and TacticsBackwards Compatibility: Strategies and Tactics
Backwards Compatibility: Strategies and TacticsCommonsWare
 
Android Hardware That's A Little Bit... Odd
Android Hardware That's A Little Bit... OddAndroid Hardware That's A Little Bit... Odd
Android Hardware That's A Little Bit... OddCommonsWare
 

Más de CommonsWare (20)

Gradle and Your Android Wearable Projects
Gradle and Your Android Wearable ProjectsGradle and Your Android Wearable Projects
Gradle and Your Android Wearable Projects
 
Getting Android Developers for Your Wearables
Getting Android Developers for Your WearablesGetting Android Developers for Your Wearables
Getting Android Developers for Your Wearables
 
When Microwatts Are Precious: Battery Tips for Wearable Apps
When Microwatts Are Precious: Battery Tips for Wearable AppsWhen Microwatts Are Precious: Battery Tips for Wearable Apps
When Microwatts Are Precious: Battery Tips for Wearable Apps
 
Android Security: Defending Your Users
Android Security: Defending Your UsersAndroid Security: Defending Your Users
Android Security: Defending Your Users
 
Secondary Screen Support Using DisplayManager
Secondary Screen Support Using DisplayManagerSecondary Screen Support Using DisplayManager
Secondary Screen Support Using DisplayManager
 
Not Quite As Painful Threading
Not Quite As Painful ThreadingNot Quite As Painful Threading
Not Quite As Painful Threading
 
Android Development: The 20,000-Foot View
Android Development: The 20,000-Foot ViewAndroid Development: The 20,000-Foot View
Android Development: The 20,000-Foot View
 
Maps V2... And You!
Maps V2... And You!Maps V2... And You!
Maps V2... And You!
 
Integrate Android Apps and Web Apps
Integrate Android Apps and Web AppsIntegrate Android Apps and Web Apps
Integrate Android Apps and Web Apps
 
X Means Y
X Means YX Means Y
X Means Y
 
The Wonderful World of Wearables
The Wonderful World of WearablesThe Wonderful World of Wearables
The Wonderful World of Wearables
 
Securing User Data with SQLCipher
Securing User Data with SQLCipherSecuring User Data with SQLCipher
Securing User Data with SQLCipher
 
Beaming Data to Devices with NFC
Beaming Data to Devices with NFCBeaming Data to Devices with NFC
Beaming Data to Devices with NFC
 
Making Money at Mobile: 60 Business Models
Making Money at Mobile: 60 Business ModelsMaking Money at Mobile: 60 Business Models
Making Money at Mobile: 60 Business Models
 
AppsWorld Keynote
AppsWorld KeynoteAppsWorld Keynote
AppsWorld Keynote
 
App Integration (Revised and Updated)
App Integration (Revised and Updated)App Integration (Revised and Updated)
App Integration (Revised and Updated)
 
Rich Text Editing and Beyond
Rich Text Editing and BeyondRich Text Editing and Beyond
Rich Text Editing and Beyond
 
App integration: Strategies and Tactics
App integration: Strategies and TacticsApp integration: Strategies and Tactics
App integration: Strategies and Tactics
 
Backwards Compatibility: Strategies and Tactics
Backwards Compatibility: Strategies and TacticsBackwards Compatibility: Strategies and Tactics
Backwards Compatibility: Strategies and Tactics
 
Android Hardware That's A Little Bit... Odd
Android Hardware That's A Little Bit... OddAndroid Hardware That's A Little Bit... Odd
Android Hardware That's A Little Bit... Odd
 

Último

Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Brian Pichman
 
Comparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioComparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioChristian Posta
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Commit University
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Websitedgelyza
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxGDSC PJATK
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1DianaGray10
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesMd Hossain Ali
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfJamie (Taka) Wang
 
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationUsing IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationIES VE
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfDaniel Santiago Silva Capera
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?IES VE
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024D Cloud Solutions
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXTarek Kalaji
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.YounusS2
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureEric D. Schabell
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopBachir Benyammi
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdfPedro Manuel
 

Último (20)

Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
 
Comparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioComparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and Istio
 
20150722 - AGV
20150722 - AGV20150722 - AGV
20150722 - AGV
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Website
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
 
201610817 - edge part1
201610817 - edge part1201610817 - edge part1
201610817 - edge part1
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
 
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve DecarbonizationUsing IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
 
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?
 
Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024Artificial Intelligence & SEO Trends for 2024
Artificial Intelligence & SEO Trends for 2024
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBX
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability Adventure
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
 
20230104 - machine vision
20230104 - machine vision20230104 - machine vision
20230104 - machine vision
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
 

Mastering the Master Detail Pattern

  • 1. AnDevCon SF 2013 Mastering the Master/Detail Pattern Copyright © 2013 CommonsWare, LLC
  • 2. 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 Copyright © 2013 CommonsWare, LLC
  • 3. Who Made You the Master? Copyright © 2013 CommonsWare, LLC Image courtesy of Google and AOSP
  • 4. 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 Copyright © 2013 CommonsWare, LLC
  • 5. 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 Copyright © 2013 CommonsWare, LLC
  • 6. Nuking an Activity ● Pros – One less activity (class, manifest, etc.) – Not limited by Intent extras Copyright © 2013 CommonsWare, LLC
  • 7. 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? Copyright © 2013 CommonsWare, LLC
  • 8. 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 Copyright © 2013 CommonsWare, LLC
  • 9. 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 Copyright © 2013 CommonsWare, LLC
  • 10. 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 Copyright © 2013 CommonsWare, LLC
  • 11. Yet More Horizontal Swiping ● 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.” Copyright © 2013 CommonsWare, LLC
  • 12. Yet More Horizontal Swiping Copyright © 2013 CommonsWare, LLC
  • 13. Yet More Horizontal Swiping ● ViewPager in Master/Detail – Single-Pane: Consider ViewPager for Detail ● ● BACK to return to master ● – Swipe between peer details 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 Copyright © 2013 CommonsWare, LLC
  • 14. Yet More Horizontal Swiping ● 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 Copyright © 2013 CommonsWare, LLC
  • 15. 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 Copyright © 2013 CommonsWare, LLC
  • 16. Lights Mode! Camera Mode! Action Mode! ● 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 Copyright © 2013 CommonsWare, LLC
  • 17. Lights Mode! Camera Mode! Action Mode! ● Action Modes and Master/Detail – Master should support action modes ● ● Read-only vs. read-write actions ● – Exception: no relevant actions (unlikely) Emphasis on multiple-selection scenario Detail should support actions ● Single-pane: action bar ● Dual-pane: action bar and action mode Copyright © 2013 CommonsWare, LLC
  • 18. Lights Mode! Camera Mode! 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. Copyright © 2013 CommonsWare, LLC
  • 19. 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? Copyright © 2013 CommonsWare, LLC
  • 20. 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” Copyright © 2013 CommonsWare, LLC
  • 21. Copyright © 2013 CommonsWare, LLC
  • 22. CWAC-MasterDetail ● Canned “best practices” in reusable form ● Objectives – Maximum adherence to design guidelines – Minimum additional code to plug in your content Copyright © 2013 CommonsWare, LLC
  • 23. CWAC-MasterDetail ● Library Usage – Subclass MasterDetailActivity – Override buildMasterDetailHelper(), returning instance of own subclass of MasterDetailHelper – Override buildPagerAdapter() and buildModelCollection() in MasterDetailHelper – Beer! Copyright © 2013 CommonsWare, LLC
  • 24. 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 Copyright © 2013 CommonsWare, LLC
  • 25. CWAC-MasterDetail ● Library Functionality, Future – Undo bar – Display vs. edit modes for detail – Presentation support – Filtering support – Ordered list support – And more! Copyright © 2013 CommonsWare, LLC