BottomNavigationView(底部导航)
BottomNavigationView 很早之前就在 Material Design 中出现了,但是直到 Android Support Library 25 中才增加了 BottomNavigationView 控件。也就是说如果使用官方的BottomNavigationView控件必须让targetSdkVersion >= 25,这样才能引入25版本以上的兼容包。
接下来我们来看看如何使用BottomNavigationView。
使用BottomNavigationView 需要添加design兼容包的依赖。
dependencies {
//...
compile 'com.android.support:design:25.1.0'
}
在 res/menu/ 目录下创建一个 xml 文件(没有该目录则手动创建一个),我将其命名为 navigation.xml,里面使用的图片资源都是系统自带的。这个文件是用来定义导航条目具体的信息。
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/call"
android:icon="@android:drawable/ic_menu_call"
android:title="call" />
<item
android:id="@+id/message"
android:icon="@android:drawable/ic_dialog_email"
android:title="message" />
<item
android:id="@+id/search"
android:icon="@android:drawable/ic_menu_search"
android:title="搜索" />
<item
android:id="@+id/delete"
android:icon="@android:drawable/ic_menu_delete"
android:title="删除"/>
</menu>
每个item表示底部导航的一个条目,icon是图标,title是文字。
然后修改Activity布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_bottom_navigation_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
>
<TextView
android:id="@+id/tv_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="演示内容"
android:textSize="36sp"/>
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:itemBackground="@android:color/black"
app:itemIconTint="@android:color/white"
app:itemTextColor="@android:color/white"
app:menu="@menu/navigation"/>
</RelativeLayout>
BottomNavigationView有几个特殊的属性,
* itemtBackground 条目背景
* itemIcoTint 图标渲染的颜色
* itemtTextColor 文字的颜色
* menu 关联上面创建的菜单
最后修改BottomNavigationViewActivity代码
public class BottomNavigationViewActivity extends AppCompatActivity {
private TextView textView;
private BottomNavigationView navigationView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bottom_navigation_view);
textView = (TextView) findViewById(R.id.text);
navigationView = (BottomNavigationView) findViewById(R.id.navigation);
//选中条目的监听事件
navigationView.setOnNavigationItemSelectedListener(
new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
textView.setText(item.getTitle().toString());
return true;
}
});
}
}
注意事项
* 底部导航栏默认高度是56dp
* 菜单建议是3-5个
运行结果:
更多精彩请关注微信公众账号likeDev
BottomNavigationView(底部导航)的更多相关文章
- 第三十七篇-BottomNavigationVIew底部导航的使用
效果图: 添加底部导航和viewpaper 设置底部导航在底部 app:layout_constraintBottom_toBottomOf="parent" 新建四个fragme ...
- 014 Android BottomNavigationView 底部导航组件使用
1.导入BottomNavigationView组件(点击下载按钮,安装组件) 2.新建菜单 (1)app--->src-->main--->res ,选中res目录右击new--- ...
- Android (争取做到)最全的底部导航栏实现方法
本文(争取做到)Android 最全的底部导航栏实现方法. 现在写了4个主要方法. 还有一些个人感觉不完全切题的方法也会简单介绍一下. 方法一. ViewPager + List<View> ...
- Android应用-底部导航栏的使用
目录 1. 设计底部导航栏页面 1.1. 创建必须的文件夹 1.2. 设计主页面 2. 设计逻辑函数 3. 项目展示 底部导航栏是基于Bottom Navigation Bar 插件使用的 这个插件包 ...
- TextView+Fragment实现底部导航栏
前言:项目第二版刚上线没多久,产品又对需求进行了大改动,以前用的是左滑菜单,现在又要换成底部导航栏,于是今天又苦逼加班了.花了几个小时实现了一个底部导航栏的demo,然后总结一下.写一篇博客.供自己以 ...
- Android应用底部导航栏(选项卡)实例
现在很多android的应用都采用底部导航栏的功能,这样可以使得用户在使用过程中随意切换不同的页面,现在我采用TabHost组件来自定义一个底部的导航栏的功能. 我们先看下该demo实例的框架图: 其 ...
- ios7隐藏系统底部导航
ios7隐藏系统底部导航 minimal-ui <meta id="viewport" name="viewport" content="wid ...
- bootstrap 固定底部导航自适应
在使用bootstrap 底部导航的时候遇到了一个问题 -- 当我的内容超过一屏的时候,底部的部分内容会被固定的导航内容遮盖 自己写了一个JS脚本,解决自适应的问题 <nav class=&qu ...
- 【简单项目框架一】Fragment实现的底部导航
流行的应用的导航一般分为两种,一种是底部导航,一种是侧边栏. 我所做的项目涉及到比较多的是底部导航,今天我就把项目中使用的一种实现方式分享一下. 主要实现思路是:在一个Activity里面底部添加四个 ...
随机推荐
- Linux文本编辑命令
sort 排序工具,比较排序(根据字典排序) -t 指定分隔符(默认是空格) -k 指定第几域排序(默认第一域) -n 以数字大小排序 -r 逆向排序 -v 去掉重复行 -o 输出到文件中 -c 测试 ...
- 2019-2-17-如何在-Windows-10-中移除-Internet-Explorer-浏览器
title author date CreateTime categories 如何在 Windows 10 中移除 Internet Explorer 浏览器 lindexi 2019-02-17 ...
- Linux-c线程创建
{ pthread_attr_t attr;//线程属性 , err_sav; if (!pThreadId) { errno = EINVAL; ; } memset(&attr, , si ...
- css3 随记
1 让子元素对其的方式 box-pack 2 -webkit-text-size-adjust 解决字体大小失效问题http://www.frontopen.com/273.html 3 disp ...
- opensuse 通过composer安装drush工具
由于笔者的opensuse已安装好composer,所以按照官方网站的文章 Installing/Upgrading Drush on Ubuntu,使用composer形式安装drush工具. co ...
- 廖雪峰Java11多线程编程-3高级concurrent包-3Condition
Condition实现等待和唤醒线程 java.util.locks.ReentrantLock用于替代synchronized加锁 synchronized可以使用wait和notify实现在条件不 ...
- 区间dp——好题cf1132F
真的是很好的题 要通过左端点 l 和中间点k进行比较(去找和l同色的k即可) 然后n3来转移 #include<bits/stdc++.h> using namespace std; #d ...
- 2-sat——输出方案poj3683
一篇讲的详细的博客 https://blog.csdn.net/Hawo11/article/details/74908233 缩点后为什么要建立反图? 如果是按原图处理,选择一个点之后要把所有其后续 ...
- React中的this.props.children
React this.props.children this.props对象的属性与组件的属性一一对应,但是有一个例外,就是this.props.children属性.它表示组件的所有子节点. var ...
- php中$_REQUEST、 $_GET、 $_POST、 $_COOKIE 的关系和区别
看到REQUEST可以通吃GET .POST .COOKIE 后 感觉这个$_REQUEST太强大了是不是其他的几个超级变量就没有用了,下面对他们整体做个比较: 1.安全性 post>get 2 ...