Pregunta ¿Qué es CoordinatorLayout?


Solo eché un vistazo a la aplicación de demostración de la nueva biblioteca de diseño de soporte de Android. Es proporcionado por Chris Banes en github. A través de la aplicación, CoordinatorLayout se usa mucho. Además, muchas de las clases de biblioteca de diseño de soporte tales como FloatingActionButton, SnackBar, AppBarLayout etc. se comporta de manera diferente cuando se usa dentro CoordinatorLayout.

¿Alguien puede por favor arrojar algunas luces sobre lo que es CoordinatorLayout y cómo es diferente de otros ViewGroups en Android, o al menos proporcionar la ruta correcta hacia el aprendizaje CoordinatorLayout.


76
2018-05-29 18:35


origen


Respuestas:


Aquí está lo que está buscando.

de docs

la biblioteca de Diseño presenta CoordinatorLayout, un diseño que proporciona un nivel adicional de control sobre los eventos táctiles entre vistas secundarias, algo que muchos de los componentes de la biblioteca de diseño aprovechan.

https://android-developers.googleblog.com/2015/05/android-design-support-library.html

en este enlace, verá los videos demostrativos de todas las vistas mencionadas anteriormente.

espero que esto ayude :)


33
2018-05-29 19:37



¿Qué es un CoordinatorLayout? No dejes que el nombre elegante te engañe, no es más que un FrameLayout con esteroides

Para comprender mejor qué CoordinatorLayout es / hace, primero debe comprender / tener en cuenta lo que significa Coordinar.

Si busca la palabra en Google

Coordinar

Esto es lo que obtienes:

enter image description here

Creo que estas definiciones ayudan a describir lo que hace un CoordinatorLayout por sí mismo y cómo se comportan las vistas dentro de él.

Un CoordinatorLayout (un ViewGroup) trae los diferentes elementos (vistas secundarias) de una (̶a̶ ̶c̶o̶m̶p̶l̶e̶x̶̶e̶x̶e̶x̶a̶c̶t̶i̶v̶i̶t̶y̶ ̶o̶r̶ ̶a̶n̶ ̶o̶r̶g̶a̶n̶i̶z̶a̶t̶i̶o̶n̶ ̶o̶r̶ ̶a̶n̶ ̶o̶r̶g̶a̶n̶i̶z̶a̶t̶i̶o̶n̶) ̶ en una relación armoniosa o eficiente:

Con la ayuda de un CoordinatorLayout, las vistas de los niños trabajan en conjunto de manera armoniosa para implementar comportamientos increíbles tales como

arrastra, golpea, arroja o cualquier otro gesto.

Las vistas dentro de un CoordinatorLayout negocian con otros para trabajar conjuntamente de manera efectiva especificando estos Comportamientos

Un CoordinatorLayout es una característica genial de Material Design que ayuda a crear diseños atractivos y armonizados.

Todo lo que tiene que hacer es ajustar las vistas de su hijo dentro de CoordinatorLayout.

<?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"
 tools:context="com.byte64.coordinatorlayoutexample.ScollingActivity">

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



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

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

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

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/fab_margin"
    app:layout_anchor="@id/app_bar"
    app:layout_anchorGravity="bottom|end"
    app:srcCompat="@android:drawable/ic_dialog_email" />

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

y content_scrolling:

<?xml version="1.0" encoding="utf-8"?>
<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:layout_height="match_parent"
 app:layout_behavior="@string/appbar_scrolling_view_behavior"
 tools:context="com.byte64.coordinatorlayoutexample.ScollingActivity"
 tools:showIn="@layout/activity_scolling">

 <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/text_margin"
    android:text="@string/large_text" />

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

Lo que esto nos proporciona es un diseño que se puede desplazar para colapsar la barra de herramientas y ocultar el FloatingActionButton

Abierto:

enter image description here

Cerrado:

enter image description here


17
2018-01-26 19:33



Un punto adicional a tener en cuenta. Desde que OP preguntó específicamente

Además, muchas de las clases de libabry de diseño de soporte como   FloatingActionButton, SnackBar, AppBarLayout etc. se comporta de manera diferente   cuando se usa dentro de CoordinatorLayout.

Y creo que es por esto.

CoordinatorLayout es un FrameLayout superpoblado.

Botón FAB, SnackBar funciona con el concepto de FrameLayout, y dado que CoordinatorLayout tiene funcionalidad de FrameLayout, ¡podría hacer que otras vistas se comportaran de manera diferente !.


11
2017-07-02 11:35



CoordinadorDisposición es esencialmente el diseño del marco con muchas capacidades, lo cual es obvio por el nombre, automatiza la coordinación entre sus hijos y ayuda a construir vistas hermosas. Su implementación se puede ver en la aplicación Google Play Store. Cómo la barra de herramientas colapsa y cambia de color.

La mejor cosa sobre CoordinadorDisposiciónes el comportamiento que le damos a sus descendientes directos o indirectos. Debes haber visto mientras se desplaza todo el UI se pone en movimiento. Es muy probable que el comportamiento funcione su magia.


7
2018-06-23 06:10



Para dar una instantánea rápida de lo que es útil en el Documentación de Android :

Use CoordinatorLayout para simplemente controlar el comportamiento relacional de sus vistas,

Por ejemplo, si quiere que su ToolBar se colapse u oculte. Google lo hizo realmente fácil al presentar AppBarLayout y CollapsingToolbarLayout, que funcionan mejor bajo un CoordinatorLayout.

La otra situación más utilizada es cuando desea que un FloatingActionButton se adhiera a la parte inferior de su CollapsingToolbar y se mueva con él, colocándolos bajo un coordinador Layout y use app:layout_anchor="@id/YourAppBarId" para el pegamento (!) y app:layout_anchorGravity="bottom|end" ¡ya que la posición será suficiente para que veas el trabajo mágico!

Al utilizar este diseño como un contexto, las vistas secundarias tendrán una mejor colaboración y se comportarán de una manera inteligente porque se conocerán entre sí a través del contexto CoordinatorLayout, esto significa que sus botones de FloatingAction ya no se superpondrán con un snackBar, etc.

estos fueron solo un resumen rápido de las partes más útiles, por lo que si desea ahorrar más tiempo en la animación de su aplicación, valdrá la pena tener una inmersión más profunda en el tema.

ver el Plantilla de actividad de vista Desplazamiento de Google


5
2017-08-23 06:29