Android UI Pattern - Expand in Context

This is a very simple pattern that is not very widely used yet but I believe it will be soon. The idea is very simple, and not even new, but very effective and useful. A phone screen can be very small and often there's way more information about any topic than you can fit on the screen. One option is to make the content scroll but that makes it more difficult to access any information beyond the large scrolling block. Enter expand in context. 

Pattern card

Problem

Available screen real estate is too small for showing all information on the screen. Making the full content visible would demand too much space making other content difficult to reach or the content is dynamic and its size is not know and therefore a maximum size must be set.

Solution

Create an area with maximum (fixed) size where the content is placed. If the content doesn't fit the area users can tap to expand it to show full content.

It is important to show that there is more content available. A typical way to do that is to have a down arrow on the bottom edge of the expandable area.

If the content doesn't contain any additional controls like buttons and links it can ba a good idea to make the whole area one large hit target for expanding the content. In that case the content area should be clearly visually marked as such.

Making the area collapsable after user has expanded it is optional. If collapsing is possible it is important to maintain correct scrolling position in the parent container after collapse is done. Ie. the content must not jump to a different position. 

Consequences 

1. More compact UI that allows better overview of full content.
2. Dynamically loaded content can be safely included in design without having to limit its size.
3. More fluent UI as users don't have to open another screen to view more content.