Android: Pin TabLayout nach oben von Scrollview

Question

Ich schaute auf die Twitter-App auf meinem Handy.

Sie können sehen, dass, wenn ein Benutzer einen Bildlauf nach oben, eigentlich die tabLayout nur Stifte sich auf der Unterseite der Symbolleiste schön und überhaupt nicht bewegen.

Ich dachte, vielleicht haben sie es nur durch die gesamten oberen Teil der App (auf dem Rasen das Profilbild, das Profil Tapete des Fahrrads, der Text) setzen, in eine CollapsingToolBarLayout und AppBarLayout aber eigentlich nur die Profiltapeten mit dem Fahrrad auf dem Rasen ist Teil des CollapsingToolBarLayout und AppBarLayout, da dies der einzige Teil ist, der tatsächlich kollabiert. Der Textteil scrollt einfach nach oben und der TabLayout setzt sich nur unterhalb der Symbolleiste an.

Ich habe die Credits auf der Twitter App gelesen und es scheint, dass sie das SlidingTabLayout verwendet haben, um ihre Wirkung zu erzielen. SlidingTabLayout ist ähnlich wie TabLayout, wobei Letzteres in der Support-Bibliothek unterstützt wird.

Es sieht aus wie ein recht häufiges Muster, das auch von den Mainstream-Anwendungen heutzutage verwendet wird -

Google+ App es in ihrem Profil Blick auf die App verwendet:

Facebook Moments verwendet sie in ihrer App:

Irgendeine Idee, wie sie alle geschafft haben, dies zu tun?

Ich möchte etwas ähnliches zu all diesen Apps machen.

Meine Anforderungen sind:

1. eine collapsingToolBarLayout haben, dass, wenn Sie
2. eine Textview unter dem collapsingToolBarLayout haben nach oben
kollabiert, die unter dem toolBar würde scrollen und „verstecken“, wenn es zusammenbricht vollständig.
3. Haben Sie eine TabLayout unterhalb der Textansicht, die "Stick" auf der TabLayout, wenn Sie die Textansicht unter der kollabierendenToolBarLayout scrollen.
4. Haben Sie einen recyclerview unter dem tabLayout so dass, wenn Sie in der tabLayout auf jeden Registerkarte klicken, recyclerview zwischen Listen von „Tweets“, „Fotos“, „Favoriten“ usw.

Ich sah zwei Schalter wird Andere Fragen, die über SO gestellt wurden:

Can the tab selection indicator of TabLayout be pinned to the top of the screen while scrolling?. Die Antwort hier scheint das Verhalten des TabLayouts zu ändern, aber ich bezweifle, dass das Ändern des Verhaltens tatsächlich das erzeugt, was die Twitter App tut. Wie ich bereits erwähnt habe, scheint die tabLayout außerhalb der CollapsingToolBarLayout und AppBarLayout sitzen und das Verhalten sollte nur wirksam sein, wenn es innerhalb der CollapsingToolBarLayout und AppBarLayout sitzt.

How to pin TabLaout at top of ScrollView?. Diese Frage fragt nach etwas ähnlich dem, was ich gefragt habe, gibt aber nicht genug Details und hat keine Antworten.

Answer 1

für die ersten drei Fragen suchen here

Wie für den 4. Sie Fragmente für jede Registerkarte erstellen müssen und sie laden, wenn sie für einen einfachen Ansatz ausgewählt werden, oder Sie können ein Fragment erstellen und kommunizieren mit ihm zeigen spezifische Inhalte, wenn ein Tab ausgewählt ist ..

EDIT keine aktualisierte Link so hier finden konnten, sind die Antworten

1. Verwenden CoordinaterLay aus.
2. Alle Objekte, die Sie mit der Symbolleiste ausblenden (oder ausblenden) möchten, werden in collapsingToolBarLayout angezeigt.
3. Alles, was nach der minimierten ToolBar bleibt, wird nach CollapsingToolbarLayout in AppBarLayout eingefügt.

ex -

<android.support.design.widget.CoordinatorLayout 
    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="match_parent" 
    android:background="@android:color/background_light" 
    android:fitsSystemWindows="true" 
    > 

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

     <android.support.design.widget.CollapsingToolbarLayout 
      android:id="@+id/main.collapsing" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_scrollFlags="scroll|exitUntilCollapsed" 
      android:fitsSystemWindows="true" 
      app:contentScrim="?attr/colorPrimary" 
      app:expandedTitleMarginStart="48dp" 
      app:expandedTitleMarginEnd="64dp" 
      > 

      <ImageView 
       android:id="@+id/main.backdrop" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:scaleType="centerCrop" 
       android:fitsSystemWindows="true" 
       android:src="@drawable/material_flat" 
       app:layout_collapseMode="parallax" 
       /> 

      <android.support.v7.widget.Toolbar 
       android:id="@+id/main.toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="?attr/actionBarSize" 
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
       app:layout_collapseMode="pin" 
       /> 
     <!-- ADD ANY THING THAT GETS SCROLLED ALL THE WAY UP WITH TOOLBAR --> 
     </android.support.design.widget.CollapsingToolbarLayout> 

    <!--- ADD TAB_LAYOUT HERE---> 

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

    <android.support.v4.widget.NestedScrollView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" 
     > 

     <TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:textSize="20sp" 
      android:lineSpacingExtra="8dp" 
      android:text="@string/lorem" 
      android:padding="@dimen/activity_horizontal_margin" 
      /> 
    </android.support.v4.widget.NestedScrollView> 

    <android.support.design.widget.FloatingActionButton 
     android:layout_height="wrap_content" 
     android:layout_width="wrap_content" 
     android:layout_margin="@dimen/activity_horizontal_margin" 
     android:src="@drawable/ic_comment_24dp" 
     app:layout_anchor="@id/main.appbar" 
     app:layout_anchorGravity="bottom|right|end" 
     /> 
</android.support.design.widget.CoordinatorLayout> 

Answer 2

Standardmäßig ist möglicherweise keine Bibliothek vorhanden, die dies unterstützt. Aber Sie können es tatsächlich mit etwas Programmierung erreichen. Hören Sie sich die Scrollview-Ereignisse über ViewTreeObserver an und manipulieren Sie andere. Wenn Sie immer noch nicht sicher sind, machen wir eine Bibliothek dafür. Du machst eine App und poste in GitHub, ich werde zusammenarbeiten, damit es funktioniert.

Answer 3

Die nächste Lösung, um die oben genannten zu erreichen, ist MaterialViewPager. Es ist ein guter Ausgangspunkt, Sie können es nach Belieben anpassen und für Ihre eigenen Vorlieben ändern, und Sie können es auf viele Arten anpassen.