web-dev-qa-db-fra.com

Comment centrer ImageView dans une barre d'outils?

Vous avez essayé de centrer un logo dans ma barre d’outils. Lorsque je navigue vers l'activité suivante, l'icône "à la hausse" est présente et l'icône Repousse légèrement mon logo sur la droite. Comment puis-je conserver mon logo au centre de la barre d’outils, sans supprimer l’icône d’aubaine?

Ceci est ma balise de barre d'outils

<Android.support.v7.widget.Toolbar
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="wrap_content"
Android:background="@color/primaryColor"
Android:paddingTop="@dimen/app_bar_top_padding"
app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
app:theme="@style/CustomToolBarTheme">

<ImageView
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:src="@drawable/ic_Android_logo"
    Android:layout_gravity="center"
    Android:paddingBottom="3dp"/>
 </Android.support.v7.widget.Toolbar>
androidandroid-actionbarimageviewcentertoolbar
14
Spike Flail

Dans javadoc , il est écrit:

Une ou plusieurs vues personnalisées. L'application peut ajouter des vues enfant Arbitraires à la barre d'outils. Ils apparaîtront à cette position dans la présentation . Si Toolbar.LayoutParams d'une vue enfant indique une valeur de Gravity De CENTER_HORIZONTAL, la vue va tenter de se centrer dans l'espace disponible de Dans la barre d'outils après que Ait été utilisé. mesurée.

Cela signifie que vous ne pouvez le faire que si vous créez une toolbar personnalisée ou supprimez la icon.

5
T D Nguyen

Vous pouvez le faire comme suit cela fonctionne pour moi:

<Android.support.v7.widget.Toolbar
        Android:id="@+id/mainToolbar"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:background="?attr/colorPrimary"
        Android:minHeight="@dimen/abc_action_bar_default_height_material">

        <RelativeLayout
            Android:layout_width="fill_parent"
            Android:layout_height="fill_parent"
            Android:gravity="center">
            <ImageView
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:src="@drawable/headerLogo"
                Android:contentDescription="@string/app_name" />
            </RelativeLayout>

    </Android.support.v7.widget.Toolbar>
10
Kenan Begić

Vous pouvez le faire par programmation, c’est la seule façon pour moi de centrer complètement un logo dans la barre d’outils.

Ajouter à votre activité:

@Override
public void onWindowFocusChanged(boolean hasFocus){

    // set toolbar logo to center programmatically
    Toolbar toolbar = (Toolbar) findViewById(R.id.main_toolbar);
    ImageView logo = (ImageView) findViewById(R.id.logo);
    int offset = (toolbar.getWidth() / 2) - (logo.getWidth() / 2);
    // set
    logo.setX(offset);

}

et votre toolbar_main.xml:

<?xml version="1.0" encoding="utf-8"?>

<Android.support.v7.widget.Toolbar
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:id="@+id/main_toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"
    Android:background="@color/bg_yellow"
    Android:elevation="4dp"
    Android:fontFamily="@string/font_family_thin"
    app:contentInsetStartWithNavigation="0dp"
    Android:layout_gravity="center_horizontal">

    <TextView
        Android:id="@+id/title_toolbar"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:fontFamily="@string/font_family_light"
        Android:textColor="@color/text_dark_xxx"
        Android:textSize="@dimen/text_default"
        Android:layout_centerVertical="true"
        />

    <ImageView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        app:srcCompat="@drawable/logo"
        Android:id="@+id/logo"
        Android:paddingTop="5dp" />



</Android.support.v7.widget.Toolbar>
3
Rodrigo Queiroz

Définissez l'image en tant qu'arrière-plan de la barre d'outils et non en tant que vue enfant.

<Android.support.v7.widget.Toolbar
    Android:id="@+id/detail_toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:minHeight="?android:attr/listPreferredItemHeight"
    Android:background="@drawable/my_image"
    app:theme="@style/CustomToolBarTheme">
2
Jesus Almaral

Je suis un peu en retard pour répondre à cette question, mais j'ai une solution merveilleuse

 <Android.support.design.widget.AppBarLayout 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="wrap_content"
    Android:theme="@style/AppTheme.AppBarOverlay">
<FrameLayout
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content">
    <Android.support.v7.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        app:contentInsetStart="0dp"
        app:contentInsetEnd="0dp"
        app:popupTheme="@style/AppTheme.PopupOverlay">



    </Android.support.v7.widget.Toolbar>
    <RelativeLayout
        Android:layout_width="match_parent"
        Android:gravity="center"
        Android:layout_height="wrap_content">


        <ImageView
            Android:layout_width="wrap_content"
            Android:layout_height="?attr/actionBarSize"
            Android:contentDescription="@string/app_name"
            Android:id="@+id/logoImageView"
            Android:layout_centerInParent="true"
            Android:adjustViewBounds="true"
            Android:src="@drawable/toolbar_background" />
    </RelativeLayout>
</FrameLayout>


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

et voici mon toolbar_background.xml dessinable

<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item>
    <shape Android:shape="rectangle">
        <solid Android:color="@color/colorPrimary" />
    </shape>
</item>
<item>
    <bitmap
        Android:src="@drawable/splash" Android:gravity="center"
        />
</item>

 output here

2
Umar Ata

Pour les développeurs qui utilisent vector drawable ou images SVG .
Cela peut être votre arrière-plan pour la barre d’outils, drawable_toolbar_background.xml 

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item>
        <shape Android:shape="rectangle">
            <solid Android:color="@color/primary"/>
        </shape>
    </item>
    <item
        Android:width="@dimen/toolbar_app_icon_width"
        Android:height="@dimen/toolbar_app_icon_height"
        Android:drawable="@drawable/ic_app_logo"
        Android:gravity="center"/>
</layer-list>

et Oui, vous devez fixer la largeur et la hauteur de l'élément à l'intérieur de l'élément imprimable , bien que le vecteur imprimable ait déjà une taille fixe.
Ceci est votre vue de la barre d’outils,

<Android.support.v7.widget.Toolbar
    Android:id="@+id/toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@drawable/drawable_toolbar_background"
    Android:minHeight="?attr/actionBarSize"
    Android:theme="?attr/actionBarTheme"/>
2
Rana Ranvijay Singh

Vous devez utiliser le widget AppBarLayout avec le widget Barre d'outils et définir la variable contentInsetStart sur 0dp. Sinon, la barre d’outils aura environ 8dp de remplissage au début (pour insérer les boutons de navigation si nécessaire)

Voici le code de travail:

<Android.support.design.widget.AppBarLayout
    Android:id="@+id/appBar"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_alignParentStart="true"
    Android:layout_alignParentTop="true"
    Android:fitsSystemWindows="false"
    Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

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

        <ImageView
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            Android:layout_gravity="left"
            Android:adjustViewBounds="true"
            Android:scaleType="centerInside"
            Android:src="@drawable/company_logo" />

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


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

Assurez-vous également que vous utilisez ?attr/actionBarSize comme hauteur pour la barre d’outils, car il s’agit de la hauteur par défaut de la barre action et s’adaptera à toutes les tailles d’écran.

1
Moh Kh

La solution la plus simple qui fonctionne même avec les actions de menu présentes est la suivante:

 <Android.support.design.widget.AppBarLayout
    Android:id="@+id/apbMain"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    app:theme="@style/AppTheme.AppBarOverlay">

    <Android.support.v7.widget.Toolbar
        Android:id="@+id/tlbMain"
        Android:layout_width="match_parent"
        Android:layout_height="?android:actionBarSize"
        app:navigationContentDescription="@null"
        app:title="@null"
        app:subtitle="@null"
        app:popupTheme="@style/AppTheme.PopupOverlay">

            <ImageButton
                Android:id="@+id/btnBack"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:paddingTop="12dp"
                Android:paddingBottom="12dp"
                Android:scaleType="centerInside"
                Android:background="@null"
                Android:onClick="onBackClickListener"
                Android:src="@drawable/ic_navigation_back"
                Android:visibility="@{showBackBtn ? View.VISIBLE : View.INVISIBLE}" />

            <ImageView
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_margin="10dp"
                Android:layout_gravity="center"
                Android:src="@drawable/toolbar_icon" />

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

</Android.support.design.widget.AppBarLayout>
0
Ali Kazi