videos poner para online filtros efectos app android android-layout android-animation material-design android-scroll

android - para - poner efectos a videos online



Cómo hacer el nuevo efecto de paralaje PlayStore (6)

¿Alguien sabe cómo puedo lograr el nuevo efecto de desplazamiento de paralaje? Puede ver el efecto cuando abre una aplicación en PlayStore y trata de desplazarse hacia abajo, el contenido pasa por encima de la imagen superior. ¿Cómo puedo lograr eso?

En realidad, pocos minutos después de publicar esta pregunta, me topé con dos de las bibliotecas que hacen el efecto que estoy buscando y aún más.

Aquí hay enlaces a ellos:

Google anunció recientemente la biblioteca de soporte de diseño y con esto tiene soporte para implementar la barra de herramientas Colapsar .

Además de fijar una vista, puede usar la app:layout_collapseMode="parallax" (y opcionalmente app:layout_collapseParallaxMultiplier="0.7" para establecer el multiplicador de paralaje) para implementar el desplazamiento de paralaje (por ejemplo, de un hermano ImageView dentro de CollapsingToolbarLayout )

Ejemplo:

<android.support.design.widget.AppBarLayout android:layout_height="192dp" android:layout_width="match_parent"> <android.support.design.widget.CollapsingToolbarLayout android:layout_width="match_parent" android:layout_height="match_parent" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <android.support.v7.widget.Toolbar android:layout_height="?attr/actionBarSize" android:layout_width="match_parent" app:layout_collapseMode="pin"/> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout>

Hay una biblioteca llamada FadingActionBar que hace exactamente lo que estás pidiendo. Puede encontrar la biblioteca en https://github.com/ManuelPeinado/FadingActionBar y una aplicación de demostración en https://play.google.com/store/apps/details?id=com.manuelpeinado.fadingactionbar.demo .

El uso sería algo como esto:

FadingActionBarHelper helper = new FadingActionBarHelper() // Set the ActionBar drawable - basically the color .actionBarBackground(R.drawable.ab_background) // Set the Header - usually an image .headerLayout(R.layout.header) // Set the main layout .contentLayout(R.layout.activity_scrollview); setContentView(helper.createView(this)); helper.initActionBar(this);

Puede personalizar la animación de paralaje siguiendo el desplazamiento de la vista de reciclador

Primero en el diseño de la vista de imagen. Establecer el diseño principal es más pequeño que la vista de imagen para evitar que la imagen quede fuera del límite cuando se establece la traducciónY

<android.support.percent.PercentRelativeLayout android:id="@+id/index_level6_image_section" android:layout_width="match_parent" android:layout_height="200dp" android:clipChildren="false"> <ImageView android:id="@+id/index_level6_parallaxImage" android:layout_width="match_parent" android:layout_height="240dp" android:layout_centerInParent="true" android:background="@color/timberwolf" android:layout_marginTop="-20" android:layout_marginBottom="-20" android:scaleType="centerCrop" app:imageUrl="@{level6CellViewModel.level6ImageUrl}" /> </android.support.percent.PercentRelativeLayout>

Después de eso, rastree el efecto de desplazamiento de la vista del reciclador y cambie la vista de la imagen.

*** Estoy usando rxbinding y kotlin para la implementación. Puede usar el método de escucha tradicional y el enfoque de Java con la misma idea.

RxRecyclerView.scrollEvents(recyclerView) .subscribe { event -> // get the visible cell items of the recycler view val firstVisible = layoutManager.findFirstVisibleItemPosition() val visibleCount = Math.abs(firstVisible - layoutManager.findLastVisibleItemPosition()) /** loop the visible cell items from the recycler view */ for (i in firstVisible..firstVisible + visibleCount) { event.view().layoutManager?.findViewByPosition(i)?.let { cellItem -> /** only for index cell level 6 parallax image */ cellItem.findViewById(R.id.index_level6_parallaxImage)?.let { imageView -> /** setting the parallax effect */ val translationY = (cellItem.top - cellItem.height) / level6ParallaxRate imageView.translationY = -translationY } } } }