NestedScrollViewのViewPager


111

折りたたみヘッダー(垂直スクロール)上のViewPager(水平スクロール)の一種であるGoogleニューススタンドのようなインターフェースを作成する必要があります。私の要件の1つは、Google IO 2015で提示された新しいデザインサポートライブラリを使用することです(http://android-developers.blogspot.ca/2015/05/android-design-support-library.html

Chris Banesが作成したサンプル(https://github.com/chrisbanes/cheesesquare)に基づいて、折りたたみ動作を実行できるようになりましたが、基本的なLinearLayout(水平スクロールなし)を使用しました。

LinearLayoutをViewPagerに置き換えようとしたところ、空白の画面が表示されました。私は遊んだ:幅、重さ、あらゆる種類のビューグループ。ただし、まだ空白の画面。ViewPagerとNestedScrollViewはお互いが好きではないようです。

Horizo​​ntalScrollViewを使用して回避策を試しました:機能しますが、PagerTitleStrip機能の利点と1つのパネルへのフォーカスが失われます(2つのパネル間で水平方向に停止できます)。

誰かが私を解決策に導くことができるならば、今私にはこれ以上のアイデアはありません...

ありがとう

これが私の最新のレイアウトファイルです:

<?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:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/header_height"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

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

            <include
                layout="@layout/part_header"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_collapseMode="parallax"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/activity_main_toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

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

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

        <android.support.v4.view.ViewPager
            android:id="@+id/activity_main_viewpager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#FFA0"/>


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

あなたのViewPager内側を包んでみましたLinearLayoutか?それがViewPager適切にレンダリングされるかどうかだけ興味があります。
CzarMatt

はい私は試しましたが、それでも同じ結果です。私は多くのコンポーネントで多くのテストを行いましたが、階層に関係なく、ViewPagerがNestedScrollViewでレンダリングされることはありません
Kyso84

私はちょうどでテストアプリ作成ViewPagerの内部のA NestedScrollViewのみのレイアウトなどを-作業罰金に見えました。私もDrawerLayout無事に立ち寄ることができました。おそらく、必要な機能を妨げるコードの別の側面があるでしょう。あなたの情報源をもっと共有したいですか?
CzarMatt

わあ、左/右と上/下にスワイプできますか?FragmentPagerAdapterを使用して、ページャーにフラグメントを表示します。代わりにサンプルコードを共有できますか?
Kyso84

簡単なレイアウト例をここに貼り付けました:pastebin.com/jXPw6mtf 編集:必要なフラグメントをにロードできますViewPager。ビューを上下にスクロールしたり、ViewPager左右にスクロールしたりできます。
CzarMatt

回答:


128

私はこの問題に遭遇し、私はそれを解決します setFillViewport (true)

<android.support.v4.widget.NestedScrollView
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:id="@+id/nest_scrollview"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="mio.kon.yyb.nestedscrollviewbug.ScrollingActivity"
tools:showIn="@layout/activity_scrolling">


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

活動中

  NestedScrollView scrollView = (NestedScrollView) findViewById (R.id.nest_scrollview);
    scrollView.setFillViewport (true);

ここに画像の説明を入力してください


31
これはXMLでも設定できることに注意してください。オブジェクトに追加android:fillViewport="true"するだけNestedScrollViewです。ドキュメントには、この属性を記述するDefines whether the scrollview should stretch its content to fill the viewport.
Krøllebølle

7
これはプレースホルダーフラグメントのスクロールの問題を解決しません
Atieh

3
ありがとう!私は座っandroid:fillViewport="true"NestedScrollView、中には座っfragmentlistView場所がありandroid:nestedScrollingEnabled="true"ます。スクロールの問題を修正しました
radubogdan

@KrøllebølleNestedScrollViewにはこの属性がないため、プログラムで設定する必要があります。

ええ、これは私にとってはうまくいきます。ビューページャーの高さをNestedScrollView内のmatch_parentに設定すると、ビューが表示されないという問題があります。
Waheed Nazir

71

さて、私は小さなデモをしたViewPagerNestedScrollView。私が直面した問題は、との高さにViewPagerありましたListView。だから私は少し修正しListViewViewPager's高さを測定しました。

誰かがコードを調べたい場合は、ここにリンクがあります:https : //github.com/TheLittleNaruto/SupportDesignExample/

出力:

ここに画像の説明を入力してください


フラグメントがリストビューを持たない場合、機能しません。すべてのフラグメントでアイテムのカウント数が同じ場合、リストビューの機能も含まれます。
Pankaj Arora 2015

3
私はパーティーに少し遅れるかもしれませんが、今日はこれに取り組んでおり、ViewPager の親ビューの両方にapp:layout_behavior = "@ string / appbar_scrolling_view_behavior"を追加することで(主に)それに取り組んでいます各フラグメント。
Graeme

1
これが機能することは間違いありませんが、これは問題を複雑にしすぎていませんか?私はこれを取り除きNestedScrollViewLinearLayout代わりにを使用することでこれを解決しました。全体の目的がViewPager内のコンテンツをスクロールすることでNestedScrollViewあるLinearLayout場合、over aの利点は何ですか?私が間違っていたら訂正してください。:xありがとう
けいれん

1
どうもありがとうございます!髪の毛を抜くところだったので、WrapContentHeightViewPagerは魅力のように動作しました。あなたに貸しがある!
Mavamaarten、2016年

1
完璧なソリューション。ありがとう。それは私のために働いた.. :)
Mrunal

42

に追加 android:fillViewport="true"しますNestedScrollView。限目。


2
それは問題を解決しますが、viewpagerの高さは一致する親になります(ページ全体の高さがかかります)。
Manukumar 2018年

27

NestedScrollView内にViewPagerを配置する代わりに、逆に配置します。

NestedScrollViewを、本質的にはフラグメントのレイアウトであるViewPager内の子ビューに配置します。また、フラグメントのリストレイアウトが非常に単純な場合は、NestedScrollViewを使用する必要さえない可能性が高くなります。

レイアウトの例

アクティビティのレイアウト:

<?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"
    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="@dimen/app_bar_height"
        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|snap">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:minHeight="@dimen/app_bar_height"
                android:scaleType="centerCrop"
                android:src="@drawable/my_bg"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.8"
                app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

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

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

        <android.support.v4.view.ViewPager
            android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1" />
    </LinearLayout>

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

TabLayoutが必要ない場合は、LinearLayoutを破棄してViewPagerをスタンドアロンにすることができます。ただし、必ずapp:layout_behavior="@string/appbar_scrolling_view_behavior"ViewPager属性で使用してください。

単純なフラグメントのレイアウト:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

複雑なフラグメントのレイアウト:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillViewport="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Hello World"/>
    </RelativeLayout>
</android.support.v4.widget.NestedScrollView>

サンプルアプリ:CollapsingToolbarPoc

ここに画像の説明を入力してください


これは私のためにやったものです。ありがとう!
rjr-apps

ちょっとイノ、これは動作しているようですが、TabLayoutの上にもう1つのビューを追加すると、壊れます。何かお手伝いできますか?
hushed_voice

あなたは私の日を救った。:)
androidXP

20

同じ問題があった。

NestedScrollViewをViewPagerの周りに配置すると、機能しません。

DIDが機能するのは、ViewPager 内にロードしているフラグメントのレイアウトにNestedScrollView 配置することです。

<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@id/fragment_detail"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="fill_vertical"
            android:orientation="vertical">
    ...Content...
    </LinearLayout>
</android.support.v4.widget.NestedScrollView>


コンテンツが別のNestedScrollViewを使用したコーディネーターレイアウトである場合は機能しますか?そして、親CoordinatorLayoutはそこでスクロールイベントをリッスンしますか?
Atieh

この仕事は私にとって。NestedScrollViewを、ViewPagerではなく、ViewPagerのすべてのアイテムに追加します。ありがとう。
jerogaren

私のソリューションによると、私はフラグメントでswipefreshlayoutを持っています、私はswipeRefreshLayoutの上のフラグメントにNestedScrollviewを置きました。それからデータがロードされていません。うまくいきませんでした。
Palak Darji 16

16

このように試すことができます。viewpagerは正常に動作しますが、viewpagerの高さは固定されています。

私はまだより良い解決策を探しています...なので、どんな点でもそれをよりよくできることを教えてください、ありがとう

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="800dp"
        android:orientation="vertical">

        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"/>
    </LinearLayout>
</android.support.v4.widget.NestedScrollView>

それを「android.support.design.widget.CoordinatorLayout」と折りたたみツールバーにカプセル化しようとしましたか?
Kyso84

あなたの解決策は、問題が高所にあることを証明しているようです。@Paulでまだ改善点が見つかりましたか?
jasxir 2015年

3
これは私にとってはうまくいきましたが、nestedviewでsetFillViewport(true)を呼び出す必要もありました。
larrytech 2016

12

私は同じ問題を抱えていて、いくつかの変更を加えて修正しました。ViewPager内では機能しませんNestedScrollView。単にViewPagerをの直接の子として置きますCoordinatorLayout。次に、各ViewPagerのフラグメントのコンテンツをで囲む必要がありますNestedScrollViewそれでおしまい。


コンテンツが別のNestedScrollViewを持つコーディネーターレイアウトであったとしても、
Atieh

1
フラグメントリストビューデータがこの方法でロードされていません!
Palak Darji 16

5

視差効果を得るためにNestedScrollViewを使用する必要はありません。次のようなものを試してください:

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:animateLayoutChanges="true">

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

        <android.support.design.widget.TabLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/my_tab_layout"
            android:fillViewport="false"
            app:tabMode="fixed"/>
     </android.support.design.widget.AppBarLayout>

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

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

3
これは、すべてのViewPagerフラグメントがether RecyclerViewまたはである限り機能しますNestedScrollView。そうでない場合(例ListViewlistView.setNestedScrollingEnabled(true)
:)

最後に、追加のスクロールコンテナーを追加せずに機能するものです!ところで、あなたはあまりにもXMLでこのsetNestedScrollingEnabled(true)を設定することができます:アンドロイド:nestedScrollingEnabled = "true"を
Analizer

1
アプリを実行する場合、1つのタブでツールバーを折りたたみ、タブを切り替えてから、ツールバーを下に引くと、空になります。元に戻すには、折りたたまれていない状態でタブを切り替える必要があります。とても近いですが、これまでのところ:(

4

その下にNestedScrollViewが配置されたアプリツールバーのレイアウトがあり、ネストされたツールバーの内部にはLinearLayoutがあり、LinearLayoutの下にはビューページャーがありました。NestedScrollView内のLinearLayoutが修正されました。ビューページャーのビュー間を左右にスライドできましたが、このコンテンツは少なくとも水平方向に移動しませんでした。ネストされたスクロールビューにより、すべてのコンテンツを垂直方向にスクロールできるはずです。それがアイデアでした。ネストされたNestedScrollViewの高さをmatch_parentに設定し、ビューポートを塗りつぶしてから、すべての子のレイアウト/ ViewPagerをwrap_contentに設定しました。

私の頭の中では正しかった。しかし、それは機能しませんでした-ViewPagerは、viewpagerページのコンテンツが現在の画面の下にプッシュされたかどうかに関係なく、左/右に移動できましたが、垂直スクロールはできませんでした。基本的には、ViewPagerがさまざまなページでwrap_contentを尊重していないためです。

ViewPagerをサブクラス化して、現在選択されているアイテムに応じて高さを変更し、layout_height = "wrap_content"のように動作させることで、これを回避しました。

public class ContentWrappingViewPager extends ViewPager {

    public ContentWrappingViewPager(Context context) {
        super(context);
    }

    public ContentWrappingViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

        int height = 0;
        if (getChildCount() > getCurrentItem()) {
            View child = getChildAt(getCurrentItem());
            child.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
            int h = child.getMeasuredHeight();
            if(h > height) height = h;
        }

        heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }
}

ソリューションはこの答えに触発されました。私のために働いた!


しかし、スクロールビューは自動的に上にスクロールしますか?これを修正する方法?
Vivek Kumar

4

この行をNestedScrollViewに入れるだけです

android:fillViewport="true"

たくさんの感謝。CollapsingToolbarLayoutを直接タッチしてスクロールしたい場合はどうすればよいですか?
Pratik Saluja、

3

私は削除NestedScrollViewをメインレイアウトからととして挿入のすべての私の中のフラグメント内の負荷になっていたレイアウトViewPager私のために、この問題を修正しました。


3

以下のカスタマイズされたクラスを使用して、問題を解決してください。pagechangelistenerでonRefresh()メソッドを呼び出すことを忘れないでください。

public class ContentWrappingViewPager extends ViewPager
{
    private int width = 0;
    public ContentWrappingViewPager(Context context) {
        super(context);
    }

    public ContentWrappingViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
    {
        int height = 0;
        width = widthMeasureSpec;
        if (getChildCount() > getCurrentItem()) {
            View child = getChildAt(getCurrentItem());
            child.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
            int h = child.getMeasuredHeight();
            if(h > height) height = h;
        }

        heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    public void onRefresh()
    {
        try {
            int height = 0;
            if (getChildCount() > getCurrentItem()) {
                View child = getChildAt(getCurrentItem());
                child.measure(width, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
                int h = child.getMeasuredHeight();
                if(h > height) height = h;
            }

            int heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);
            ViewGroup.LayoutParams layoutParams = this.getLayoutParams();
            layoutParams.height = heightMeasureSpec;
            this.setLayoutParams(layoutParams);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}

2

私は同様の問題を抱えていました(ただし、なしでCollapsingToolbarLayout、内の単純なToolbar+ のみ)。内でaのコンテンツを下にスクロールすると、ツールバーが見えなくなってスクロールしたかったのです。TabLayoutAppBarLayoutViewPagerNestedScrollView

私のレイアウトは次のようになりました:

<android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:animateLayoutChanges="true">

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

            <android.support.design.widget.TabLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/my_tab_layout"
                android:fillViewport="false"
                app:tabMode="fixed"/>
         </android.support.design.widget.AppBarLayout>

         <android.support.v4.widget.NestedScrollView
                android:id="@+id/container"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fillViewport="true"
                android:layout_gravity="fill_vertical"
                app:layout_behavior="@string/appbar_scrolling_view_behavior">

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

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

このレイアウトは意図したとおりに機能していませんでしたが、私は単にを削除NestedScrollViewしてLinearLayout代わりにを使用することで解決しました。Android Support Library v23.1.0ではすぐに機能しました。レイアウトは次のようになります。

<android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:animateLayoutChanges="true">

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

            <android.support.design.widget.TabLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/my_tab_layout"
                android:fillViewport="false"
                app:tabMode="fixed"/>
         </android.support.design.widget.AppBarLayout>

         <LinearLayout
            android:orientation="vertical"
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginBottom="4dp"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

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

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

PS:これらは実際には私のプロジェクトの2つのレイアウトファイルでした。それらをここにコピーして貼り付け、1つのファイルのように見えるように構造化してみました。コピーと貼り付け中にめちゃくちゃになってしまった場合は申し訳ありませんが、問題がある場合はお知らせください。修正できるようにします。


1

以下は、ビューページャーの適切な高さを確保する必要があります。フラグメントは、ビューページャーによって提供される最初のフラグメントです。

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">

        <android.support.v4.view.ViewPager
            android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

        <fragment
            class="com.mydomain.MyViewPagerFragment"
            android:id="@+id/myFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:visibility="gone"/>

    </LinearLayout>

</android.support.v4.widget.NestedScrollView>

1

私は同じ願いを持ってViewPagerNestedScrollViewます。しかし、それは私にとっても機能しません。私の場合、ViewPagerは内部にあるFragmentので、ドロワーとの相互作用に応じてコンテンツを切り替えることができます。もちろん、AppBar、折りたたみなど、サポートライブラリのすべての新機能が機能する必要があります。

ユーザーがページャーでページを垂直方向にスクロールする場合、他のページも同じようにスクロールして、ページャー自体がスクロールしたという全体的な印象をユーザーに与える必要があります。

私がやったことは機能しますが、ViewPager内部NestedScrollViewにを埋め込むのではなく、含まれているフラグメントのコンテンツをに埋め込みNestedScrollViewます。

次に、1つのフラグメント内のスクロールの場合は、それを格納する新しいスクロール位置をコンテナーに通知します。

最後に、ページャーから検出された左または右のスワイプで(addOnPageChangeListenerドラッグ状態の検索を使用して)、ターゲットの左または右のフラグメントに、それが(フラグメントのコンテナーの知識に基づいて)スクロールする必要がある場所に通知します。


それで本質的にあなたはあなた自身のViewPager実装を書いたのですか?これに関するコードを共有できますか?
ジョセフ2015年

私はこれに似ています(正しく理解している場合)。これは、ネストされたスクロールビューではなく、タブレイアウト(必要な場合)とビューページャーを含むコーディネーターレイアウトで線形レイアウトを行うことです。フラグメント自体は、ルート要素としてネストされたスクロールビューを持ちます。これは私にとっては機能しますが、フラグメントごとに繰り返すのではなく、ネストされたscrollviewを1つだけ持つことをお勧めします。
Chris

0

私は1つの実用的な解決策を知っています:CoordinatorLayoutでActivityを使用し、コンテナーであるFrameLayoutを使用します。その後。フラグメントマネージャーを使用してコンテナーにフラグメントを配置します。たとえば私のコード:

<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:orientation="vertical">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:elevation="0dp">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        app:layout_scrollFlags="scroll|enterAlways"
        android:layout_height="@dimen/toolbar_height"
        android:background="?attr/colorPrimary"
        android:gravity="center">

    </android.support.v7.widget.Toolbar>


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

<FrameLayout
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

</FrameLayout>

そしてフラグメント:

<LinearLayout 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:orientation="vertical"
tools:context="com.improvemdia.inmyroom.MainFragment">

<android.support.v4.view.ViewPager
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

次に、FragmentManagerを使用します

getSupportFragmentManager().beginTransaction()
            .replace(R.id.container, new MainFragment())
            .commit();

LinearLayoutここではFragmentのレイアウト内は不要だと思います。私の答えを見てください、私は私のアクティビティのレイアウトでのLinearLayout代わりにを使用しましたFrameLayout、そして私のフラグメントのルートはViewPager(ラッピングレイアウトなし)です。
けいれん2015年

0

時間を費やして上記の提案をすべて試しましたが、ようやく機能しました。重要なのはNestedScrollView内部PageViewerに置くことであり、両方のビューに設定layout_behavior'@string/appbar_scrolling_view_behavior'れます。最終的なレイアウトは

<CoordinatorLayout>
    <ViewPager app:layout_behavior="@string/appbar_scrolling_view_behavior">
        <NestedScrollView fillViewport="true" app:layout_behavior="@string/appbar_scrolling_view_behavior">
            <Content>...</Content>
        </NestedScrollView>
    </ViewPager>
    <AppBarLayout>...</AppBarLayout>
</CoordinatorLayout>


0

実際、NestedScrollViewは、CoordinatorLayoutのCollapsingToolbarLayoutの直接の兄弟である必要はありません。私は本当に奇妙な何かを達成しました。appbar_scrolling_view_behaviorは2つのネストされたフラグメントで機能します。

私の活動レイアウト:

<android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.AppBarLayout>

            <android.support.design.widget.CollapsingToolbarLayout>

                <include
                    layout="@layout/toolbar"/>

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

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

    <FrameLayout
        android:id="@+id/container"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

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

「コンテナ」frameLayoutで、私はこのフラグメントを膨らませました:

<android.support.constraint.ConstraintLayout>

    ... some content ...

    <android.support.v4.view.ViewPager/>

    ...

</android.support.constraint.ConstraintLayout>

そして、そのViewPager内のフラグメントは次のようになります。

<RelativeLayout>

    <android.support.v7.widget.RecyclerView/>

    ....

</RelativeLayout>

NestedScrollViewがCoordinatorLayoutの子階層の奥深くにある可能性がある事実と、作品のスクロール動作が驚いた。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.