Android: pin TabLayout all'inizio di Scrollview

Question

Stavo guardando l'app twitter sul mio telefono.

Si può vedere che quando un utente scorre verso l'alto, il tabLayout realtà solo si perni sul fondo della barra degli strumenti ben e non si muove affatto.

Ho pensato che forse l'hanno fatto semplicemente mettendo tutta la parte superiore dell'app (l'immagine del profilo, lo sfondo del profilo della bicicletta sull'erba, il testo), in un CollapsingToolBarLayout e AppBarLayout ma in realtà, solo il lo sfondo del profilo con la bicicletta sull'erba è parte di CollapsingToolBarLayout e AppBarLayout in quanto questa è l'unica parte che effettivamente collassa. La parte di testo scorre solo verso l'alto e il tabLayout viene semplicemente messo in cima alla barra degli strumenti.

Ho letto i crediti sull'app di Twitter e sembra che abbiano usato lo SlidingTabLayout per ottenere il loro effetto. SlidingTabLayout è simile a tabLayout con quest'ultimo supportato nella libreria di supporto.

Si presenta come un modello abbastanza comune che viene utilizzato da applicazioni tradizionali al giorno d'oggi, come pure -

Google+ app lo usa a loro avviso profilo sul app:

Facebook Momenti lo utilizza nella propria app:

Qualche idea su come sono riusciti a farlo?

Sto cercando di fare qualcosa di simile a tutte queste app.

miei requisiti sono i seguenti:

1. Avere un collapsingToolBarLayout che crolla quando si scorrere verso l'alto
2. Avere un TextView sotto il collapsingToolBarLayout che avrebbe scorrere e "nascondere" sotto la barra degli strumenti quando crolla completamente.
3. Avere un tabLayout sotto la vista testo che si "incollerebbe" al tabLayout quando si scorre la visualizzazione del testo sotto il collapseToolBarLayout.
4. Avere un recyclerview sotto il tabLayout in modo che quando si fa clic su ogni scheda nel tabLayout, recyclerview passa tra le liste di "Tweets", "Foto", "Preferiti", ecc

Ho guardato due altre domande che sono state pubblicate su SO:

Can the tab selection indicator of TabLayout be pinned to the top of the screen while scrolling?. Sembra che la risposta qui stia cambiando il comportamento del tabLayout ma dubito che la modifica del comportamento genererebbe effettivamente ciò che fa l'app di Twitter. Come accennato, il tabLayout sembra essere all'esterno di CollapsingToolBarLayout e AppBarLayout e il comportamento dovrebbe essere efficace solo se si trova all'interno di CollapsingToolBarLayout e AppBarLayout.

How to pin TabLaout at top of ScrollView?. Questa domanda richiede qualcosa di simile a quello che ho chiesto, ma non fornisce dettagli sufficienti e non ha risposte.

Answer 1

per i primi 3 domande guardano here

Per quanto riguarda il 4 ° è necessario creare frammenti per ogni scheda e caricarli quando vengono selezionati per un approccio semplice, oppure è possibile creare un frammento e comunicare con esso per mostrare contenuti specifici quando è selezionata una scheda ..

EDIT non riusciva a trovare un collegamento aggiornato in modo ecco le risposte

1. Usa CoordinaterLay su.
2. Qualsiasi elemento che si desidera comprimere (o nascondere) con la barra degli strumenti passa all'interno di collapseToolBarLayout.
3. Qualsiasi cosa rimanga dopo il toolBar collassato all'interno di AppBarLayout dopo CollapsingToolbarLayout.

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

Per impostazione predefinita potrebbe non esserci una libreria che lo supporta. Ma puoi davvero ottenerlo con un po 'di programmazione. Ascolta gli eventi scrollview tramite ViewTreeObserver e manipola gli altri. Se non sei ancora sicuro, facciamo una libreria per questo. Fai un'app e posta in github, collaborerò per farlo funzionare.

Answer 3

La soluzione più vicina per ottenere quanto sopra è MaterialViewPager. È un buon punto di partenza, puoi cambiarlo e modificarlo secondo le tue preferenze, e puoi personalizzarlo in molti modi.