web-dev-qa-db-fra.com

Android Material Design - Comment changer la couleur d'arrière-plan de la barre d'outils après la réduction de CollapsingToolbarLayout

Une fois que l'utilisateur a fait défiler l'écran, l'image dans le CollapsingToolbarLayout disparaît et laisse une barre d'outils avec le bouton Précédent, le titre du contenu et le menu de paramètres. Je souhaite savoir comment modifier la couleur d'arrière-plan de cette barre d'outils uniquement lorsque son état est "réduit".

L'action à laquelle je fais référence est similaire à celle-ci: la couleur d'arrière-plan de la barre d'outils devient verte:

enter image description here

Au-dessous de CollapsingToolbarLayout j'ai un NestedScrollView avec CardViews

androidmaterial-designandroid-collapsingtoolbarlayout
38
Eli Davila

Je pense que vous êtes après app:contentScrim.

<Android.support.design.widget.CollapsingToolbarLayout
    ...
    app:contentScrim="?attr/colorPrimary">
    <!-- Toolbar and ImageView here -->
</Android.support.design.widget.CollapsingToolbarLayout>
82
Jimeux

D'abord enlever

app:contentScrim="?attr/colorPrimary">

de CollapsingToolbarLayout

Ajouter une bibliothèque

compile 'com.Android.support:palette-v7:23.2.1'

Et ajoutez le code ci-dessous dans Java code

    Bitmap bitmap = BitmapFactory.decodeResource(getApplicationContext().getResources(), R.drawable.ny);
    Palette.generateAsync(bitmap,
            new Palette.PaletteAsyncListener() {
                @Override
                public void onGenerated(Palette palette) {
                    Palette.Swatch vibrant =
                            palette.getVibrantSwatch();
                    int mutedColor = palette.getVibrantSwatch().getRgb();
                    if (vibrant != null) {
                        // If we have a vibrant color
                        // update the title TextView
                        collapseToolbar.setBackgroundColor(mutedColor);
                        //  mutedColor = palette.getMutedColor(R.attr.colorPrimary);
                        collapseToolbar.setStatusBarScrimColor(palette.getDarkMutedColor(mutedColor));
                        collapseToolbar.setContentScrimColor(palette.getMutedColor(mutedColor));

                    }
                }
            });
12
Ashish

Il vous suffit d'utiliser CollapsingToolbarLayout l'attribut XML contentScrim pour définir la couleur d'arrière-plan de Toolbar lorsqu'elle est en mode collapsed.

app:contentScrim="YOUR_TOOLBAR_COLOR"

Voici un exemple:

<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/img_group_photo"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        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="?attr/actionBarSize"
        app:layout_collapseMode="pin"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</Android.support.design.widget.CollapsingToolbarLayout>

J'espère que cela aidera ~

6
Ferdous Ahamed

Peut-être que ce que vous cherchiez est ceci:

myCollapsingToolbar.setContentScrimColor(getResources().getColor(R.color.my_color_id));

Cela a fonctionné pour moi et a changé la couleur de la barre collapsingToolbar une fois celle-ci réduite pour m'aider à ajuster la couleur principale d'une image qui était affichée lorsque la barre collapsingToolbar était à pleine échelle. Avec cela, la couleur peut évidemment être modifiée par programme!

Je sais que je suis en retard, mais j'espère que cela pourrait aider.

2
Olivier L. Applin

Vous pouvez utiliser un écouteur de décalage AppBarLayout et modifier les attributs CollapsingTollbar en fonction du comportement souhaité.

appBarLayout.addOnOffsetChangedListener { _, verticalOffSet ->
            if (Math.abs(verticalOffSet) == appBarLayout.totalScrollRange) {
                //Collapsed
                toolBar.setBackgroundDrawable(ContextCompat.getDrawable(this,
                        R.drawable.last_revolut_gradient))
            } else {
                //Expanded
                toolBar.setBackgroundColor(ContextCompat.getColor(this,
                        Android.R.color.transparent))
            }
        }
0
haroldolivieri