Warum sind die Klickbereiche meiner Schaltflächen in einem CollapsingToolbarLayout zu klein?

Question

Ich habe drei Tasten in einem CollapsingToolbarLayout. Bei der Erweiterung besteht die Idee darin, einen Filter in der angezeigten Bildergalerie zu ändern oder einen Bearbeitungsdialog aufzurufen. Ich erhielt inkonsistente Ergebnisse - die Schaltflächen reagierten nur zeitweise auf Klicks.

Schließlich wurde mir klar, das Problem war, dass der anklickbare Bereich viel kleiner als der Client der Ansicht war. Horizontal erscheinen sie normal, aber vertikal ist der anklickbare Bereich viel kürzer als der Knopf. In dem Emulator konnte ich ziemlich genau erhalten, wie auf die Grenzen:

Sie berühren können sie normalerweise links nach rechts, sondern von oben nach unten ist falsch.

Ich habe versucht, dieses Layout aus verschiedenen Ausschnitten aus den Dokumenten, offiziellen Leitfäden, Online-Tutorials und Open-Source-Codebeispielen zusammenzusetzen. Ich verstehe nicht ganz, wie all die ausgefallenen Support-/Design-Layouts zusammenwirken oder was alle Konfigurationsattribute genau tun, wenn sie kombiniert werden. Daher ist es durchaus möglich, dass das Update eine einfache Änderung eines oder zweier Attribute ist. Hier ist mein Layout:

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:context=".activity.MainActivity"> 

    <android.support.design.widget.AppBarLayout 
     android:id="@+id/appBarLayout" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:fitsSystemWindows="true" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:id="@+id/collapsingToolbarLayout" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:minHeight="?android:actionBarSize" 
      app:layout_scrollFlags="scroll|exitUntilCollapsed|snap" 
      app:contentScrim="?attr/colorPrimary" 
      android:background="?attr/colorPrimary" 
      app:expandedTitleMarginEnd="64dp" 
      app:expandedTitleMarginStart="48dp" 
      android:theme="@style/Widget.Design.CollapsingToolbar"> 

      <LinearLayout 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:gravity="center_horizontal" 
       android:paddingTop="32dp" 
       android:paddingBottom="64dp" 
       android:fitsSystemWindows="true" 
       app:layout_collapseMode="none" 
       android:background="@android:color/transparent" 
       android:orientation="horizontal"> 

       <ImageButton android:id="@+id/btnTags" 
          android:layout_width="64dp" 
          android:layout_height="64dp" 
          android:layout_weight="0.3" 
          android:src="@drawable/ic_tag" 
          android:tint="?android:attr/buttonTint" 
          android:background="@drawable/ripple" /> 

       <ImageButton android:id="@+id/btnAlbums" 
          android:layout_width="64dp" 
          android:layout_height="64dp" 
          android:layout_weight="0.3" 
          android:src="@drawable/ic_albums" 
          android:tint="?android:attr/buttonTint" 
          android:background="@drawable/ripple" /> 

       <ImageButton android:id="@+id/btnNewAlbum" 
          android:layout_width="64dp" 
          android:layout_height="64dp" 
          android:layout_weight="0.3" 
          android:src="@drawable/ic_new_album" 
          android:tint="?android:attr/buttonTint" 
          android:background="@drawable/ripple" /> 

      </LinearLayout> 

      <android.support.v7.widget.Toolbar 
       android:id="@+id/toolbarMain" 
       android:layout_width="match_parent" 
       android:layout_height="?attr/actionBarSize" 
       app:layout_collapseMode="pin" 
       app:title="@string/app_name" 
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
       app:theme="@style/LouvreTheme.ToolbarStyle"/> 

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

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

    <co.moonmonkeylabs.realmrecyclerview.RealmRecyclerView 
     android:id="@+id/recyclerAlbumGrid" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" 
     android:background="?android:attr/background" 
     app:rrvLayoutType="Grid" 
     app:rrvGridLayoutSpanCount="@integer/grid_span" 
     app:rrvIsRefreshable="false" 
     app:rrvSwipeToDelete="false" /> 

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

Dann in meinem onViewCreated() ich jede der Tasten eine OnClickListener zuweisen. Ich kann sie zuverlässig und vorhersehbar auslösen, aber nur durch Klicken in das schmale vertikale Band, das oben abgebildet ist.

Umgehung und Anpassungen Ich habe bereits versucht:

• Wechsel von ImageView s FloatingActionButton s und schließlich ImageButton s
• Slapping android:fitsSystemWindows="true" auf verschiedene Ansichten, einschließlich alle von ihnen
• Schaltfläche Ändern Dimensionen von wrap_content zu explizit die Größe definiert in der VectorDrawable s sie zeigen
• Einstellung android:minHeight auf der LinearLayout auf die gleiche explizite Größe wie die Tasten
• Making the layout_weight jeder Taste 1,0 und Einstellen der Summe auf 3,0
• Der Versuch, die app:layout_collapseMode verschiedentlich als paralax und none auf dem LinearLayout, dass die Häuser mit den Tasten .

Die einzige ähnliche Frage, die ich habe in der Lage SO zu finden auf, ist dies: AppBarLayout and CollapsingToolbarLayout not able to contain Button? keine befriedigende Antwort jemals zur Verfügung gestellt wurde, nur eine Abhilfe für die Taste außerhalb des kollabierenden Bereichs bewegen.

Gedanken?

Answer 1

Stellt sich heraus das Toolbar tatsächlich physisch oben bleibt, obwohl sich mit dem erweiterten Titeltext zu strecken scheint. Dadurch wurden die obersten zwei Drittel meiner Schaltflächen teilweise abgedeckt, was ich nicht erkennen konnte, da der Symbolleistenhintergrund auf transparent gesetzt war. Durch Hinzufügen einer kontrastierenden Hintergrundfarbe zur Symbolleiste wurde deutlich, was gerade geschah.

ich gefunden und getestet zwei einfache Korrekturen:

1. hinzufügen android:layout_marginTop="?android:actionBarSize" zum LinearLayout, die die Tasten wurden das Gehäuse, so wird sie unter der Symbolleiste, in der y-Richtung gezogen.
2. vertauschen Sie die Reihenfolge der Symbolleiste und die Schaltflächen im Layout XML; Der zuletzt definierte Punkt wird oben angezeigt und die Schaltflächen werden vollständig anklickbar.