web-dev-qa-db-fra.com

Comment centrer le titre d'un CollapsingToolbarLayout?

J'ai essayé setExpandTitleTextAppearance, mais cela n'a pas fonctionné. Je veux centrer le texte du titre développé.

androidandroid-collapsingtoolbarlayout
22
Javed Khatri

Il existe un attribut expandedTitleGravity que vous pouvez utiliser avec CollapsingToolbarLayout pour centrer le texte du titre développé. Ajoutez ceci à votre CollapsingToolbarLayout:

app:expandedTitleGravity="bottom|center_horizontal"
65
androholic

Dans mon cas d'utilisation, j'ai défini app:titleEnabled à faux, je n'en avais pas besoin de toute façon. Après cela, ma gravité a été correctement respectée dans la disposition de la barre d'outils.

17
Nguyễn Hoàng Anh

@Javed, corrigez-moi si je me trompe, vous voulez que le titre soit centré dans la barre d'outils, puis CollapsingToolbarLayout est réduit et votre mise en page ressemble à ceci, non?

    <Android.support.design.widget.CollapsingToolbarLayout
        Android:id="@+id/collapsing_toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleMarginStart="48dp"
        app:expandedTitleMarginEnd="64dp"
        Android:fitsSystemWindows="true">

        <ImageView
            Android:id="@+id/image"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:scaleType="centerCrop"
            Android:fitsSystemWindows="true"
            app:layout_collapseMode="parallax"/>

        <Android.support.v7.widget.Toolbar
            Android:id="@+id/toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:layout_collapseMode="pin" />

    </Android.support.design.widget.CollapsingToolbarLayout>

Ensuite, vous pouvez faire cette astuce (je le fais dans onCreate of the Activity):

    try {
        Field declaredField = toolbar.getClass().getDeclaredField("mTitleTextView");
        declaredField.setAccessible(true);
        TextView titleTextView = (TextView) declaredField.get(toolbar);
        ViewGroup.LayoutParams layoutParams = titleTextView.getLayoutParams();
        layoutParams.width = ViewGroup.LayoutParams.MATCH_PARENT;
        titleTextView.setLayoutParams(layoutParams);
        titleTextView.setGravity(Gravity.CENTER_HORIZONTAL);
    } catch (Exception e) {
        //"Error!"
    }

La clé est que TextView dans la barre d'outils a la propriété width "Wrap Content", nous devons donc la changer en "Match Parent". (En savoir plus sur cette réflexion ici )

Testé sur Android 5.1.1 et Android 4.3 (devrait fonctionner à peu près partout))

3
Konstantin Loginov

Dans le cas où vous essayez de centrer le titre dans l'état replié, vous pouvez utiliser

Android:paddingEnd="70dp"
Android:paddingRight="70dp"

comme ça:

<Android.support.design.widget.CollapsingToolbarLayout
            Android:id="@+id/collapsing_toolbar"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:paddingEnd="70dp"
            Android:paddingRight="70dp"
            app:collapsedTitleGravity="center_horizontal"        
            app:expandedTitleGravity="start"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <Android.support.v7.widget.Toolbar
                Android:id="@+id/toolbar"
                Android:layout_width="match_parent"
                Android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin">

            </Android.support.v7.widget.Toolbar>

        </Android.support.design.widget.CollapsingToolbarLayout>
2
Bogdan Ustyak

à l'état déployé,

app:expandedTitleGravity="center" 

à l'état effondré,

app:collapsedTitleGravity="center" 

je pense que cela peut vous aider

1
Sharon Joshi

Comme l'a dit Nguyễn Hoàng Anh ci-dessus, définissez app:titleEnabled à faux a fonctionné comme un charme.

Avec cette option activée, après avoir creusé avec l'inspecteur de mise en page, une vue sans nom suspecte est toujours ajoutée devant TextView à l'intérieur de Toolbar, juste après le bouton 'Haut' (si elle est activée) .

Ainsi, même si la gravité de la mise en page fonctionne correctement, une vue suspecte prend le contrôle de tous les espaces supplémentaires à l'intérieur de Toolbar.

1
bskim45

inclure cela dans le xml de la barre d'outils de réduction pour la réduction: app:collapsedTitleGravity="center_vertical|center_horizontal"

pour app:expandedTitleGravity="center_vertical|center_horizontal" étendu

0
Leo Johny Thayyil