【问题标题】:how to set top border for bottom navigation bar in android as shown in image如图所示,如何在 android 中为底部导航栏设置顶部边框
【发布时间】:2017-03-27 06:21:24
【问题描述】:

是否可以在 android 中为底部导航栏设置顶部边框,如果可以的话告诉我如何做到这一点,我正在使用 android 的新底部导航视图。 这是我的代码

<?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">
        <LinearLayout
            android:id="@+id/app_bar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_alignParentTop="true">
                <include
                    android:id="@+id/gamebar"
                    layout="@layout/gamebar_layout"
                    />
                <include
                    android:id="@+id/toolbar"
                    layout="@layout/toolbar_layout" />
        </LinearLayout>

        <!-- Let's add fragment -->
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/app_bar_layout"
            android:layout_above="@+id/bottom_navigation"
            android:id="@+id/contentContainer"/>
        <android.support.design.widget.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:layout_alignParentBottom="true"
            app:itemBackground="@color/BottomNavigationBgColor"
            app:itemIconTint="@color/CelestialBlue"
            app:itemTextColor="@color/CelestialBlue"
            app:menu="@menu/bottom_navigation_main" />
</RelativeLayout>

【问题讨论】:

  • @FerdousAhamed:rafsanahmad007(通过使用视图)已经给出了相同的答案,但我感谢您的努力。
  • 您的问题目前处于什么状态?
  • @FerdousAhamed:我正在寻找一些用于设置边框的 xml 属性,但我认为它不存在..
  • 是的,没有设置上边框的属性。您必须使用其他视图/视图组来创建它。
  • 如果您不想使用 VIEW,那么您可以通过其他方式进行。请参阅我的更新答案。谢谢~

标签: android android-layout bottomnavigationview


【解决方案1】:

你可以试试这个:在BottomNavigationView上方添加一个View元素

<View
    android:layout_width="match_parent"
    android:layout_height="4dp"
    android:layout_above="@+id/bottom_navigation"
    android:background="#000000"></View>

<android.support.design.widget.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    android:layout_alignParentBottom="true"
    app:itemBackground="@color/BottomNavigationBgColor"
    app:itemIconTint="@color/CelestialBlue"
    app:itemTextColor="@color/CelestialBlue"
    app:menu="@menu/bottom_navigation_main" />

【讨论】:

  • 通过视图我们可以做到这一点,但任何其他方式,如用于设置此边框的内置 xml 属性
  • Documentation我没有找到任何xml属性
【解决方案2】:
  1. 使用 XML 定义背景可绘制对象:

    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape android:shape="rectangle">
                <solid android:color="@color/colorPrimaryDark" />
            </shape>
        </item>
        <item android:top="1dp">
            <shape android:shape="rectangle">
                <solid android:color="@color/colorWhite" />
            </shape>
        </item>
    </layer-list>
    
  2. 用它作为背景

    android:background="@drawable/myBackgroundBottomDrawer"
    

【讨论】:

    【解决方案3】:

    您可以通过创建一个新的LinearLayout 来添加上边框,其中View 用于上边框并将android.support.design.widget.BottomNavigationView 放在上边框View 下方。

    这是工作代码。只需按如下方式更新您的 XML:

    <?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">
    
        <LinearLayout
            android:id="@+id/app_bar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_alignParentTop="true">
    
            <include
                android:id="@+id/gamebar"
                layout="@layout/gamebar_layout"/>
            <include
                android:id="@+id/toolbar"
                layout="@layout/toolbar_layout" />
        </LinearLayout>
    
        <!-- Bottom Navigation Layout-->
        <LinearLayout
            android:id="@+id/layout_bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_alignParentBottom="true">
    
            <!-- Top Border -->
            <View
                android:layout_width="match_parent"
                android:layout_height="6dp"
                android:background="#FF0000"> 
    
            </View>
    
            <!-- BottomNavigationView -->
            <android.support.design.widget.BottomNavigationView
                android:id="@+id/bottom_navigation"
                android:layout_width="match_parent"
                android:layout_height="56dp"
                app:itemBackground="@color/BottomNavigationBgColor"
                app:itemIconTint="@color/CelestialBlue"
                app:itemTextColor="@color/CelestialBlue"
                app:menu="@menu/bottom_navigation_main" />
        </LinearLayout>
    
        <!-- Let's add fragment -->
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/app_bar_layout"
            android:layout_above="@id/layout_bottom_navigation"
            android:id="@+id/contentContainer"/>
    
    </RelativeLayout>
    

    更新:如果您不使用View,那么您可以将属性android:layout_marginTop 添加到android.support.design.widget.BottomNavigationView 并将背景颜色设置为android:background="#FF0000"LinearLayout

    <!-- Bottom Navigation Layout-->
        <LinearLayout
            android:id="@+id/layout_bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_alignParentBottom="true"
            android:background="#FF0000">
    
            <!-- BottomNavigationView -->
            <android.support.design.widget.BottomNavigationView
                android:id="@+id/bottom_navigation"
                android:layout_width="match_parent"
                android:layout_height="56dp"
                android:layout_marginTop="6dp"
                app:itemBackground="@color/BottomNavigationBgColor"
                app:itemIconTint="@color/CelestialBlue"
                app:itemTextColor="@color/CelestialBlue"
                app:menu="@menu/bottom_navigation_main" />
        </LinearLayout>
    

    希望对你有帮助~

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-07-29
      • 1970-01-01
      • 2019-11-03
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多