标签: android-bottomnavigationview

BottomNavigationBar() 只能采用background和contentColor，但没有色调选项。

这是我的设计师为我们的项目制作的导航。底部导航的高度为70dp。

到目前为止我已经尝试过的。

首先，我从设计中下载了一个矢量可绘制背景并将其设置为 BottomNavigationView 的背景

<com.google.android.material.bottomnavigation.BottomNavigationView
                android:layout_gravity="bottom"
                app:labelVisibilityMode="labeled"
                app:itemIconTint="@drawable/bnv_tab_item_foreground"
                app:itemTextColor="@drawable/bnv_tab_item_foreground"
                android:id="@+id/bottom_nav"
                android:layout_width="match_parent"
                android:layout_height="70dp"
                app:menu="@menu/menu_bottom_main"
                android:background="@drawable/background_bottom_navigation"/>

结果

正如您所看到的，曲线不如设计中的那么好。由于不同的 Android 屏幕尺寸，这种方法永远不会起作用。

我的第二次尝试是基于 Phillip Lackner 的教程 https://www.youtube.com/watch?v=x6-_va1R788&t=830s

我将 BottomNavigationView 放在 BottomAppBar 内。然后我创建了 FloatingActionButton 并将其layout_anchor属性设置为BottomAppBar

<com.google.android.material.bottomappbar.BottomAppBar
                app:fabCradleRoundedCornerRadius="20dp"
                android:backgroundTint="@color/blue_menu2"
                android:id="@+id/bottom_app_bar"
                android:layout_gravity="bottom"
                android:layout_width="match_parent"
                android:layout_height="56dp">
                <com.google.android.material.bottomnavigation.BottomNavigationView
                    app:labelVisibilityMode="labeled"
                    app:itemIconTint="@drawable/bnv_tab_item_foreground"
                    app:itemTextColor="@drawable/bnv_tab_item_foreground"
                    android:id="@+id/bottom_nav"
                    app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
                    android:layout_marginEnd="16dp"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="@android:color/transparent"
                    app:menu="@menu/menu_bottom_main" />
            </com.google.android.material.bottomappbar.BottomAppBar>

            <com.google.android.material.floatingactionbutton.FloatingActionButton
                android:scaleType="center"
                app:maxImageSize = "56dp"
                android:id="@+id/home_floating_button"
                app:layout_anchor="@id/bottom_app_bar"
                android:layout_width="56dp"
                android:layout_height="80dp">
            </com.google.android.material.floatingactionbutton.FloatingActionButton>

结果

正如你所看到的，曲线不够“深”。BottomAppBar 有属性 fabCradleVerticalOffset 但不幸的是你不能输入负值。

是否可以使用贝塞尔曲线尝试在底部导航中绘制自定义形状。我还没有尝试过。我不确定它是否适用于这个特定的底部导航设计。https://proandroiddev.com/how-i-drew-custom-shapes-in-bottom-bar-c4539d86afd7

如何创建这个弯曲的底部导航？

为什么底部导航栏标题不显示？它假设显示在图标下方

class FlutterProject extends StatefulWidget {
  final String title = "Flutter Bottom Tab demo";

  @override
  GoalsListState createState() {
    return GoalsListState();
  }
}

class GoalsListState extends State<FlutterProject>
    with SingleTickerProviderStateMixin {
  int _cIndex = 0;

  void _incrementTab(index) {
    setState(() {
      _cIndex = index;
    });
  }

  final List<Widget> _children = [
    new One(),
    new Two(),
    new Three(),
    new Four(),
    new More()
  ];

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        body: _children[_cIndex],
        bottomNavigationBar: BottomNavigationBar(
          currentIndex: _cIndex,
          type: BottomNavigationBarType.shifting,
          items: [
            BottomNavigationBarItem(
                icon:
                    Icon(Icons.graphic_eq, …

该项目支持RTL；特别是阿拉伯语。\n要求是，即使语言选择为阿拉伯语区域设置，所有数字也必须以英语格式显示，在 TextView 的情况下，我们在任何地方实现它的方式通常是以下代码：

TextView t = findViewById(R.id.sampleTV);\nt.setText(String.format("123",Locale.US));\n

这里 123 将显示为“123”，因为我们在美国语言环境中将其格式化为硬编码，而不是“\xd9\xa1\xd9\xa2\xd9\xa3”

我想对 Android Material 组件的底部导航提供的徽章通知实现相同的效果，这是我尝试过的：

if(navigation!=null) {  \n  NumberFormat nf = NumberFormat.getInstance(Locale.US);\n\n  BadgeDrawable badgeDrawable = navigation.getOrCreateBadge(R.id.nav_account);\n  if (badgeDrawable != null) {\n      if((counterNoti + counter + counterRoom) <= 0) {\n      badgeDrawable.setVisible(false);\n      badgeDrawable.clearNumber();\n  }\n  else\n      {\n      int x = counterNoti + counter + counterRoom;\n      nf.format(x);\n      badgeDrawable.setVisible(true);\n      badgeDrawable.setNumber(x);\n  }\n}\n\n(where navigation is reference to my BottomNavigation!)\n

但即便如此，数字仍以阿拉伯语显示，与 setText 的情况不同。有没有办法实现这一点或者我需要替代方案？

感谢您的投入和时间！谢谢。

我在我的应用程序中使用 BottomNavigationView，但有一个问题：在 BottomNavigationView.java 中有 import com.google.android.material.R 并且 R 是红色并写“无法解析符号 'R'”。我看到的主题对我没有帮助。

你会为我推荐什么？

依赖项：

    apply plugin: 'com.android.application'
android {
    compileSdkVersion 29
    defaultConfig {
        applicationId "com.example.yourspeakingclub"
        minSdkVersion 24
        targetSdkVersion 29
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
    sourceSets {
        main {
            java.srcDirs = ['src/main/java', 'src/main/java/Models', 'src/main/java/com/salendor/yourspeakingclub/models']
        }
    }
    buildToolsVersion = '28.0.3'
}

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'androidx.appcompat:appcompat:1.1.0'
    implementation 'com.android.support:support-compat'
    implementation 'androidx.constraintlayout:constraintlayout:2.0.0-beta2' …

我在底部导航视图中有 5 个图标，当我单击菜单时，我可以看到菜单的标题，如果我单击另一个图标，前一个的标题就会消失。我想继续以 XML 形式显示所有菜单的标题。我该怎么做？

这是我在活动 XML 中的代码。

 <androidx.coordinatorlayout.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true">

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNV"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:backgroundTint="@color/light_gray"
        app:itemIconTint="@color/black"
        app:itemTextColor="@color/black"
        app:menu="@menu/bottom_navigation_menu"/>


</androidx.coordinatorlayout.widget.CoordinatorLayout>

这是一个菜单资源文件。

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:id="@+id/bottom_menu_home"
    android:enabled="true"
    android:icon="@drawable/bottom_home_inactive"
    android:title="@string/bottom_menu_home" />

<item
    android:id="@+id/bottom_menu_search"
    android:enabled="true"
    android:icon="@drawable/bottom_search_inactive"
    android:title="@string/bottom_menu_search" />

<item
    android:id="@+id/bottom_menu_message"
    android:enabled="true"
    android:icon="@drawable/bottom_message_inactive"
    android:title="@string/bottom_menu_message" />

<item
    android:id="@+id/bottom_menu_reservation"
    android:enabled="true"
    android:icon="@drawable/bottom_reservation_inactive"
    android:title="@string/bottom_menu_reservation" />

<item
    android:id="@+id/bottom_menu_myInfo"
    android:enabled="true"
    android:icon="@drawable/bottom_myinfo_inactive"
    android:title="@string/bottom_menu_myInfo" />

我正在尝试为底部导航添加圆角，并且我尝试更改宽度和高度但它不起作用。我正在使用相对布局，宽度设置为“fill_parent”，高度设置为“warp_content”我有两个图标登录和注册，我希望整个导航都有圆角。我正在使用 Material Design 底部导航：

  <com.google.android.material.bottomnavigation.BottomNavigationView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:id="@+id/botttom_navigation"
    app:itemBackground="@android:color/darker_gray"
    app:itemTextColor="@drawable/selector"
    app:itemIconTint="@drawable/selector"
    android:layout_alignParentBottom="true"
    app:menu="@menu/menu_navigation"/>

这是它的样子

我希望它有这样的圆角。不是漂浮而是角落

我有一个底部导航视图，根据状态（如果选中或未选中）设置图标。

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/icon_tree"
        android:title="Tree"
        android:icon="@drawable/bottomnav_icon_home">
    </item>

</menu>

底部导航图标主页：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/icon_home_black" android:state_checked="false"/>
    <item android:drawable="@drawable/icon_home_green" android:state_checked="true"/>

</selector>

当 android:state_checked 为 true 时，底部导航如何自动突出显示图标。

如何完全禁用底部导航的图标选择突出显示？

我尝试过设置app:itemIconTint="@drawable/bottom_navigation_selector"但是@null不起作用

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:menu="@menu/bottom_navigation_menu"
            android:background="@color/colorWhite"
            app:itemTextColor="@drawable/bottom_navigation_selector"
            app:itemIconSize="28dp"
            app:itemIconTint="@drawable/bottom_navigation_selector"
            app:labelVisibilityMode="labeled"/>

底部导航选择器：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true"
        android:color="@color/forestGreen" />
    <item android:color="@color/colorBlack" />
</selector>

我为我的应用程序设计了底部导航视图。这个想法很简单，绿色底部栏将有白色图标。我为此写了一个选择器

<?xml version="1.0" encoding="utf-8"?>
  <selector xmlns:android="http://schemas.android.com/apk/res/android">

     <item android:state_checked="false" android:color="@android:color/white" />
     <item android:color="@android:color/holo_blue_dark"  />
  </selector>

它有效，它改变了图标颜色，但它并没有使其完全变成白色，颜色看起来呈灰色。我也尝试过，<item android:state_selected="true" android:color="@android:color/white" />但它也不起作用。我添加了下面的图片供您查看差异。

请帮忙

我当前的 Android 应用程序采用

com.google.android.material.bottomnavigation.BottomNavigationView

和app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"

视图内容是 androidx.recyclerview.widget.RecyclerView

当列表中显示的项目数量不足以启用滚动时，我遇到问题。

在这种情况下，BottomNavigationView不会隐藏，因此列表中的最后一项被部分隐藏。

RecyclerView我通过添加底部边距解决了这个问题android:layout_marginBottom="?attr/actionBarSize"

BottomNavigationView现在，当我因滚动而隐藏并且用户已滚动到列表中的最后一项时，此修复会导致问题。

由于底部边距，用户会在屏幕底部看到一个空白栏。

有什么办法可以解决这两种情况吗？

我的主要 xml 类似于此

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/suggest_home"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MyActivity">
    
        <com.google.android.material.appbar.AppBarLayout
            android:id="@+id/toolbarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
    
            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                style="@style/Widget.MaterialComponents.Toolbar.Primary"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary">
    
                <View
                    android:id="@+id/paddingView"
                    style="?android:attr/progressBarStyle"
                    android:layout_width="@dimen/size_menu_progressbar"
                    android:layout_height="@dimen/size_menu_progressbar"
                    android:layout_gravity="end" />
    
                <ProgressBar
                    android:id="@+id/myProgressBar"
                    style="?android:attr/progressBarStyle"
                    android:layout_width="@dimen/size_menu_progressbar"
                    android:layout_height="@dimen/size_menu_progressbar"
                    android:layout_gravity="end"
                    android:visibility="invisible" />
    
            </androidx.appcompat.widget.Toolbar>
    
        </com.google.android.material.appbar.AppBarLayout>
    
        <androidx.constraintlayout.widget.ConstraintLayout
            android:id="@+id/main_area"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">
    
            <androidx.fragment.app.FragmentContainerView
                android:id="@+id/navHostFragment"
                android:name="androidx.navigation.fragment.NavHostFragment"
                android:layout_width="0dp"
                android:layout_height="0dp"
                app:defaultNavHost="true"
android:layout_marginBottom="?attr/actionBarSize"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:navGraph="@navigation/my_graph"
                tools:context=".MyActivity" />
    
        </androidx.constraintlayout.widget.ConstraintLayout> …