web-dev-qa-db-fra.com

Le meilleur moyen de créer une barre d'outils inférieure dans Android.

Sample Toolbar

Vous recherchez une bonne approche pour réaliser une barre d'outils similaire. Dois-je utiliser des boutons d'image ??

androidlayoutmaterial-design
13
Ved Agarwal
<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/actionbarT"
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:background="@drawable/thebackgroundimageyouwant"
Android:minHeight="?attr/actionBarSize"
app:theme="@style/Base.Theme.AppCompat.CompactMenu" >

    <LinearLayout
        Android:id="@+id/toolbarmenucontainer"
        Android:layout_width="match_parent"
        Android:weightSum="3"
        Android:layout_height="match_parent"
        Android:orientation="horizontal" >

        <ImageButton
            Android:layout_width="0dp"
            Android:layout_height="match_parent"
            Android:background="@drawable/preferedbackground"
            Android:clickable="true"
            Android:scaleType="fitXY"
            Android:layout_weight = "1"
            Android:src="@drawable/preferredimage" />

         <ImageButton
            Android:layout_width="0dp"
            Android:layout_height="match_parent"
            Android:background="@drawable/preferedbackground"
            Android:clickable="true"
            Android:scaleType="fitXY"
            Android:layout_weight = "1"
            Android:src="@drawable/preferredimage" />

        <ImageButton
            Android:layout_width="0dp"
            Android:layout_height="match_parent"
            Android:background="@drawable/preferedbackground"
            Android:clickable="true"
            Android:scaleType="fitXY"
            Android:layout_weight = "1"
            Android:src="@drawable/preferredimage" />

    </LinearLayout>

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

l'idée est qu'ils se disposeront horizontalement comme celui que vous voulez, aussi ne faites pas ToolBar.setTitle() ou setnagivation sur le ToolBar aussi vous n'avez pas besoin d'y ajouter des optionsMenu. il sera donc nu comme celui que vous voulez.

essayez-le et voyez s'il correspond à vos besoins, n'oubliez pas d'ajouter l'arrière-plan et l'image src aux ImageButtons

12
Elltz

Je sais que cette question est super ancienne, mais je pense qu'il n'est jamais trop tard pour répondre aux autres peuples qui recherchent la même chose. Je viens de trouver ce tutoriel et ces documents officiels sur le sujet maintenant que les navs du bas sont officiellement supportées par Android et font partie de la les consignes de conception matérielle si votre application dispose de 3 à 5 emplacements de navigation de niveau supérieur. J'espère que cela aide quelqu'un d'autre, car j'ai passé un bon moment à chercher cela.

6
AlexW.H.B.

J'ai partagé ma solution sur GitHub. C'est pour Xamarin mais les dispositions sont les mêmes.

http://behsaadramez.com/2015/11/26/androidbottomtoolbar/

2
Behsaad Ramez

Je suis revenu à cette question quelque temps en arrière. Je n'ai pas pu ajouter de texte sous les boutons. J'ai écrit un article sur la façon dont j'ai résolu le problème avec l'extrait de code et la capture d'écran ici, créez goolge plus comme la barre d'outils dans Android

1
aks

Eh bien, la dernière fois que j'ai essayé de le faire, j'ai utilisé Buttons au bas de la mise en page enveloppée par un LinearLayout, quelque chose comme ceci:

<LinearLayout>
// The other stuff on the view
(...)
</LinearLayout>
// (This is the part you can try to use as a toolbar)
<LinearLayout
    Android:orientation="horizontal"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content">

    <Button
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_gravity="bottom"
        style="?android:attr/borderlessButtonStyle"
        Android:textStyle="bold"
        Android:background="@drawable/button_tab"
        Android:textColor="#ffffffff"
        Android:text="@string/bt_orders"
        Android:id="@+id/bt_orders"
        Android:layout_weight="1" />

    <Button
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_gravity="bottom"
        style="?android:attr/borderlessButtonStyle"
        Android:textStyle="bold"
        Android:background="@drawable/button_tab"
        Android:textColor="#ffffffff"
        Android:text="@string/bt_credit"
        Android:id="@+id/bt_credit"
        Android:layout_weight="1" />
</LinearLayout>

Et si vous êtes curieux de connaître le style et le fond que j'ai utilisés, voici:

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

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:state_pressed="true">
        <shape Android:shape="rectangle">
            <stroke
                Android:width="1dp"
                Android:color="@color/button_pressed" />
            <solid Android:color="@color/button_pressed" />
        </shape>
    </item>
    <item Android:state_focused="true" >
        <shape Android:shape="rectangle">
            <stroke
                Android:width="1dp"
                Android:color="@color/button_focus" />
            <solid Android:color="@color/button_focus" />
        </shape>
    </item>
    <item>
        <shape Android:shape="rectangle">
            <stroke
                Android:width="1dp"
                Android:color="@color/button_normal" />
            <solid Android:color="@color/button_normal" />
        </shape>
    </item>
</selector>
0
Mauker