Hola developers, esta ocasión les traigo la información de como crear un Floating Action Menu con icono personalizado en Android Studio, sin mas nada que decir comencemos.
Lo primero que debemos de agregar la siguiente implementación en build.gradle en el apartado dependencies.
implementation 'com.github.toanvc:floatingactionmenu:0.8.9'
Modificaremos nuestro activity_main.xml con los siguientes contenido, donde FloatingActionsMenu corresponde al icono del menú y FloatingActionButton las opciones que tendrá nuestro menú flotante.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:fab="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/background" android:gravity="bottom|end"> <toan.android.floatingactionmenu.FloatingActionsMenu android:id="@+id/FabMenu" android:layout_width="wrap_content" android:layout_height="wrap_content" fab:fab_addButtonColorNormal="@color/white" fab:fab_addButtonColorPressed="@color/white_pressed" fab:fab_addButtonPlusIconColor="@color/half_black" fab:fab_addButtonSize="normal" fab:fab_labelsPosition="left"> <toan.android.floatingactionmenu.FloatingActionButton android:layout_width="wrap_content" android:layout_height="wrap_content" fab:fab_colorNormal="@color/white" fab:fab_colorPressed="@color/white_pressed" fab:fab_title="Label on the right" /> <toan.android.floatingactionmenu.FloatingActionButton android:layout_width="wrap_content" android:layout_height="wrap_content" fab:fab_colorNormal="@color/white" fab:fab_colorPressed="@color/white_pressed" fab:fab_size="mini" fab:fab_title="Another one on the right" /> </toan.android.floatingactionmenu.FloatingActionsMenu> </RelativeLayout>
Ahora bien para modificar el icono por defecto del menú flotante, agregamos el siguiente código a nuestro MainActivity.kt
var fabMenu: FloatingActionsMenu? = null; val fabMenu: FloatingActionsMenu = findViewById<FloatingActionsMenu>(R.id.FabMenu) fabMenu.setIcon(getDrawable(R.drawable.ic_money));
para obtener el clic de los botones del menú agregamos los siguiente.
val floatingActionButtonFirst: FloatingActionButton = findViewById(R.id.FloatingActionButtonFirst) floatingActionButtonFirst.setOnClickListener { println("Presione el primer botón") } val floatingActionButtonSeconds: FloatingActionButton = findViewById(R.id.FloatingActionButtonSeconds) floatingActionButtonSeconds.setOnClickListener { println("Presione el segundo botón") }
al final nuestro MainActivity.kt quedara de la siguiente forma
package com.serfinanza.myapplication import android.content.res.Resources import androidx.appcompat.app.AppCompatActivity import android.os.Bundle import toan.android.floatingactionmenu.FloatingActionsMenu; import android.view.View import toan.android.floatingactionmenu.FloatingActionsMenu.OnFloatingActionsMenuUpdateListener import toan.android.floatingactionmenu.FloatingActionButton class MainActivity : AppCompatActivity() { var fabMenu: FloatingActionsMenu? = null; override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) val fabMenu: FloatingActionsMenu = findViewById<FloatingActionsMenu>(R.id.FabMenu) fabMenu.setIcon(getDrawable(R.drawable.ic_money)); val floatingActionButtonFirst: FloatingActionButton = findViewById(R.id.FloatingActionButtonFirst) floatingActionButtonFirst.setOnClickListener { println("Presione el primer botón") } val floatingActionButtonSeconds: FloatingActionButton = findViewById(R.id.FloatingActionButtonSeconds) floatingActionButtonSeconds.setOnClickListener { println("Presione el segundo botón") } } }
Y con esto llegamos al final de esta entrada, espero que te sea de utilidad.