a97e177857
Conflicts: docs/html/design/patterns/accessibility.jd docs/html/design/patterns/actionbar.jd docs/html/design/patterns/compatibility.jd docs/html/design/patterns/multi-pane-layouts.jd docs/html/design/style/iconography.jd Change-Id: I349cf8ebc159c0a7ef0796900e2d11fe6e0c888a
58 lines
2.1 KiB
Plaintext
58 lines
2.1 KiB
Plaintext
page.title=Tabs
|
|
page.tags=tabs,actionbar,navigation,viewpager
|
|
@jd:body
|
|
|
|
<img src="{@docRoot}design/media/tabs_overview.png">
|
|
|
|
<a class="notice-developers" href="{@docRoot}training/implementing-navigation/lateral.html">
|
|
<div>
|
|
<h3>Developer Docs</h3>
|
|
<p>Creating Swipe Views with Tabs</p>
|
|
</div>
|
|
</a>
|
|
|
|
<p itemprop="description">Tabs in the action bar make it easy to explore and switch between different views or functional
|
|
aspects of your app, or to browse categorized data sets.</p>
|
|
|
|
<p>For details on using gestures to move between tabs, see the <a href="{@docRoot}design/patterns/swipe-views.html">Swipe Views</a> pattern.</p>
|
|
|
|
<h2 id="scrollable">Scrollable Tabs</h2>
|
|
|
|
|
|
<div class="layout-content-row">
|
|
<div class="layout-content-col span-6">
|
|
|
|
<p>Scrolling tab controls can contain a larger number of items than a standard tab control. To navigate
|
|
to the next/previous view, swipe left or right.</p>
|
|
|
|
</div>
|
|
<div class="layout-content-col span-7">
|
|
|
|
<video width="400" class="with-shadow play-on-hover" autoplay>
|
|
<source src="{@docRoot}design/media/tabs_scrolly.mp4" type="video/mp4">
|
|
<source src="{@docRoot}design/media/tabs_scrolly.webm" type="video/webm">
|
|
<source src="{@docRoot}design/media/tabs_scrolly.ogv" type="video/ogg">
|
|
</video>
|
|
<div class="figure-caption">
|
|
Scrolling tabs in the Play Store app.
|
|
<div class="video-instructions-image"> </div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<h2 id="fixed">Fixed Tabs</h2>
|
|
<p>Fixed tabs display all items concurrently. To navigate to a different view, touch the tab, or swipe left or right.</p>
|
|
<p>Fixed tabs are displayed with equal width, based on the width of the widest tab label. If there is insufficient room to display all tabs, the tab labels themselves will be scrollable. For this reason, fixed tabs are best suited for displaying 3 or fewer tabs.</p>
|
|
|
|
<img src="{@docRoot}design/media/tabs_standard.png">
|
|
<div class="figure-caption">
|
|
Tabs in Holo Dark & Light.
|
|
</div>
|
|
|
|
<img src="{@docRoot}design/media/tabs_youtube.png">
|
|
<div class="figure-caption">
|
|
Tabs in the Google Play Movies app.
|
|
</div>
|