时间戳

首页 > 解决方案 > 如何更改选定的 BottomNavigationView 图标大小

android - 如何更改选定的 BottomNavigationView 图标大小

问题描述

我正在使用本机 BottomNavigationView，并且我想将选定的图标大小更改为大于未选定的图标大小。（exp.选定的图标 40dp，其他图标大小 20dp）。

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:layout_centerVertical="true"
        android:scaleType="center"
        style="@style/Widget.Design.BottomNavigationView"
        app:labelVisibilityMode="unlabeled"
        app:menu="@menu/navigation_menu" />


<item
    android:id="@+id/homePageFragment"
    android:icon="@drawable/selector_nav_home"
    android:orderInCategory="1"
    android:title="" />

<item
    android:id="@+id/discoverPageFragment"
    android:icon="@drawable/selector_nav_discover"
    android:orderInCategory="2"
    android:title="" />

<item
    android:id="@+id/qrPageFragment"
    android:icon="@drawable/selector_nav_qr"
    android:orderInCategory="3"
    android:title="" />

<item
    android:id="@+id/myAccountFragment"
    android:icon="@drawable/selector_nav_profile"
    android:orderInCategory="4"
    android:title="" />


<item android:drawable="@drawable/ic_bottom_navigation_profile" android:state_checked="true"/>

<item android:drawable="@drawable/ic_navigation_profile" android:state_checked="false"/>

标签： androidxmlkotlinbottomnavigationviewandroid-navigationview

解决方案

您可以像这样更改所选项目的文本大小：

样式.xml：

<style name="bottomNavigationView.Active" parent="@style/TextAppearance.AppCompat.Caption">
        <item name="android:textSize">16sp</item>
</style>

bottom_navigation_view.xml：

<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.bottomnavigation.BottomNavigationView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/bottomNavView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?android:attr/windowBackground"
    app:menu="@menu/bottom_nav_menu"
    app:labelVisibilityMode="labeled"
    app:itemIconSize="24dp"
    android:scaleType="center"
    app:itemTextAppearanceActive="@style/bottomNavigationView.Active" />

由于文本大小增加，所选项目的图标会抬起，整体上看起来所选元素的大小增加了：

像这样

推荐阅读