es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

BottomNavigationView, iconos espaciados de forma igual

02 Aug, 2023 Programación

Estoy usando BottomNavigationView con dos elementos, sin embargo, en una tableta o en vista horizontal, ambos iconos se desplazan hacia el centro.

Estoy intentando que estén espaciados de manera equitativa, similar a lo que muestra el material, pero sin etiqueta:

Aquí está mi código, ¿alguien sabe si hay algún atributo que pueda usar para lograr esto?

<com.google.android.material.bottomnavigation.bottomnavigationview android:id="@+id/bottom_nav_view" android:layout_width="0dp" android:layout_height="wrap_content" android:background="@color/navigation_background" app:itemicontint="@color/navigation_icon_color_selector" app:labelvisibilitymode="unlabeled" app:layout_constraintbottom_tobottomof="parent" app:layout_constraintleft_toleftof="parent" app:layout_constraintright_torightof="parent" app:menu="@menu/bottom_nav_menu"></com.google.android.material.bottomnavigation.bottomnavigationview>
Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Desafortunadamente, no hay ningún atributo en BottomNavigationView que permita espaciar igualmente los iconos sin etiquetas. Sin embargo, puedes lograr esto programáticamente estableciendo el ancho de los elementos del menú, utilizando un diseño personalizado para los elementos del menú o mediante el uso de una biblioteca de terceros.

    Para establecer el ancho de los elementos programáticamente, puedes hacer lo siguiente:

    val menu = bottomNavView.menu
val menuItem1 = menu.findItem(R.id.menu_item1)
val menuItem2 = menu.findItem(R.id.menu_item2)

val displayMetrics = DisplayMetrics()
windowManager.defaultDisplay.getMetrics(displayMetrics)
val screenWidth = displayMetrics.widthPixels

val itemWidth = screenWidth / menu.size()

val layoutParams1 = menuItem1.icon.bounds
layoutParams1.width = itemWidth
layoutParams1.height = itemWidth
menuItem1.icon.bounds = layoutParams1

val layoutParams2 = menuItem2.icon.bounds
layoutParams2.width = itemWidth
layoutParams2.height = itemWidth
menuItem2.icon.bounds = layoutParams2

    Alternativamente, puedes crear un diseño personalizado para los elementos del menú y utilizar el atributo app:itemBackground para aplicarlo a BottomNavigationView. Este diseño puede incluir elementos ImageView equidistantes para los iconos.

    Por último, también puedes considerar el uso de una biblioteca de terceros como AHBottomNavigation o BottomNavigationBar, que ofrecen más opciones de personalización para BottomNavigationView.

Comments are closed.