8

Ho trovato molte risposte relative alla barra degli strumenti ma nessuna delle risposte potrebbe aiutarmi.Barra degli strumenti estesa con visualizzazione personalizzata non visualizzata con larghezza intera

Quello che sto cercando di ottenere è di avere una barra degli strumenti estesa che visualizzerà un logo, possibilmente un nome dell'Attività/App, avrà un pulsante di azione/cassetto a destra che visualizzerà una navigazione- come un cassetto a destra, un menu di overflow con altre opzioni come le impostazioni e anche una scheda di navigazione nella parte inferiore che consentirà all'utente di spostarsi tra diversi frammenti (diversi giorni in un mese).

Il modo in cui sto cercando di ottenerlo è tramite la barra degli strumenti. Per prima cosa creo la barra degli strumenti e aggiungo la mia vista personalizzata.

<?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/toolbar_actionbar" 
     android:layout_width="match_parent" 
     android:layout_height="@dimen/min_double_toolbar_height" 
     app:theme="@style/ThemeOverlay.AppCompat.ActionBar" 
     android:minHeight="?attr/actionBarSize" 
     android:background="@color/primary" 

     app:contentInsetStart="0dp" 
     app:contentInsetEnd="0dp" 
     app:contentInsetLeft="0dp" 
     app:contentInsetRight="0dp" 
     android:clipToPadding="false" 
     > 
     <!-- ThemeOVerlay Makes sure the text and items are using solid colors--> 

     <include 
      android:layout_width="match_parent" 
      android:layout_height="72dp" 
      android:layout_gravity="bottom" 
      layout="@layout/day_navigation_tab" 
      /> 

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

day_navigation_tab dista orizzontale con due viste dell'immagine con imbottitura di 72dp (come da linee guida) e una vista testo con peso la layout impostato a 1, in modo che si estende per tutto lo spazio disponibile. E un'altezza di 72 dpi.

Ora nel mio BaseActivity XML ho includono la barra degli strumenti nella Framelayout del contesto principale (in caso contrario la barra degli strumenti coprirebbe l'intero schermo per un motivo sconosciuto per me (mi ha portato le età per figre che fuori))

<...ommited> 

    <FrameLayout 
     android:id="@+id/container" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 
     <include 
      android:id="@+id/toolbar" 
      layout="@layout/app_bar" 
      /> 
    </FrameLayout> 

    <!-- android:layout_gravity="start" tells DrawerLayout to treat 
     this as a sliding drawer on the left side for left-to-right 
     languages and on the right side for right-to-left languages. 
     If you're not building against API 17 or higher, use 
     android:layout_gravity="left" instead. --> 
    <!-- The drawer is given a fixed width in dp and extends the full height of 
     the container. --> 
    <fragment android:id="@+id/navigation_drawer" 
       android:layout_width="@dimen/navigation_drawer_width" 
       android:layout_height="match_parent" 
       android:layout_gravity="right" 
       android:name="alterway.agency.timeentry.NavigationDrawerFragment" 
       tools:layout="@layout/fragment_navigation_drawer" 
       app:layout="@layout/fragment_navigation_drawer" 
    /> 


</android.support.v4.widget.DrawerLayout> 

Tuttavia, quando utilizzo la barra degli strumenti, gonfio il menu di ActionBar in onCreateOptionsMenu, la mia vista personalizzata si restringe e non estende il limite delle opzioni create. Una foto qui sotto illustra meglio, Si tratta di uno screenshot da una vista di progettazione in Android Studio. Il rettangolo giallo indica dove saranno posizionati gli elementi di opzione. Viola indica la dimensione originale in DesignView. Il nero indica la dimensione durante l'esecuzione dell'app.

Design View of the toolbar

Grazie per qualsiasi aiuto.

Domande correlate che potrebbero essere utili a chiunque si imbatte in questo cercando di risolvere un problema simile:

+0

Come stai aggiungendo il barra degli strumenti per l'attività? Stai usando 'setSupportActionBar (Toolbar)'? –

+0

@Lady_ari: Sì, lo sto facendo. C'è un altro modo? Inoltre, se voglio aggiungere un titolo e un'icona, ecc., Dovrei farlo prima di impostare la barra degli strumenti o dovrei modificare l'oggetto che ottengo quando chiamo getSupportActionBar()? –

+0

Penso che sia meglio usare 'getSupportActionBar()' per modificare il titolo della barra degli strumenti, ecc. –

risposta

16

Quindi, per ottenere questo risultato e avere il controllo completo sull'imbottitura nel barra degli strumenti ho creato due barre degli strumenti.La prima barra degli strumenti con altezza standard di 56dp e seconda con altezza di 72dp che insieme hanno creato una barra degli strumenti a doppio strato, come specificato dalla progettazione del materiale.

E poiché non sto gonfiando nessuna voce di menu nella seconda barra degli strumenti, tutte le mie visualizzazioni in cusotm si comportano come desiderato.

Queste linee devono ancora essere usato se

app:contentInsetStart="0dp" 
    app:contentInsetEnd="0dp" 
    app:contentInsetLeft="0dp" 
    app:contentInsetRight="0dp" 
    android:clipToPadding="false" 

Ciò ha risolto il mio problema così ora sto tra cui due barre degli strumenti nel mio xml.

+0

Questa è stata l'unica cosa che ha funzionato per me. Grazie per l'idea geniale: imposta una barra degli strumenti come supportoAzioneBar() e usane un'altra per i nostri layout personalizzati. – Chaitanya

+0

Grazie per questo, mi ha salvato il tempo ~ – SwordBearer

1

Dalla documentazione Toolbar:

Una o più viste personalizzate. L'applicazione può aggiungere viste arbitrarie di child alla barra degli strumenti. Appariranno in questa posizione all'interno del layout . Se Toolbar.LayoutParams di una vista secondaria indica un valore Gravity di CENTER_HORIZONTAL, la vista tenterà di centrare lo spazio disponibile nella barra degli strumenti nello spazio dopo che tutti gli altri elementi sono stati misurati con .

Così da come sembra, la visualizzazione personalizzata si comporta come dovrebbe. Il menu delle opzioni occupa una certa quantità di spazio nella barra degli strumenti, pertanto la barra degli strumenti misura lo spazio rimanente per la visualizzazione personalizzata.

+0

Sì, va bene. Ciò ha senso. Ho pensato a un modo per aggirarlo. Lo proverò e ti farò sapere. E non posso revocare in questo momento perché non ho abbastanza rep:/ –

+0

Va bene. Felice di aiutare! –

+0

@JoeSovcik Sei riuscito a capire questo problema. Mi sono rotto la testa su questo problema da ore ormai! –

4

poiché le versioni 23 delle librerie di supporto di progettazione c'è un modo molto più semplice per farlo usando android.support.design.widget.CoordinatorLayout

Questo è un esempio:

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true"> 

    <android.support.design.widget.AppBarLayout 
     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="wrap_content" 
      app:popupTheme="@style/AppTheme.PopupOverlay">    
     </android.support.v7.widget.Toolbar> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:background="@color/project_light_green" 
      android:orientation="horizontal" 
      android:paddingLeft="@dimen/activity_horizontal_margin_half" 
      android:paddingRight="@dimen/activity_horizontal_margin_half" 
      android:paddingTop="@dimen/activity_vertical_margin_half"> 

      <ImageView 
       android:layout_width="24dp" 
       android:layout_height="24dp" 
       android:layout_margin="12dp" 
       android:src="@drawable/ic_search_24dp" /> 

      <EditText 
       android:id="@+id/search_field" 
       android:layout_width="0dp" 
       android:layout_height="48dp" 
       android:layout_weight="1" 
       android:background="@null" 
       android:hint="@string/autocomplete_hint" 
       android:singleLine="true" 
       android:textColor="@color/project_black" 
       android:textColorHint="@color/project_dark_gray"/> 

      <include layout="@layout/close_button" 
       android:id="@+id/clearButton"/> 

     </LinearLayout> 

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

    <include layout="@layout/content_search_location" /> 

</android.support.design.widget.CoordinatorLayout> 

enter image description here

+0

La risposta più utile lì. –

Problemi correlati