Android Cómo implementar la hoja inferior desde los documentos de diseño de materiales

¿Cómo se implementa la especificación de la hoja inferior? http://www.google.com/design/spec/components/bottom-sheets.html

La nueva actualización de Google Drive muestra esto con el botón de acción flotante presione ->

enter image description here

De acuerdo, las especificaciones nunca dicen nada sobre las esquinas redondeadas, independientemente de lo que sea posible, simplemente no están seguros de cómo hacerlo. Actualmente, usa la biblioteca de AppCompat y el objective establecido en 21.

Gracias

Editar

El BottomSheet ahora es parte de la android-support-library . Ver la respuesta de John Shelleys .


Lamentablemente, actualmente no existe una forma “oficial” de cómo hacer esto (al menos ninguna de la que tenga conocimiento).
Afortunadamente, hay una biblioteca llamada “BottomSheet” (clic) que imita la apariencia de BottomSheet y es compatible con Android 2.1 y posteriores.

En el caso de la aplicación Drive, así es como se vería el código con esta biblioteca:

  new BottomSheet.Builder(this, R.style.BottomSheet_Dialog) .title("New") .grid() // <-- important part .sheet(R.menu.menu_bottom_sheet) .listener(new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { // TODO } }).show(); 

menu_bottom_sheet (básicamente un recurso /res/menu/*.xml estándar)

      

La salida se ve así:

imagen de la hoja inferior

Lo cual, creo, se acerca bastante al original. Si no está satisfecho con los colores, puede personalizarlo; vea esto (clic) .

¡Respondiendo a mi propia pregunta para que los desarrolladores sepan que la nueva biblioteca de soporte ofrece esto finalmente! Todos saludan al todopoderoso Google!

Un ejemplo del Blog del desarrollador de Android :

 // The View with the BottomSheetBehavior View bottomSheet = coordinatorLayout.findViewById(R.id.bottom_sheet); BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet); behavior.setBottomSheetCallback(new BottomSheetCallback() { @Override public void onStateChanged(@NonNull View bottomSheet, int newState) { // React to state change } @Override public void onSlide(@NonNull View bottomSheet, float slideOffset) { // React to dragging events } }); 

La respuesta de @reVerse anterior sigue siendo una opción válida, pero es bueno saber que hay un estándar que Google también admite.

Ahora puede usar Official BottomSheetBehavior API desde la biblioteca de soporte de android 23.2.

A continuación se muestra un fragmento de código de muestra

 bottomSheetBehavior = BottomSheetBehavior.from(findViewById(R.id.bottomSheet)); case R.id.expandBottomSheetButton: bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED); break; case R.id.collapseBottomSheetButton: bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED); break; case R.id.hideBottomSheetButton: bottomSheetBehavior.setState(BottomSheetBehavior.STATE_HIDDEN); break; case R.id.showBottomSheetDialogButton: new MyBottomSheetDialogFragment().show(getSupportFragmentManager(), "sample"); 

Consulte el tutorial de youtube de Android BottomSheet para comprenderlo.

Siguiendo la publicación del blog: http://android-developers.blogspot.com/2016/02/android-support-library-232.html

Mi xml terminó luciendo así:

      

Y en mi onCreateView de mi fragmento:

  coordinatorLayout = (CoordinatorLayout)v.findViewById(R.id.coordinator_layout); View bottomSheet = coordinatorLayout.findViewById(R.id.bottom_sheet); BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet); behavior.setPeekHeight(100); behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() { @Override public void onStateChanged(@NonNull View bottomSheet, int newState) { // React to state change } @Override public void onSlide(@NonNull View bottomSheet, float slideOffset) { // React to dragging events } }); 

El valor predeterminado de setPeekHeight es 0, por lo que si no lo configura, no podrá ver su vista.

Me gustaría ir con una esquina recta, ya que está en las directrices. En cuanto a la implementación, tal vez sea mejor usar la idea de este proyecto: https://github.com/umano/AndroidSlidingUpPanel

Creo que podría usarlo tal como está o tomar la idea para la implementación. Otro gran artículo sobre cómo implementar un panel deslizante similar se puede encontrar aquí: http://blog.neteril.org/blog/2013/10/10/framelayout-your-best-ui-friend/

Estas son algunas de las otras opciones:

  • Hay uno disponible de Flipboard , sin embargo, la actividad de inserción debe modificarse para que funcione la hoja inferior.
  • La hoja inferior de tutti-ch: Esto se ha extraído de ResolverActivity de Android Repo y no es necesario modificar la actividad de lanzamiento.

Google lanzó recientemente la Biblioteca de soporte de Android 23.2 que oficialmente trae hojas inferiores a la Biblioteca de soporte de diseño de Android.