J'essaie de créer une activité qui a un CollapsingToolbarLayout avec une image et une barre d'outils (comme dans CheeseDetailActivity dans l'exemple de fromagesquare ici ), qui comporte également une disposition d'onglets ci-dessous.
Des idées comment le mettre en application?
En essayant de l'ajouter à CollapsingToolbarLayout ou à AppBarLayout, le résultat est que la disposition des onglets est en haut de l'écran.
Essayez cette structure:
<Android.support.design.widget.CoordinatorLayout
xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:app="http://schemas.Android.com/apk/res-auto"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:layout_height="match_parent">
<Android.support.v4.view.ViewPager
Android:id="@+id/viewpager"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<Android.support.design.widget.AppBarLayout
Android:id="@+id/appbar"
Android:layout_width="match_parent"
Android:layout_height="SPECIFIC HEIGHT HERE!"
Android:fitsSystemWindows="true"
Android:theme="ADD A STYLE HERE IF YOU WANT">
<Android.support.design.widget.CollapsingToolbarLayout
Android:id="@+id/collapsing_toolbar"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
<ImageView
Android:id="@+id/backdrop"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:fitsSystemWindows="true"
Android:scaleType="centerCrop"
Android:src="YOUR SOURCE"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="YOUR MULTIPLIER"
/>
<Android.support.v7.widget.Toolbar
Android:id="@+id/toolbar"
Android:layout_width="match_parent"
Android:layout_height="?attr/actionBarSize"
app:popupTheme="YOUR POPUP THEME">
</Android.support.v7.widget.Toolbar>
<Android.support.design.widget.TabLayout
Android:id="@+id/tabs"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_gravity="bottom"
app:tabGravity="YOUR TAB GRAVITY"
app:tabIndicatorColor="YOUR TAB INDICATOR COLOR"
app:tabMode="YOUR TAB MODE">
</Android.support.design.widget.TabLayout>
</Android.support.design.widget.CollapsingToolbarLayout>
</Android.support.design.widget.AppBarLayout>
</Android.support.design.widget.CoordinatorLayout>
L'attribut important est le layout_gravity
de TabLayout, à savoir bottom .
Pour l’API 21 et les versions antérieures, j’ai rencontré le problème de la disparition de TabLayout. Si vous rencontrez le même problème, utilisez ceci pour TabLayout (pour les API inférieures à 21):
<Android.support.design.widget.TabLayout
Android:id="@+id/tabs"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:fitsSystemWindows="true"
Android:translationY="YOU HAVE TO EXPERIMENT WITH THIS ATTRIBUTE - (in dps)"
app:tabGravity="YOUR TAB GRAVITY"
app:tabIndicatorColor="YOUR TAB INDICATOR COLOR"
app:tabMode="YOUR TAB MODE"
>
Vous devez expérimenter l'attribut translationY
en fonction de la taille que vous avez donnée à la barre d'applications. Vous entrerez une valeur en dps et vous la cliquerez en quelques minutes.
J'espère que cela fonctionne pour vous comme cela a fonctionné pour moi!
Voir aussi ce sample qui aborde le même problème.
Testé sur l'API 14-23. Fonctionne sans aucun problème.
<Android.support.v4.widget.DrawerLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:app="http://schemas.Android.com/apk/res-auto"
xmlns:tools="http://schemas.Android.com/tools"
Android:id="@+id/drawer"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:fitsSystemWindows="true"
tools:context=".MainActivity">
<Android.support.design.widget.CoordinatorLayout
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:fitsSystemWindows="true">
<Android.support.design.widget.AppBarLayout
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:fitsSystemWindows="true"
Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<Android.support.design.widget.CollapsingToolbarLayout
Android:id="@+id/collapsing_toolbar"
Android:layout_width="match_parent"
Android:layout_height="230dp"
Android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
Android:id="@+id/header"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:background="@drawable/header"
Android:fitsSystemWindows="true"
Android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<Android.support.v7.widget.Toolbar
Android:id="@+id/anim_toolbar"
Android:layout_width="match_parent"
Android:layout_height="100dp"
Android:gravity="top"
Android:minHeight="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:titleMarginTop="15dp" />
<Android.support.design.widget.TabLayout
Android:id="@+id/tabs"
Android:layout_width="match_parent"
Android:layout_height="?attr/actionBarSize"
Android:layout_gravity="bottom" />
</Android.support.design.widget.CollapsingToolbarLayout>
</Android.support.design.widget.AppBarLayout>
<Android.support.v4.view.ViewPager
Android:id="@+id/viewpager"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</Android.support.design.widget.CoordinatorLayout>
<Android.support.design.widget.NavigationView
Android:id="@+id/navigation_view"
Android:layout_width="wrap_content"
Android:layout_height="match_parent"
Android:layout_gravity="start"
Android:fitsSystemWindows="true"
app:headerLayout="@layout/header" />
Essaye ça...