标签: bottomnavigationview

我开始在 Android 应用程序上工作，我想使用这个新的 Android 导航组件。此应用程序将具有包含 5 个部分的底部导航视图，并且每个部分都需要保留片段的后台堆栈。就像我在第一部分并导航到搜索结果然后导航到地图一样，现在如果我在底部导航视图中单击个人资料部分然后返回到第一部分，我仍然需要在地图屏幕上。所以我发现了这个中等文章这解释了此问题的一种可能解决方案，即拥有 5 个 NavHostFragment，并根据您所在的部分显示/隐藏它们。还有一件事是，当你导航到一些片段时，我需要隐藏底部导航视图......所以我创建了一个新项目来尝试一些东西，我得到了一些奇怪的结果。我不能完全理解fitsSystemWindows属性是如何工作的，我有一些奇怪的行为......

第一件事是第四张图片工具栏中的标题有一些顶部边距，我不知道为什么......我创建了一个没有片段的全新项目，只有一个具有完全相同布局的主要活动，我没有顶部工具栏中标题的边距。

第二件事是，当我从 Safari 页面返回搜索结果（第 4 和第 5 个图像）时，底部导航视图无缘无故地显示了一半......

如何修复第 4 个和第 5 个图像？还有一个关于fitSystemWindows属性的问题。第一张图片上的搜索按钮不应该在状态栏下方吗？由于fitSystemWindows=true未应用于ConstraintLayout -> FrameLayout -> ExploreFragment's ConstraintLayout. 将fitSystemWindows属性添加到 XML的唯一位置是在fragment_safari.xml文件中。

注意：我需要支持的最低 Android API 级别是 21（Lollipop 及以上）。

这是代码：

我正在使用的主题

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="android:windowBackground">@color/colorWindowBackground</item>
</style>

主活动.kt

class MainActivity : AppCompatActivity() {
    // ...

    override fun onCreate(savedInstanceState: …

我想为我的应用程序构建底部导航，并在完成底部导航后。布局。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.design.widget.BottomNavigationView
            android:id="@+id/Bottomnav"
            android:layout_width="match_parent"
            android:layout_height="42dp"
            android:layout_gravity="bottom"
            android:background="#FFFFFF"
            app:menu="@menu/bottomnav_menus">

        </android.support.design.widget.BottomNavigationView>
    </android.support.design.widget.CoordinatorLayout>

</RelativeLayout>

接下来，我进入了我的主要活动来实现 onnavigationitemselectlistner，但是在没有任何错误的情况下执行此方法后，我的底部导航。不工作。

bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {

        switch (item.getItemId())
        {
            case R.id.live:
                Intent intent = new Intent(MainActivity.this, LiveScore.class);
                startActivity(intent);
                return true;
        }
        return false;
    }
});

我的菜单项：

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

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

    <item
        android:title=""
        android:id="@+id/live"
        android:icon="@drawable/baseline_live_tv_black_24dp"
        android:orderInCategory="2"/>
    <item
        android:title=""
        android:id="@+id/video"
        android:icon="@drawable/baseline_video_library_black_24dp"
        android:orderInCategory="3"/>
</menu>

如果您需要任何其他信息，请发表评论。

我正在构建一个具有底部导航栏的应用程序，我想在更改其高度时为该栏提供覆盖主页的功能，以防止主页中的内容减少以适应可用区域. 我怎样才能做到这一点？

我认为通过图像解释它可能会更好，所以我们开始：

这是主页与底部导航栏一起的样子：

普通应用：

当我单击黄色圆圈按钮（中间按钮）时，BottomAppBar必须增加其高度，但是当我这样做时，主要内容会减小其大小以适应可用空间。

奇怪的应用程序：

我想阻止它。我该怎么做？

这是我的代码：

class HomePage extends StatefulWidget {
  HomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  double _appBarHeight = 60.0;

  void _openBottomAppBar() {
    setState(() {
      if (_appBarHeight > 60) {
        _appBarHeight = 60.0;
      } else {
        _appBarHeight = 300.0;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    final Shader textGradient = LinearGradient(
      colors: <Color>[Theme.of(context).primaryColorDark, Theme.of(context).primaryColorLight],
    ).createShader(Rect.fromLTWH(0.0, 0.0, 200.0, 70.0));
    return …

我正在使用带有 afragment和 a的以下活动布局BottomNavigationView：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <fragment
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:id="@+id/fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        app:navGraph="@navigation/navigation_bottom"
        app:defaultNavHost="true"/>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/bottom_navigation_view"
        app:menu="@menu/bottom_navigation_menu"/>
</LinearLayout>

并在我的导航布局中定义了三个片段：

<navigation
    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/navigation_bottom"
    app:startDestination="@id/firstFragment">

    <fragment
        android:id="@+id/firstFragment"
        android:name="fragments.FirstFragment"
        android:label="fragment_first"
        tools:layout="@layout/fragment_first" />

    //The other two fragments
</navigation>

在我的活动中，我使用以下代码：

navController = Navigation.findNavController(this, R.id.fragment);
BottomNavigationView bnw = findViewById(R.id.bottom_navigation_view);
NavigationUI.setupWithNavController(bnw, navController);
NavigationUI.setupActionBarWithNavController(this, navController);

这是我的onSupportNavigateUp方法：

@Override
public boolean onSupportNavigateUp() {
    return Navigation.findNavController(this, R.id.fragment).navigateUp();
}

但是当我按下第二个图标（片段）时，什么也没有发生。如何解决这个问题？谢谢！

的最后一项RecyclerView被BottomNavigationView 重叠。描述和时间被BottomNavigationView 重叠。

framgment_news.xml：这包含我的 RecyclerView

<android.support.constraint.ConstraintLayout ...
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Fragments.NewsFragment"
android:background="#fff">

<ImageView
    android:id="@+id/imageView" ... />

<TextView
    android:id="@+id/textView" ... />

<TextView
    android:id="@+id/textView3" ... />

<TextView
    android:id="@+id/textView2" ... />

<com.mikhaellopez.circularimageview.CircularImageView
    android:id="@+id/circularImageView" ... />

<android.support.v7.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="12dp"
    app:layout_constraintTop_toBottomOf="@+id/textView3"
    tools:layout_editor_absoluteX="0dp"
    android:scrollbars="vertical">
</android.support.v7.widget.RecyclerView>

活动主页.xml

<android.support.constraint.ConstraintLayout ...
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".HomeActivity">

    <FrameLayout
        android:id="@+id/frameContainer"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginStart="0dp"
        android:layout_marginTop="0dp"
        android:layout_marginEnd="0dp"
        app:layout_constraintBottom_toTopOf="@+id/view"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        android:layout_above="@+id/bottom_navigation_view"
        app:layout_constraintTop_toTopOf="parent" />

    <!--Border on Top of Bottom Navigation View-->
    <View
        android:id="@+id/view"
        android:layout_width="match_parent"
        android:layout_height="0.5dp"
        android:background="#616161"
        app:layout_constraintBottom_toTopOf="@+id/bottom_navigation_view" />

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" …

所以，我有这个问题。我的底部导航涵盖了我的最后一项 recyclerview。底部导航处于活动状态。recyclerview 在片段中。我没有找到答案。

这是我的片段布局，其中包含 recyclerview

<android.support.constraint.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:context=".PromoFragment">

    <!-- TODO: Update blank fragment layout -->
    <android.support.v7.widget.RecyclerView
        android:id="@+id/promo_recyclerview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_marginBottom="110dp">

    </android.support.v7.widget.RecyclerView>
</android.support.constraint.ConstraintLayout>

这是我在 recyclerview 中使用的项目布局

<android.support.constraint.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="5px">

        <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginEnd="8dp"
            android:id="@+id/card_pertama"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent">

               <include layout="@layout/card_promo_layout"/>

        </android.support.v7.widget.CardView>

</android.support.constraint.ConstraintLayout>

这是我的代码结果的图像

我需要在我的 android 应用程序中实现底部导航视图。中间的图标需要是图像，即公司徽标。但是当我运行该应用程序时，它只出现一个灰色填充的圆形图标。上面的图片显示了我想要的和我得到的。

我想要的是：

我得到的：

我已经在这个网站上尝试过其他问题，但是每个答案都告诉我们使用可绘制对象更改 XML 中的 iconTintList，但中心图标是一个具有多种颜色的矢量。

当我尝试将 null 设置为 setIconTintList 方法时，适用于中间图标，但其他图标也会更改为原始颜色。

//This doesn't work to other icons, only for the middle one 
mBottomNav.setItemIconTintList(null);

我还尝试获取菜单并仅为中间的设置图标色调列表，就像上面的代码一样，但也不起作用。

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
    mBottomNav.getMenu().findItem(R.id.nav_buy).setIconTintList(null);
}

这是 XML 实现：

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottomNavigationView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:background="@color/kmv_background"
        app:itemIconTint="@drawable/bottom_nav_item_color"
        app:itemTextColor="@drawable/bottom_nav_item_color"
        app:labelVisibilityMode="labeled"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:menu="@menu/bottom_navigation" />

这是java实现：

mBottomNav = findViewById(R.id.bottomNavigationView);
mBottomNav.setOnNavigationItemSelectedListener(this);

谢谢你的帮助！

我正在尝试在底部导航栏的中间添加一个浮动操作按钮。问题是边框没有出现，浮动操作按钮和图标中的边距也不符合我的要求。

这是问题的图片。 实现的图像

这是我想要的 图片 所需图片

代码

bottomNavigationBar: SafeArea(child: _buildBottomBar(context)),
    floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    floatingActionButton: CircularGradientButton(
      tooltip: 'Increment',
      child: new Image.asset(UIData.cameraIcon),
      gradient: LinearGradient(colors: <Color>[
        Color.fromARGB(255, 17, 153, 142),
        Color.fromARGB(255, 56, 239, 125)
      ]),
      callback: () => openCamera(),
      //_optionsDialogBox(),
      elevation: 2.0,
    ), 



Widget _buildBottomBar(BuildContext context) {
return Material(
  color: Colors.white,
  child: TabBar(
    isScrollable: false,
    unselectedLabelColor: Colors.white.withOpacity(0.3),
    indicatorColor: Colors.white,
    tabs: <Tab>[
      new Tab(
        // set icon to the tab
        icon: Image.asset(
          _tabController.index == 0 ? UIData.mapIconActive : UIData.mapIcon,
          width: 30,
          height: 30,
        ),
      ), …

我BottomNavigationView用于底部标签。

1) Tab 1 - 从服务器获取数据并显示到RecyclerView
2) Tab 2 - 从服务器获取 URL 并加载Webview
3) Tab 3 - 从服务器获取数据并显示到RecyclerView
4) Tab 4 - 设置屏幕使用PreferenceFragmentCompat

为了在用户切换选项卡时保存这些片段的状态，我使用了此博客中的以下代码

保存Fragment.SavedState到SparseArray<Fragment.SavedState>

Fragment.State currentFragmentState = getSupportFragmentManager().saveFragmentInstanceState(currentFragment)

当用户导航回之前的选项卡时再次恢复状态

fragment.setInitialSavedState(savedState)

getSupportFragmentManager()
        .beginTransaction()
        .replace(R.id.container_fragment, fragment, tag)
        .commit();

我看到的是只有 Tab 4（设置屏幕 PreferenceFragmentCompat）保持状态 - 如果我向下滚动到第 10 个项目并在导航到其他片段后再次返回设置屏幕，我会在顶部看到第 10 个位置。

但是，前三个选项卡会再次调用 Web 服务，并且所有内容都会重新加载。另外，我可以看到前三个选项卡Bundle savedInstanceState的onCreateView方法参数也不为空。

我的问题是

1) PreferenceFragmentCompat(4th tab ) 如何自动恢复状态？
2）如何在前三个选项卡中使用非空Bundle savedInstanceState（onCreateView方法的参数）并像第四个选项卡一样恢复状态？ …

I've tried the following and got the out, but the body went blank. Is there any way to add a coloumn or a listview inside a bottom navigation bar

 Column(
    mainAxisAlignment:MainAxisAlignment.end,
    children: <Widget>[
      Row(
        children: <Widget>[
          Expanded(
              //button1
         ),
          Expanded(
              //button2
               ),
          Expanded(
             //button3)
      ),
      Row(
        children: <Widget>[
          Expanded(
            //button4
          ),
          Expanded(
            //button5)
        ],
      )
    ],
  ),