自己的自定义图标未显示在底部导航栏中 android studio

Question

我正在尝试制作一个底部导航栏，其中中间的图标是我自己的图标，应该可以点击并且应该适合 like this

在我制作的菜单目录中 bottom_navigation.xml 负责我想要的图标的行是：

<item
    android:id="@+id/park"
    android:icon="@drawable/ic_parkcenter"
    android:title="Park here"/>

在我的maps_activity.xml（我想要显示这个的主页）中我使用这个：

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:layout_height="75dp"
            android:layout_gravity="bottom"
            android:layout_width="match_parent"
            android:id="@+id/bottom_nav"
            map:menu="@menu/bottom_navigation" />

这就是我get

的结果

我想把它作为 imageview 而不是一个项目，但遗憾的是它在菜单中不起作用。我应该如何在这里进行？提前致谢！

编辑：我的 acitivty_maps.xml,

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <!-- Can be ignored -->
        <fragment
            android:id="@+id/map"
            android:name="com.google.android.gms.maps.SupportMapFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:visibility="visible" />
        <!-- Can be ignored -->
        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/purple_500"
            android:elevation="4dp"
            android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
            map:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_nav_left"
            android:layout_width="wrap_content"
            android:layout_height="75dp"
            android:layout_gravity="bottom"
            map:menu="@menu/bottom_navigation"
            android:background="@color/purple_500"/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_gravity="bottom">

            <!-- For the image i want in the middle -->
            <ImageView
                android:id="@+id/parkcenter"
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:layout_gravity="center"
                android:src="@drawable/ic_parkcenter" />
        </LinearLayout>

        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_nav_right"
            android:layout_width="wrap_content"
            android:layout_height="75dp"
            android:layout_gravity="bottom"
            map:menu="@menu/bottom_navigation"
            android:background="@color/purple_500"/>

        <!-- Can be ignored -->
        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:id="@+id/parking"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="end|center"
            android:layout_margin="16dp"
            android:contentDescription="@string/parking"
            android:src="@drawable/ic_parking" />

    </FrameLayout>

</LinearLayout>

如果有帮助的话，这就是抽屉布局的全部内容！再次感谢！

Answer 1

只需在您的 activity 或片段中尝试 java 的代码：

    bottomNavigationView.setItemIconTintList(null) ;

使用bottomNavigationView时用你的id初始化它。

Answer 2

可能有更好的方法来做到这一点，但是实现这样的事情的一种 hacky 方法是

<LinearLayout>
    <com.google.android.material.bottomnavigation.BottomNavigationView
                android:layout_height="75dp"
                android:layout_gravity="bottom"
                android:layout_width="wrap_content"
                android:id="@+id/bottom_nav_left"
                map:menu="@menu/bottom_navigation" />
    
        <LinearLayout
             android:layout_height="100dp"
             android:layout_width="match_parent"
             android:layout_gravity="bottom">
                <ImageView
                   android:layout_height="100dp"
                   android:layout_width="100dp"
                   src = ... />
                //Add textview or any other view. Otherwise remove linearlayout
       </LinearLayout>
    
       <com.google.android.material.bottomnavigation.BottomNavigationView
                android:layout_height="75dp"
                android:layout_gravity="bottom"
                android:layout_width="wrap_content"
                android:id="@+id/bottom_nav_right"
                map:menu="@menu/bottom_navigation" />
</LinearLayout>

这将在显示图像时为您提供额外的灵活性（让中间的图像在底部导航中没有色调的情况下变大）。对于左侧底部导航，填充带有图像左侧图标的项目，底部导航右侧相同

Answer 3

所以我终于弄清楚该怎么做，制作一个框架布局并在其中添加底部导航，其中有 5 个项目，中间项目没有名称，没有图标并且可检查为 false，最后添加图像查看框架布局内部并将其放在中间图标上。

<FrameLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom">

            <com.google.android.material.bottomnavigation.BottomNavigationView
                android:layout_width="match_parent"
                android:id="@+id/bottom_nav"
                android:layout_height="wrap_content"
                android:clipChildren="false"
                android:layout_gravity="bottom"
                android:elevation="15dp"
                map:itemIconSize="34dp"
                android:background="@color/purple_500"
                map:menu="@menu/bottom_navigation"
                android:paddingLeft="5dp"
                map:itemIconTint="@drawable/select"
                map:itemTextColor="@drawable/select"
                android:focusableInTouchMode="true"
                />

            <ImageView
                android:layout_width="wrap_content"
                android:id="@+id/tofront"
                android:layout_height="wrap_content"
                android:src="@drawable/ic_parkcenter"
                android:layout_gravity="center"
                android:scaleType="center"
                android:elevation="@android:dimen/app_icon_size"/>

            </FrameLayout>

你可以使用

val front = findViewById<ImageView>(R.id.tofront)
    front.bringToFront()

将图像放在前面。将侦听器添加到图像后，它会按预期工作！

自己的自定义图标未显示在底部导航栏中 android studio

Own custom icon not showing up in bottomnavigation bar android studio

xml

android

android-layout

android-studio

bottomnavigationview