CollapsingToolbarLayout | Défilement et les problèmes d'implantation 2
Questions Liées
CollapsingToolbarLayout | Défilement et les problèmes d'implantation
Fond d'écran
Je veux utiliser 2 différents fragments qui va me permettre de modifier la mise en page basée sur l'orientation et la taille de l'écran
- Image d'en-tête (Actuellement juste un
ImageView
) - Contenu défilant
Questions
-
La
CollapsingToolbarLayout
ne me permet pas d'élargir leToolbar
pour voir la pleinHeader Image
- Il montre qu'une majorité de l'image, mais pas tous.
Top
est coupé, mais le fond est visible.
- Il montre qu'une majorité de l'image, mais pas tous.
-
La
Toolbar
est fixé àPin
mais elle est cachée lorsque le défilement- Juste le
Header Image
devrait disparaître, mais au lieu de tout mon Appbar obtient caché
- Juste le
-
Lors du défilement pour afficher l'
Expanded Toolbar
il y a une vue vide jusqu'à ce que leExpanded Toolbar
atteint sa hauteur maximum.- Après le
Expanded Toolbar
et laToolbar
devenir lui-même caché
- Après le
-
La
Up Arrow
ne s'affiche pas dans laToolbar
Code
Layout.xml
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
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="wrap_content"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="16dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|enterAlways">
<ImageView
android:id="@+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/download"
android:scaleType="centerCrop" />
<android.support.v7.widget.Toolbar
android:id="@+id/anim_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="@+id/anim_toolbar"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<fragment
android:id="@+id/detail"
android:name="<package>.<fragment_name>"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
OnCreate
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.test);
final Toolbar toolbar = (Toolbar) findViewById(R.id.anim_toolbar);
setSupportActionBar(toolbar);
CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
collapsingToolbar.setTitle("Avengers: Age of Ultron");
}
1
2
3
4
5
6
- L'ajout de
exitUntilCollapsed
à la CollapsingToolbarLayout devrait fixer un point au moins. - Autre chose que vous pouvez retirer est
layout_below
sur le NestedScrollView.
InformationsquelleAutor Christopher Rucinski | 2015-06-17
Vous devez vous connecter pour publier un commentaire.
Question 1
Ajouter
android:fitsSystemWindows="true"
à votreAppBarLayout
,CollapsingToolbarLayout
, et à votreImageView
.Je devine une partie de votre image est en dessous de la barre d'état (en raison de ces lignes étant manquant), qui est pourquoi vous ne pouvez pas voir le haut de l'image.
Question 2
collapseMode="pin"
seulement affecte la façon dont la Barre d'outils réagit à l'effondrement (donc pourquoi il est appelécollapseMode
et passcrollFlags
).Dans presque tous cas lors de l'utilisation de
CollapsingToolbarLayout
, vous devriez être en utilisantscroll|exitUntilCollapsed
pour votrescrollFlags
- cela permet de maintenir l'effondrement de la Barre d'outils visible même lorsque vous faites défiler vers le bas.Question 3
Cela est dû à l'utilisation de
scroll|enterAlways
. Changer vos drapeaux, comme par #2Question 4
Comme mentionné dans la réponse à vos question, vous devez appeler
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
pour afficher le bouton:setDisplayShowHomeEnabled(true)
pour la Barre d'outils, sinon le titre disparaît. Seulement ensemblesetDisplayHomeAsUpEnabled(true)
Supprimer
app:contentScrim="?attr/colorPrimary"
à partir de votre mise en page XML dansCollapsingToolBarLayout
tag. Il montrera sur le bouton précédent de la barre d'outilsSupprimer ces deux lignes de Imageview