ViewPager em um NestedScrollView


111

Eu preciso criar uma interface como o Google Newsstand, que é uma espécie de ViewPager (rolagem horizontal) sobre um cabeçalho recolhível (rolagem vertical). Um dos meus requisitos é usar a nova Biblioteca de Suporte a Design apresentada no Google IO 2015. ( http://android-developers.blogspot.ca/2015/05/android-design-support-library.html )

Com base no exemplo criado por Chris Banes ( https://github.com/chrisbanes/cheesesquare ), cheguei ao ponto em que sou capaz de fazer o comportamento de recolhimento, mas com um LinearLayout básico (sem rolagem horizontal).

Tentei substituir o LinearLayout por um ViewPager e obtive uma tela em branco. Joguei com: largura, peso e todos os tipos de grupos de visão, mas .... ainda uma tela em branco. Parece que ViewPager e NestedScrollView não gostam um do outro.

Tentei uma solução alternativa usando um HorizontalScrollView: funciona, mas perco o benefício do recurso PagerTitleStrip e o foco em um único painel (posso interromper horizontalmente entre 2 painéis).

Agora não tenho mais ideias, se alguém pode me levar a uma solução ...

obrigado

Aqui está meu arquivo de layout mais recente:

<?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>

Você já tentou embrulhar ViewPagerdentro de um LinearLayout? Apenas curioso se isso renderizaria ViewPagercorretamente.
CzarMatt 01 de

Sim, eu tentei, mas ainda assim o mesmo resultado. Fiz muitos testes com muitos componentes, mas o ViewPager nunca é renderizado em um NestedScrollView, não importa a hierarquia
Kyso84 01 de

Acabei de criar um aplicativo de teste com um ViewPagerdentro de um NestedScrollViewcomo os únicos layouts - parecia funcionar bem. Eu também fui capaz de entrar em um com DrawerLayoutsucesso. Talvez haja outro aspecto do seu código impedindo a funcionalidade desejada. Quer compartilhar mais de sua fonte?
CzarMatt 01 de

Uau, você consegue deslizar para a esquerda / direita e para cima / baixo? Eu simplesmente uso um FragmentPagerAdapter para exibir fragmentos em meu pager. Você pode compartilhar seu código de amostra em vez disso?
Kyso84 01 de

Colei um layout de exemplo simples aqui: pastebin.com/jXPw6mtf Editar: Você pode carregar qualquer fragmento que quiser no ViewPager. Consigo rolar as visualizações para cima e para baixo, bem como rolar para a ViewPageresquerda / direita.
CzarMatt 01 de

Respostas:


128

Eu encontro este problema, eu resolvo por 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"/>

em atividade

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

insira a descrição da imagem aqui


31
Observe que isso também pode ser definido em XML, basta adicionar android:fillViewport="true"ao NestedScrollViewobjeto. A documentação descreve esse atributo como Defines whether the scrollview should stretch its content to fill the viewport..
Krøllebølle

7
Isso não resolve o problema de rolagem nos fragmentos de espaço reservado
Atieh

3
Obrigado! Sentei-me android:fillViewport="true"em NestedScrollViewe dentro do fragmentTenho um lugar listViewonde me sentei android:nestedScrollingEnabled="true".. Corrigido o problema de rolagem
radubogdan

@ Krøllebølle NestedScrollView não tem este atributo, você deve configurá-lo programaticamente.

Sim, isso funciona para mim. Tive um problema ao definir a altura do viewpager para match_parent dentro de NestedScrollView, ele não estava mostrando as visualizações.
Waheed Nazir

71

Ok, fiz uma pequena demonstração com o ViewPagere NestedScrollView. O problema que enfrentei foi com a altura ViewPagere o ListView. Então eu fiz uma pequena modificação no ListViewe ViewPager'smedição de altura.

Se alguém quiser examinar o código, aqui está o link: https://github.com/TheLittleNaruto/SupportDesignExample/

Resultado:

insira a descrição da imagem aqui


não funciona, se o fragmento não tiver listview, mesmo forlistview funcionará se o número de contagem de itens for o mesmo para todos os fragmentos.
Pankaj Arora

3
Posso estar um pouco atrasado para a festa, mas estava trabalhando nisso hoje, e tenho (principalmente) trabalhando com a adição de app: layout_behavior = "@ string / appbar_scrolling_view_behavior" no ViewPager e na visualização pai de cada fragmento.
Graeme de

1
Sem dúvida, isso funciona, mas isso não complica demais o problema? Resolvi isso livrando-me do NestedScrollViewe usando um LinearLayout. Quais seriam os benefícios de ter um NestedScrollViewover a LinearLayoutse todo o propósito fosse rolar o conteúdo dentro do ViewPager? Por favor me corrija se eu estiver errado. : x Obrigado
Cramps

1
Muito obrigado! Eu estava quase arrancando meus cabelos, e seu WrapContentHeightViewPager funciona perfeitamente. Eu devo-te uma!
Mavamaarten

1
Solução perfeita. Obrigado. Funcionou para mim .. :)
Mrunal

42

Adicione o android:fillViewport="true"seu NestedScrollView. período.


2
ele resolve o problema, mas a altura do viewpager será o pai correspondente (leva a altura da página inteira).
Manukumar

27

Em vez de colocar ViewPager dentro de NestedScrollView, faça o contrário.

Coloque o NestedScrollView nas visualizações filho dentro do ViewPager que, em essência, é o layout do Fragment. Também é muito provável que você nem precise usar NestedScrollView se o layout de lista do seu Fragment for muito simples.

Layouts de exemplo

Layout da atividade:

<?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>

Se você não precisa do TabLayout, pode abandonar o LinearLayout e tornar o ViewPager autônomo. Mas certifique-se de usar os app:layout_behavior="@string/appbar_scrolling_view_behavior"atributos do ViewPager.

Layout do fragmento simples:

<?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" />

Layout do fragmento complexo:

<?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>

Exemplo de aplicativo: CollapsingToolbarPoc

insira a descrição da imagem aqui


Este é o único que fez isso por mim. Obrigado!
rjr-apps de

Ei Ino, isso parece estar funcionando, mas quando adiciono mais uma visualização no topo do TabLayout, está quebrando. Você poderia dar alguma ajuda?
hushed_voice

Você salvou meus dias. :)
androidXP

20

Teve os mesmos problemas.

Ao colocar NestedScrollView em torno do ViewPager, isso não funcionaria.

O que DID funcionou, entretanto, é colocar o NestedScrollView dentro do layout do fragmento que estou carregando dentro do ViewPager.

<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>


Funciona se o conteúdo for um layout de coordenador com outro NestedScrollView? E o CoordinatorLayout pai escuta os eventos de rolagem lá?
Atieh de

Este trabalho para mim. Eu adiciono o NestedScrollView a cada item do meu ViewPager em vez do ViewPager. Obrigado.
jerogaren,

Eu tenho swipefreshlayout no fragmento, de acordo com sua solução, coloquei NestedScrollview no fragmento, acima de swipeRefreshLayout .. então os dados não estão sendo carregados. Não funcionou.
Palak Darji de

16

você pode tentar assim, o viewpager funciona bem, mas a altura do viewpager é fixa.

Ainda estou encontrando a melhor solução ... então, por favor, deixe-me saber se qualquer ponto pode fazer melhor, obrigado

<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>

Você tentou encapsulá-lo em um "android.support.design.widget.CoordinatorLayout" e uma barra de ferramentas em colapso?
Kyso84

Suas soluções parecem provar que o problema está na altura. Já encontrou alguma melhoria @Paul?
jasxir

3
Este funcionou para mim, mas eu também tive que chamar setFillViewport (true) no nestedview.
Larrytech

12

Eu tive o mesmo problema e resolvi com algumas alterações. ViewPagernão funciona dentro do NestedScrollView. Basta colocar o seu ViewPagercomo um filho direto seu CoordinatorLayout. Em seguida, o conteúdo de cada fragmento do ViewPager deve ser incluído em NestedScrollView. É isso aí.


mesmo se o conteúdo fosse um layout de coordenador com outro NestedScrollView?
Atieh de

1
Os dados do listview de fragmentos não estão sendo carregados dessa maneira!
Palak Darji de

5

Você não precisa usar o NestedScrollView para ter os efeitos de paralaxe. tente algo assim:

<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
Isso funcionará, contanto que todos os seus ViewPagerfragmentos sejam éter RecyclerViewou NestedScrollView. Se eles não são (por exemplo ListView), em seguida, uma solução alternativa para Lollipop e acima é chamarlistView.setNestedScrollingEnabled(true)
AndyDeveloper

finalmente algo que funciona sem adicionar um contêiner de rolagem extra! A propósito, você também pode definir este setNestedScrollingEnabled (true) em xml: android: nestedScrollingEnabled = "true"
Analizer

1
Se eu executar meu aplicativo, recolho a barra de ferramentas enquanto está em uma guia, alterne a guia e puxe a barra de ferramentas de volta para baixo, ela está vazia. É necessário alternar as guias enquanto ele não está recolhido para recuperá-lo. Tão perto, mas tão longe :(
eu--

4

Eu tinha um layout com uma barra de ferramentas de aplicativo com NestedScrollView abaixo dela, então dentro da barra de ferramentas aninhada estava um LinearLayout, abaixo do LinearLayout estava um pager de visualização. A ideia era que o LinearLayout dentro do NestedScrollView foi corrigido - você poderia deslizar para a esquerda / direita entre as visualizações do pager de visualização, mas este conteúdo não se moveria, pelo menos horizontalmente . Você ainda deve conseguir rolar todo o conteúdo verticalmente por causa da exibição de rolagem aninhada. Essa foi a ideia. Portanto, defino a altura de NestedScrollView aninhada como match_parent, preenche a janela de visualização e, a seguir, todos os layouts filhos / ViewPager como wrap_content.

Na minha cabeça isso estava certo. Mas não funcionou - o ViewPager me permitiu ir para a esquerda / direita, mas sem rolagem vertical, quer o conteúdo da página do viewpager fosse empurrado para baixo da tela atual ou não. Acontece que era basicamente porque o ViewPager não respeita wrap_content em suas várias páginas.

Resolvi isso criando uma subclasse do ViewPager para fazê-lo mudar de altura dependendo do item selecionado atualmente, forçando-o a se comportar como 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);
    }
}

A solução foi inspirada em esta resposta . Funcionou para mim!


mas a visualização de rolagem rola automaticamente para o topo? Como consertar isto ?
Vivek Kumar de

4

basta colocar esta linha em NestedScrollView

android:fillViewport="true"

Muito obrigado. O que fazer se eu quiser rolar tocando diretamente em CollapsingToolbarLayout?
Pratik Saluja

3

Eu removi NestedScrollView do layout principal e inseri como Pai em todos os meus Fragmentos layouts de que deveriam carregar no ViewPager. Corrigi esse problema para mim.


3

Use a classe personalizada abaixo para resolver seu problema. Não se esqueça de chamar o método onRefresh () em pagechangelistener.

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

Eu estava tendo um problema semelhante (mas sem CollapsingToolbarLayout, apenas um Toolbar+ simples TabLayoutdentro do AppBarLayout). Eu queria que a barra de ferramentas desaparecesse de vista ao rolar para baixo o conteúdo de um ViewPagerdentro doNestedScrollView .

Meu layout era mais ou menos assim:

<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>

Este layout não estava funcionando como planejado, mas resolvi simplesmente me livrando do NestedScrollViewe usando um LinearLayout. Funcionou para mim imediatamente na Android Support Library v23.1.0. Veja como o layout acabou:

<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: Na verdade, foram dois arquivos de layout no meu projeto. Eu os copiei e colei aqui e tentei estruturá-los como se pareceriam em um único arquivo. Lamento se errei enquanto copiava e colava, mas me diga se foi esse o caso para que o possa corrigir.


1

O seguinte deve garantir a altura adequada do pager de visualização. O fragmento é o primeiro fragmento fornecido pelo pager de visualização.

<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

Eu tenho o mesmo desejo, aninhe um ViewPagerdentro de um NestedScrollView. Mas também não funciona para mim. No meu caso, o ViewPagerestá dentro de umFragment para que eu possa alternar o conteúdo dependendo das interações com a gaveta. Claro, AppBar, colapso, etc e todos os novos recursos da biblioteca de suporte devem funcionar.

Se um usuário rolar verticalmente uma página no pager, quero que outras páginas sejam roladas da mesma forma, para dar ao usuário a impressão geral de que o próprio pager rolou.

O que eu fiz, o que funciona, é que eu não embuti mais o ViewPagerinterior de a NestedScrollView, em vez disso, embuti o conteúdo dos fragmentos contidos dentro de a NestedScrollView.

Então, no caso de um pergaminho em um fragmento, informo o container da nova posição de rolagem, que o armazena.

Finalmente, ao deslizar para a esquerda ou direita detectado no pager (usando a addOnPageChangeListenerprocura de estados de arrasto), informo o fragmento esquerdo ou direito de destino onde ele deve rolar (com base no conhecimento do contêiner) para ser alinhado com o fragmento de onde venho.


Então, essencialmente, você escreveu sua própria implementação do ViewPager? Você seria capaz de compartilhar código nisso?
Joseph

Eu fiz algo semelhante a isso (se bem entendi), que é fazer um layout linear no layout do seu coordenador, que contém o tablayout (se necessário) e o viewpager, em vez de um scrollview aninhado. Os próprios fragmentos têm então o scrollview aninhado como seu elemento raiz. Isso funciona para mim, mas eu preferiria ter apenas um nestedscrollview em vez de repeti-lo em cada fragmento.
Chris

0

Eu conheço uma solução de trabalho: você usa Activity, com CoordinatorLayout e usa FrameLayout, container. Então. use o gerenciador de fragmentos para colocar o fragmento no contêiner. Por exemplo, meu código:

<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>

E Fragmento:

<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" />

Em seguida, use FragmentManager

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

Acho que LinearLayoutdentro do layout do Fragment é desnecessário aqui. Veja minha resposta, usei a em LinearLayoutvez de FrameLayoutno layout da minha Activity e a raiz do meu fragmento é um ViewPager (sem layout de quebra automática).
Cãibras,

0

Depois de passar horas tentando todas as sugestões acima, finalmente consegui fazer funcionar. A chave é colocar NestedScrollViewdentro PageViewer, e definir layout_behaviorpara '@string/appbar_scrolling_view_behavior'para ambos os pontos de vista. O layout final é como

<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

você acabou de remover o NestedScrollView do seu xml e adicionar este código à sua classe

yourGridView.setNestedScrollingEnabled(true);


0

Na verdade, o NestedScrollView não precisa ser irmão direto de CollapsingToolbarLayout no CoordinatorLayout. Eu consegui algo realmente bizarro. O appbar_scrolling_view_behavior funciona em 2 fragmentos aninhados.

Layout de minha atividade:

<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>

No frameLayout "container", aumentei este fragmento:

<android.support.constraint.ConstraintLayout>

    ... some content ...

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

    ...

</android.support.constraint.ConstraintLayout>

E os fragmentos dentro desse ViewPager têm a seguinte aparência:

<RelativeLayout>

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

    ....

</RelativeLayout>

O fato de NestedScrollView poder estar tão profundo na hierarquia dos filhos do CoordinatorLayout e nos comportamentos de rolagem ainda me surpreendeu.

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.