In their latest versions of their apps, Google has implemented a pretty cool way of swiping between tabs versus clicking tab headers. I was wondering if someone has more concrete ideas of how this is done.
Here are some thoughts - feel free to critique:
My initial thought is that this isn't a standard TabActivity
which hosts child activities. Infact, I don't even think it's a custom ActivityGroup
either. The row of tabs scrolls when swiped, but doesn't cause the active tab to switch.
Swiping the main content of the tab exhibits interesting behavior. I suspect there is a GestureListener attached to main content area. As tabs are swiped, rows from the adjacent tab become visible. This seems to suggest that this is a horizontally scrollable group of ListView
s. It's almost like a horizontally scrollable HTML div, where all content already exists but comes into view when swiped. I'm not really sure how rendering of the rows is handled though (traditionally, rows are built and displayed when scrolling a list up/down not left/right). So maybe it's a custom ListView
implementation too? When not scrolling side-to-side, it behaves as you would expect a regular ListView
to, including fast-scrolling and glow effect when pulled down.
The row of tabs is probably a ScrollView
, as evidenced by the glow effect when swiped to the edges. The row of the tab contents isn't.
I'm trying to build a mental model of the different pieces that comprise this really nifty piece of UI. Any insights are much appreciated.
the most valuable source of information how to do it perfectly is a source from IO 2011 application
Look into ScheduleFragment and Workspace classes.
Thanks.