Join FlipAndroid.COM Telegram Group: https://t.me/joinchat/F_aqThGkhwcLzmI49vKAiw


El desplazamiento no funciona con CoordinatorLayout + imagen de paralaje + BottomSheetLayout

Introducción

Tengo una actividad, que implementa un patrón común con la imagen de cabecera de paralaje y el contenido de desplazamiento utilizando CoordinatorLayout , AppBarLayout y CollapsingToolbarLayout . Mi diseño de xml se ve así:

 <android.support.design.widget.CoordinatorLayout android:fitsSystemWindows="true" android:layout_height="match_parent" android:layout_width="match_parent"> <android.support.design.widget.AppBarLayout android:fitsSystemWindows="true" android:id="@+id/appbar" android:layout_height="wrap_content" android:layout_width="match_parent" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.design.widget.CollapsingToolbarLayout android:fitsSystemWindows="true" android:layout_height="wrap_content" android:layout_width="match_parent" app:contentScrim="?attr/colorPrimary" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <TextView android:background="@color/colorAccent" android:gravity="center" android:layout_height="250dp" android:layout_width="match_parent" android:text="ParallaxImage" app:layout_collapseMode="parallax"/> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_height="?attr/actionBarSize" android:layout_width="match_parent" app:layout_collapseMode="pin" app:popupTheme="@style/AppTheme.PopupOverlay"/> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v4.widget.NestedScrollView android:id="@+id/content" android:layout_height="match_parent" android:layout_width="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <TextView android:layout_height="wrap_content" android:layout_margin="@dimen/text_margin" android:layout_width="wrap_content" android:text="@string/large_text"/> </android.support.v4.widget.NestedScrollView> </android.support.design.widget.CoordinatorLayout> 

Como se puede ver en la animación gif a continuación, todo funciona correctamente. Puede desplazar toda la pantalla desde el contenido NestedScrollView , así como desde la Toolbar o la View paralaje.

  • ¿Es este CursorAdapter personalizado para un ListView correctamente codificado para Android?
  • Ibeacón de Córdoba; Enviar notificación local después de que la aplicación se haya matado, pero no funciona en android
  • Diferentes tipos de letra para Algunas actividades utilizando la Biblioteca de Caligrafía
  • Trabajar con Enums en android
  • Android: maneja "Enter" en un EditText
  • ¿Alarm Manager persiste incluso después del reinicio?
  • AppBarLayout + NestedScrollView

    Problema

    Google introdujo una clase BottomSheetBehavior (biblioteca de soporte de diseño Android 23.2 ) para ayudar a los desarrolladores a implementar las hojas inferiores . Mi diseño de xml con la hoja inferior se parece a esto:

     <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:fitsSystemWindows="true"> <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/AppTheme.AppBarOverlay"> <!-- ommited --> </android.support.design.widget.AppBarLayout> <android.support.v4.widget.NestedScrollView android:id="@+id/content" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <!-- ommited --> </android.support.v4.widget.NestedScrollView> <LinearLayout android:id="@+id/bottomSheet" android:layout_width="match_parent" android:layout_height="400dp" android:background="@android:color/holo_blue_bright" android:orientation="vertical" app:behavior_peekHeight="?attr/actionBarSize" app:layout_behavior="android.support.design.widget.BottomSheetBehavior"> <TextView android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:gravity="center_vertical" android:paddingLeft="16dp" android:paddingRight="16dp" android:text="BottomSheetLayout" android:textColor="@android:color/white"/> <android.support.v4.widget.NestedScrollView android:id="@+id/bottomSheetContent" android:layout_width="match_parent" android:layout_height="wrap_content" android:scrollbars="vertical"> <TextView android:layout_width="match_parent" android:layout_height="400dp" android:background="@android:color/holo_green_dark" android:padding="16dp" android:text="@string/large_text" android:textColor="@android:color/white"/> </android.support.v4.widget.NestedScrollView> </LinearLayout> </android.support.design.widget.CoordinatorLayout> 

    Y el resultado se ve así:

    Introduzca aquí la descripción de la imagen

    Como puedes ver, ahora no puedo desplazarme, si empiezo a desplazarme desde la View paralaje. Desplazarse desde el contenido NestedScrollView y desde la Toolbar funciona como se esperaba.

    Pregunta

    ¿Cómo puedo manejar el desplazamiento para trabajar desde la View paralaje también (de la misma manera que en la primera animación gif)? Parece que el BottomSheetBehavior intercepta eventos táctiles y evita que AppBarLayout ( AppBarLayoutBehavior ) maneje el desplazamiento. Pero lo extraño es que el desplazamiento de la Toolbar de Toolbar funciona y tanto la View paralaje como la Toolbar son hijos de AppBarLayout .

  • Cómo eliminar subrayado blanco en un widget de SearchView en la barra de herramientas Android
  • ¿Android consigue el timestamp actual?
  • Clear Disk / SD Card Cache de la Biblioteca de imágenes de Picasso de Android
  • Cómo utilizar Fragmentos en Android
  • Hacer que la aplicación de Android no esté disponible para tablets
  • ¿Puedo reutilizar LayoutPrams con ViewGroup.addView?
  • 6 Solutions collect form web for “El desplazamiento no funciona con CoordinatorLayout + imagen de paralaje + BottomSheetLayout”

    Creo que deberías usar NestedScrollView con BottomSheetBehavior , reemplazar blow como bootemSheet!

     <android.support.v4.widget.NestedScrollView android:id="@+id/bottomSheet" android:layout_width="match_parent" android:layout_height="400dp" android:background="@android:color/holo_blue_bright" android:orientation="vertical" app:behavior_peekHeight="?attr/actionBarSize" app:layout_behavior="android.support.design.widget.BottomSheetBehavior"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TextView android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:gravity="center_vertical" android:paddingLeft="16dp" android:paddingRight="16dp" android:text="BottomSheetLayout" android:textColor="@android:color/white"/> <ScrollView android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="match_parent" android:layout_height="400dp" android:background="@android:color/holo_green_dark" android:padding="16dp" android:text="@string/large_text" android:textColor="@android:color/white"/> </ScrollView> </LinearLayout> </android.support.v4.widget.NestedScrollView> 

    NestedScrollView puede saber anidar con la barra de herramientas, no el LinearLayout !

    Deseo ayudar !!

    Parece como un error en el código BottomSheetBehavior probablemente, porque si intentas depurar el código de CoordinatorLayout verás que cuando tocas tu paralaje View será determinado como un layout con BottomSheetBehavior vez de HeaderBehavior .

    Así que la solución rápida que he encontrado es para establecer OnTouchListener que siempre vuelve a la verdad a su vista de paralaje:

     View parallaxView = findViewById(R.id.parallax_view); parallaxView.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { return true; } }); 

    Por supuesto, no te olvides de establecer android:id="@+id/parallax_view" a tu vista con el modo de colapso de paralaje.

    ¡Espero eso ayude!

    prueba esto

      <LinearLayout android:id="@+id/bottomSheet" android:layout_width="match_parent" android:layout_height="400dp"> 

    Cambiar la altura de 400dp a wrap_content

    La esperanza trabaja para usted

    Estoy copiando pegar el XML que estoy usando. Está trabajando en Samsung Galaxy S3, Huawei Mate 8 y Moto por el camino y no he probado en el emulador (he eliminado todas las cosas de negocios y acaba de poner widgets ficticio).

     <?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/coordinatorlayout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true"> <android.support.design.widget.AppBarLayout android:id="@+id/appbarlayout" android:layout_width="match_parent" android:layout_height="256dp" android:theme="@style/AppTheme.AppBarOverlay" android:fitsSystemWindows="true"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" 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/backdrop" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="centerCrop" android:fitsSystemWindows="true" app:layout_collapseMode="parallax"/> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:popupTheme="@style/AppTheme.PopupOverlay" app:layout_collapseMode="pin"/> </android.support.design.widget.CollapsingToolbarLayout> </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"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingBottom="16dp"> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="16dp"> <LinearLayout style="@style/Widget.CardContent" android:layout_width="match_parent" android:layout_height="wrap_content"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo." /> </LinearLayout> </android.support.v7.widget.CardView> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginBottom="16dp" android:layout_marginLeft="16dp" android:layout_marginRight="16dp"> <LinearLayout style="@style/Widget.CardContent" android:layout_width="match_parent" android:layout_height="wrap_content"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="TITLE" android:textAppearance="@style/TextAppearance.AppCompat.Title" /> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 1" /> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 2" /> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 3" /> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 4" /> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 5" /> </LinearLayout> </android.support.v7.widget.CardView> </LinearLayout> </android.support.v4.widget.NestedScrollView> <android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" app:behavior_peekHeight="100dp" android:fitsSystemWindows="true" app:layout_behavior="android.support.design.widget.BottomSheetBehavior"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingBottom="16dp" android:background="@android:color/white" android:padding="15dp"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="BOOTOMSHEET TITLE" android:textAppearance="@style/TextAppearance.AppCompat.Title" /> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button1"/> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 2" android:layout_margin="10dp"/> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 3" android:layout_margin="10dp"/> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="text 4" android:layout_margin="10dp"/> <FrameLayout android:layout_width="match_parent" android:layout_height="320dp" android:background="@color/colorAccent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="Your remaining content here" android:textColor="@android:color/white" /> </FrameLayout> </LinearLayout> </android.support.v4.widget.NestedScrollView> 

    El problema se puede solucionar moviendo el NestedScrollView (o fragmento que contiene un NestedScrollView en mi caso) fuera del CoordinatorLayout en FrameLayout y colocando una vista ficticia donde estaba el NestedScrollView, así:

     <FrameLayout> <CoordinatorLayout> <AppBarLayout> ... </AppBarLayout> <View android:id="@+id/bottomSheet" app:layout_behavior="android.support.design.widget.BottomSheetBehavior" /> </CoordinatorLayout> <NestedScrollView android:id="@+id/bottomSheetContent"> ... </NestedScrollView> </FrameLayout> 

    Por último, agregue BottomSheetCallback a la vista ficticia que traduce la vista de contenido real mientras se desliza:

     @Override public void onSlide(@NonNull View bottomSheet, float slideOffset) { bottomSheetContent.setTranslationY((1f - slideOffset) * bottomSheetContent.getHeight()); } 

    Aparentemente, esta es la única manera de evitar que un CoordinatorLayout reaccione (e intercepte) cualquier evento táctil. #JustGoogleThings

    Yo vine con mi propia respuesta:

    • Agregue la app:layout_behavior="...AppBarLayoutCustomBehavior" a su appBarLayout .

    • Crear esa clase y extender desde AppBarLayout.Behavior

    • onStartNestedScroll y onNestedFling

    • Crear una bandera como scrollDenial , y agregarlo a los dos métodos a continuación, a continuación, llamar a super (scrollDenial && super.onStartNestedScroll …)

    • Ahora, debe actualizar su condición de denegación en cada onStartNestedScroll. Hice algo como esto:

      https://gist.github.com/recoverrelax/8dd37b54910d70b5cd6a130a070c51e9

    PD. Lo siento, pero este es Kotlin: p No debe ser difícil de entender tho. Resolvió el problema bottomSheet.

    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.