¿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é CoordinatorLayoutes / hace, primero debe comprender / tener en cuenta lo que significa Coordinar.
Si buscas en Google la palabra
Coordinar
Esto es lo que obtienes:
Creo que estas definiciones ayudan a describir lo que hace un CoordinatorLayout por sí solo 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̶ ̶a̶c̶t̶i̶v̶i̶t̶y̶ ̶o̶r̶ ̶a̶n̶ ̶o̶r̶g̶i ̶n̶i̶i̶a̶t̶ ̶ ̶ ̶ ̶ ̶ ̶ ̶ ̶ ̶ ̶
Con la ayuda de un CoordinatorLayout, las vistas de los niños funcionan juntas de manera armoniosa para implementar comportamientos asombrosos como
arrastres, golpes, lanzamientos o cualquier otro gesto.
Las vistas dentro de un CoordinatorLayout negocian con otros para trabajar juntos de manera efectiva al especificar 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 envolver las vistas de su hijo dentro del 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 da es un diseño que se puede desplazar para contraer la barra de herramientas y ocultar el FloatingActionButton
Abierto:
Cerrado:
