Barra de herramientas flotante con Appcompat

Cómo crear una barra de herramientas flotante como la siguiente, tal como se propone en las directrices de diseño de material y en la aplicación Google Map.

Introduzca aquí la descripción de la imagen

He trabajado con la barra de herramientas antes y todos los comentarios de CommonsWare son absolutamente correctos.

El widget de la Toolbar ( https://developer.android.com/reference/android/support/v7/widget/Toolbar.html ) no tiene nada especial o diferente que cualquier otro Viewgroup y no se comporta de manera diferente a cualquier otro ViewGroup.

Ponerlo dentro de un FrameLayout , poner un parámetro layout_margin en él, hacer que el layout_width NO match_parent y eso es todo.

Póngalo dentro de un LinearLayout con orientation=horizontal y puede utilizar el layout_weight para controlar el tamaño en porcentaje. O simplemente usar la dip simple si eso se adapta a sus necesidades.

Creo que la sugerencia de Mark para recoger la "mirada" CardView en el comentario anterior merece esta respuesta derivada:

Sólo tiene que poner una Toolbar de Toolbar en un CardView :

 <android.support.v7.widget.CardView android:id="@+id/map_toolbar_container" android:layout_width="@dimen/whatever_you_want" android:layout_height="wrap_content" android:layout_margin="8dp" app:cardElevation="8dp" app:cardBackgroundColor="#324"> <android.support.v7.widget.Toolbar android:id="@+id/wld_toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="?attr/colorPrimary" android:minHeight="?attr/actionBarSize"/> </android.support.v7.widget.CardView> 

Puesto que usted está siguiendo el concepto del diseño material estoy asumiendo que usted está utilizando la disposición del coordinador como su disposición principal y no disposición del capítulo.

Antes de nada necesitamos declarar las dependencias importantes.

 dependencies { compile 'com.android.support:design:22.2.1' compile 'com.android.support:cardview-v7:22.2.1' } 

Salida esperada / similar

Introduzca aquí la descripción de la imagen

Fragmento XML

 <?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:fitsSystemWindows="true"> <FrameLayout android:id="@+id/frmlyout_locationnote_mapholder" android:layout_width="match_parent" android:layout_height="match_parent"> <!-- You can add your Map here--> <ImageView android:id="@+id/imgvw_locationnote_background" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" /> </FrameLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:padding="16dp"> <android.support.v7.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content"> <android.support.v7.widget.Toolbar android:id="@+id/tlbr_locationnote_mainmenu" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_collapseMode="pin" /> </android.support.v7.widget.CardView> </LinearLayout> <android.support.design.widget.FloatingActionButton android:id="@+id/fab_locationnote_fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="@dimen/fab_margin" android:src="@drawable/ic_plus_white_24dp" app:layout_anchor="@id/frmlyout_locationnote_mapholder" app:layout_anchorGravity="bottom|right" /> </android.support.design.widget.CoordinatorLayout> 

Solo agrega el siguiente código ….

 <android.support.v7.widget.Toolbar android:layout_width="match_parent" android:layout_height="?android:attr/actionBarSize" android:id="@+id/toolbar" android:background="@color/colorPrimary" android:elevation="8dp" android:layout_margin="5dp" > //add whatever elements you want to add in here. </android.support.v7.widget.Toolbar> 
 <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" **android:layout_margin="10dp" android:elevation="5dp"** /> 
  • El estilo AutoCompleteTextView con AppCompat.EditText no funciona
  • Android Studio no encontró ninguna versión que coincida con com.android.support:appcompat-v7:23.+
  • Barra de herramientas se mueve fuera de la pantalla cuando uso adjustpan
  • Android SwitchCompat no está alineado
  • CoordinatorLayout usando el RecyclerView de ViewPager
  • Android.graphics.drawable.ColorDrawable no se puede convertir en android.support.v7.widget.RoundRectDrawableWithShadow
  • Problema de RecyclerView OnScrollListener ()
  • Problema con Android app-v7-appcompat con 4.0 y superior
  • Cómo diseñar el color del cursor de SearchView en AppCompat
  • Creación de un SearchView que se parezca a las directrices de diseño del material
  • Excepción de puntero nulo al usar el proveedor de acciones de la biblioteca de soporte
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.