Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Android Tablet UI patterns - Split View

DZone's Guide to

Android Tablet UI patterns - Split View

· Mobile Zone
Free Resource

Download this comprehensive Mobile Testing Reference Guide to help prioritize which mobile devices and OSs to test against, brought to you in partnership with Sauce Labs.

Problem
Tablets have much more screen real estate than their smartphone counter parts. To use the space well but still maintain consistency between the smartphone and tablet app a different design approach for showing information is needed.

Solution

Split View is a design approach that is often used on many desktop and web applications. Left side of the screen displays higher level categories and selecting one of them brings detailed info of the selection to the right side of the screen.



Consequences 
  1. Full utilisation of the screen
  2. Consistent information architecture between smartphone and tablet app

Implementation options
Apps use two different implementations of the Split View depending on their data structure.

The simpler approach is to have a constant left side that always shows the same data and only the right side changes based on the selection. This approach is good when the app only has two levels of data, for example, categories and content.

The more complex approach is when the data hierarchy is deeper than two levels. Let's look at minus app as an example. Here is the smartphone UI:


The table app shows contents of two smartphone views at the same time. When user navigates deeper into the data hierarchy the top most view is bumped out from the left and replaced by the content that previously was presented on the right.



Implementing Split View
Split view should be implemented using Android Fragments API. The API manages activity stack automatically and can be used on both smartphones and tablets.

For more info:


Split View gallery





Analysts agree that a mix of emulators/simulators and real devices are necessary to optimize your mobile app testing - learn more in this white paper, brought to you in partnership with Sauce Labs.

Topics:

Published at DZone with permission of Juhani Lehtimaki, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}