Come creare una barra degli strumenti con il pulsante personalizzato a sinistra?

Question

Sono nuovo nello sviluppo di Android e ho grossi problemi con la creazione di una barra degli strumenti personalizzata. I miei requisiti:

pulsante

1. personalizzato a sinistra (icona + testo)
2. divisore dopo pulsante personalizzato
3. Bottoni altezza dovrebbe essere lo stesso di barra degli strumenti (senza margini)

Ecco campione immagine che spiega le mie esigenze:

Stavo cercando di usare actionBar.setCustomView(v); ma non ha risolto i miei problemi:

1. pulsanti a destra hanno margine superiore/inferiore - che sono più piccoli di barra degli strumenti
2. non ero in grado di aggiungere il divisore.
3. Il pulsante sinistro (dalla vista personalizzata) era più piccolo dell'altezza della barra degli strumenti.

Le mie domande:

1. Ho davvero bisogno visualizzazione personalizzata per aggiungere pulsante personalizzato a sinistra?
2. Come aggiungere un divisore a sinistra?
3. Come rendere l'altezza dei pulsanti uguale all'altezza della barra degli strumenti?

Answer 1

Il Toolbar è fondamentalmente un FrameLayout modo da poter aggiungere all'interno del layout etichetta quello che vuoi. Nel tuo caso qualcosa di simile alla seguente sembra sufficiente:

layout.xml

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

    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="?attr/actionBarSize" 
     android:divider="@drawable/divider" 
     android:dividerPadding="8dp" 
     android:orientation="horizontal" 
     android:showDividers="end"> 

     <TextView 
      android:id="@+id/toolbar_save" 
      style="@style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:background="?attr/selectableItemBackground" 
      android:drawableLeft="@drawable/ic_action_check" 
      android:drawablePadding="8dp" 
      android:gravity="center_vertical" 
      android:paddingLeft="16dp" 
      android:paddingRight="16dp" 
      android:text="Save" 
      android:textAllCaps="true" /> 

    </LinearLayout> 
</android.support.v7.widget.Toolbar> 

divider.xml

aggiungere questo alla tua cartella /res/drawable. Questo è usato come divisore LinearLayout nel codice sopra.

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"> 

    <size android:width="1dp" /> 

    <solid android:color="@android:color/white" /> 

</shape> 

Codice

private void setupToolbar() { 
    Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar); 
    setSupportActionBar(mToolbar); 
    // Hide the title 
    getSupportActionBar().setTitle(null); 
    // Set onClickListener to customView 
    TextView tvSave = (TextView) findViewById(R.id.toolbar_save); 
    tvSave.setOnClickListener(new View.OnClickListener() { 
     @Override 
     public void onClick(View v) { 
      // TODO 
     } 
    }); 
} 

Per quanto riguarda le voci sul lato destro: è sufficiente utilizzare il metodo predefinito onCreateOptionsMenu e gonfiare i R.menu.* risorsa corrispondente.

Risultato

Answer 2

<android.support.v7.widget.Toolbar 
     android:layout_width="match_parent" 
     android:layout_height="?actionBarSize" 
     app:contentInsetLeft="0dp" 
     app:contentInsetStart="0dp" 
     app:contentInsetStartWithNavigation="0dp" 
     /> 

È inoltre necessario app: contentInsetStartWithNavigation = "0DP" alla barra degli strumenti