2015-10-08 15 views
14

私のコンテンツをスクロールするときにTabLayoutを非表示にしたいと思います。現在、ネットを検索しましたが、ツールバーを隠すサンプルが見つかりましたが、TabLayoutを非表示にしたいと思います。だから私を助けてください。私は以下のコードを試しました。ここでToolBarの代わりにコンテンツのスクロールでTabLayoutを非表示にする

<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/id_appbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:fitsSystemWindows="true"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/id_toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      app:layout_scrollFlags="scroll|enterAlways"/> 

     <android.support.design.widget.TabLayout 
      android:id="@+id/id_tabs" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      style="@style/MyCustomTabLayout"/> 

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

    <android.support.v4.view.ViewPager 
     android:id="@+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.CoordinatorLayout> 

は、サンプルアプリケーションである: 前のToolbarスペースをplaceholdうとTabLayoutがするようにスクロールしますあなたは、レイアウトに上面図としてToolbarを移動し、Viewとそれを交換する必要がありhttps://play.google.com/store/apps/details?id=com.contextlogic.wish https://play.google.com/store/apps/details?id=co.vine.android

+0

ターゲットを明確にすることができますか?ツールバーとTabLayoutの両方を非表示にするか、TabLayoutだけを非表示にしてツールバーを表示したままにしますか? – DmitryArc

+0

はい正確です。 Tabを非表示にしてツールバーを表示可能にしたい –

答えて

26

です。主なアイデアは、ツールバーをCoordinatorLayoutの外側に移動し、このビュー構造を他のコンテナレイアウトでラップすることです。

<RelativeLayout 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.support.design.widget.AppBarLayout 
     android:id="@+id/id_toolbar_container" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:fitsSystemWindows="true"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/id_toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      app:layout_collapseMode="pin" 
      app:layout_scrollFlags="scroll|exitUntilCollapsed" /> 
    </android.support.design.widget.AppBarLayout> 

    <android.support.design.widget.CoordinatorLayout 
     android:id="@+id/main_content" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_below="@id/id_toolbar_container"> 

     <android.support.design.widget.AppBarLayout 
      android:id="@+id/id_appbar" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content"> 

      <android.support.design.widget.CollapsingToolbarLayout 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       app:layout_scrollFlags="scroll|enterAlways"> 

       <android.support.design.widget.TabLayout 
        android:id="@+id/id_tabs" 
        android:layout_width="match_parent" 
        android:layout_height="?attr/actionBarSize" /> 
      </android.support.design.widget.CollapsingToolbarLayout> 

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

     <android.support.v4.view.ViewPager 
      android:id="@+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.CoordinatorLayout> 
</RelativeLayout> 
+0

いいですね。タイトルは表示されません。 –

+0

タイトルが最初のバージョンであったかどうかつまり、これらの変更後に消滅しましたか? – DmitryArc

+0

こんにちは、申し訳ありませんが、これは正常に動作します。私は行のコメントを外す必要があります supportActionBar.SetDisplayShowTitleEnabled(false); –

0

あなたのAppBarLayoutの中にあります。ここで

はあなたのレイアウトを設定する必要がある方法です。ここで

<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/preview_top_parent" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:fitsSystemWindows="true"> 
<android.support.design.widget.AppBarLayout...> 
<android.support.v4.view.ViewPager...>  
<android.support.v7.widget.Toolbar/> <-!--- Toolbar is direct child of CooridnatorLayout and z-order above all views --!-> 
</android.support.design.widget.CoordinatorLayout> 

は、このアプローチを試してみてくださいvideo

+0

適切なデモを提供してください。AppBarLayoutに含まれるべきものを教えてください。 –

+0

コピー&ペーストのソリューションを探してはいけません。私は本文でそれを説明しました。 –

1

こんにちはあなたは、ツールバーを消えるしたいですし、タブはまだあなたが次のコードを記述する必要があり、表示:

<android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:layout_scrollFlags="scroll|enterAlways" 
     ></android.support.v7.widget.Toolbar> 

そして、あなたはTabLayout

のブロックでTabLayout使用scrollFlagsを隠したい場合に
app:layout_scrollFlags="scroll|enterAlways" 
+0

トニー、OPはあなたが提供したものとは反対のものを望んでいます。 – Soumya

+0

昨日だけ私の最後のコメントを考慮する –

関連する問題