Wie benutze ich viewpager in der zusammenklappbaren Symbolleiste?

Question

Ich verwende Viewpager oben in meinem Layout und darunter ein Rahmenlayout, das eine Recycler-Ansicht enthält. Ich möchte den Viewpager reduzieren, wenn ich in meiner Recycler-Ansicht blättere, sodass er im Vollbildmodus angezeigt werden kann. Diese

ist, wie mein Layout-Datei wie folgt aussieht:

<RelativeLayout 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:id="@+id/main_container" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:background="@android:color/white" 
android:orientation="vertical" 
tools:context=".MainActivity"> 


<android.support.v7.widget.Toolbar 
    android:id="@+id/toolbar" 
    android:layout_width="match_parent" 
    android:layout_height="?attr/actionBarSize" 
    android:background="?attr/colorPrimary" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 

<android.support.v4.view.ViewPager 
    android:id="@+id/pager_container" 
    android:layout_width="match_parent" 
    android:layout_height="180dp" 
    android:layout_gravity="center_horizontal" 
    android:layout_marginTop="?attr/actionBarSize" /> 

<FrameLayout 
    android:id="@+id/content" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:layout_below="@id/seperator" 
    android:layout_marginTop="20dp" /> 
    </RelativeLayout> 

ich die screenshort auch für denselben angeschlossen haben.

Answer 1

Setzen Sie Ihre Ansicht Pager innerhalb eines Einstürzen Toolbar Layout und die Verwendung Koordinator Layout.

Schauen Sie sich den folgenden Link an. Verstehe es und fange an zu implementieren. Jeder Zweifel ist frei, mich hier zu fragen.

http://antonioleiva.com/collapsing-toolbar-layout/

Sobald Sie damit fertig sind, haben auch einen Blick auf untenstehenden Link.

Collapsing Toolbar and Fragment

Answer 2

Verwenden Sie den folgenden Link können Sie feststellen, wie in diesem Link CoordinatorLayout und CollapsingToolbarLayout auch verwenden sie TabLayout und ViewPager

https://gist.github.com/iPaulPro/1468510f046cb10c51ea

Answer 3

EDITED verwendet haben:

Erste Sie müssen

kompilieren

compile 'com.android.support:design:23.3.0' 

und dann ist hier die Probe

<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:id="@+id/app_bar" 
     android:layout_width="match_parent" 
     android:layout_height="180dp" 
     android:fitsSystemWindows="true" 
     android:theme="@style/AppTheme.AppBarOverlay"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:id="@+id/toolbar_layout" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:fitsSystemWindows="true" 
      app:contentScrim="?attr/colorPrimary" 
      app:layout_scrollFlags="scroll|exitUntilCollapsed"> 

      <android.support.v7.widget.Toolbar 
       android:id="@+id/toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="?attr/actionBarSize" 
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
       app:layout_collapseMode="pin" /> 
      <android.support.v4.view.ViewPager 
      android:id="@+id/pager_container" 
      android:layout_width="match_parent" 
      android:layout_height="180dp" 
      android:layout_gravity="center_horizontal" 
      android:layout_marginTop="?attr/actionBarSize" /> 

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

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

ich es bearbeitet haben so einfach für Sie zu machen, wie ich konnte, hoffen, dass es

hilft

Answer 4

Mit CoordinatorLayout Sie können dies tun. Geben Sie Layout ein.

<?xml version="1.0" encoding="utf-8"?> 

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/main_content" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

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

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
      app:layout_scrollFlags="scroll|enterAlways|snap" /> 

     <android.support.design.widget.TabLayout 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:fillViewport="false" /> 

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

    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

    <android.support.design.widget.FloatingActionButton 
     android:id="@+id/fab" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="end|bottom" 
     android:layout_margin="@dimen/fab_margin" 
     android:src="@drawable/ic_done" /> 

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

EDIT 1:

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/main_content" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

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

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      android:fitsSystemWindows="true" 
      app:layout_collapseMode="pin" 
      app:layout_scrollFlags="scroll|enterAlways|snap" 
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 


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

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"> 


     <android.support.design.widget.TabLayout 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/toolbar" 
      android:background="?attr/colorPrimary" 
      android:elevation="6dp" 
      android:fillViewport="false" 
      android:minHeight="?attr/actionBarSize" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
      app:layout_scrollFlags="enterAlways" /> 

     <android.support.v4.view.ViewPager 
      android:id="@+id/viewpager" 
      android:layout_width="match_parent" 
      android:layout_height="fill_parent" 
      android:layout_below="@+id/tabs" 
      app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 


    </LinearLayout> 

    <android.support.design.widget.FloatingActionButton 
     android:id="@+id/fab" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="end|bottom" 
     android:layout_margin="@dimen/fab_margin" 
     android:src="@drawable/ic_done" /> 

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