全网最详细的-动态Toolbar-开发实践总结,99%的程序员都在看!(1)


最后到 ToolbarActivity 中调用代码拿到这 Toolbar 控件,并在代码中做各种setXXX操作。

/**

  • Toolbar的基本使用
    */
    public class ToolBarActivity extends BaseActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_tool_bar);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

//设置导航栏图标
toolbar.setNavigationIcon(R.mipmap.ic_drawer_home);
//设置app logo
toolbar.setLogo(R.mipmap.ic_launcher);
//设置主标题
toolbar.setTitle(“Title”);
//设置子标题
toolbar.setSubtitle(“Subtitle”);
//设置右上角的填充菜单
toolbar.inflateMenu(R.menu.base_toolbar_menu);
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
int menuItemId = item.getItemId();
if (menuItemId == R.id.action_search) {
Toast.makeText(ToolBarActivity.this , R.string.menu_search , Toast.LENGTH_SHORT).show();
} else if (menuItemId == R.id.action_notification) {
Toast.makeText(ToolBarActivity.this , R.string.menu_notifications , Toast.LENGTH_SHORT).show();
} else if (menuItemId == R.id.action_item1) {
Toast.makeText(ToolBarActivity.this , R.string.item_01 , Toast.LENGTH_SHORT).show();
} else if (menuItemId == R.id.action_item2) {
Toast.makeText(ToolBarActivity.this , R.string.item_02 , Toast.LENGTH_SHORT).show();
}
return true;
}
});
}
}

代码到此已经完成了 Toolbar 的基本使用,注意,是基本使用而已!!!!!下面有几个代码里面需要注意的地方:

  1. 我们在使用 Toolbar 时候需要先隐藏掉系统原先的导航栏,网上很多人都说给Activity设置一个NoActionBar的Theme。但个人觉得有点小题大做了,所以这里我直接在BaseActivity中调用 supportRequestWindowFeature(Window.FEATURE_NO_TITLE) 去掉了默认的导航栏(注意,我的BaseActivity是继承了AppCompatActivity的,如果是继承Activity就应该调用requestWindowFeature(Window.FEATURE_NO_TITLE));
  2. 如果你想修改标题和子标题的字体大小、颜色等,可以调用setTitleTextColorsetTitleTextAppearancesetSubtitleTextColorsetSubtitleTextAppearance 这些API;
  3. 自定义的View位于 titlesubtitle 和 actionmenu 之间,这意味着,如果 title和 subtitle 都在,且 actionmenu选项 太多的时候,留给自定义View的空间就越小;
  4. 导航图标 和 app logo 的区别在哪?如果你只设置 导航图标( or app logo) 和 titlesubtitle,会发现 app logo 和 titlesubtitle 的间距比较小,看起来不如 导航图标 与 它们两搭配美观;
  5. Toolbar 和其他控件一样,很多属性设置方法既支持代码设置,也支持在xml中设置(这里也是最最最最最坑爹的地方,如何坑爹法,请接着往下看);

Toolbar 踩坑填坑

坑一:xml布局文件中,Toolbar属性设置无效

刚开始使用Toolbar的时候,我的布局文件中是这样写的

<?xml version="1.0" encoding="utf-8"?>


<android.support.v7.widget.Toolbar
android:id=“@+id/toolbar”
android:layout_width=“match_parent”
android:layout_height=“wrap_content”
android:background=“@color/color_0176da”
android:logo=“@mipmap/ic_launcher”
android:navigationIcon=“@mipmap/ic_drawer_home”
android:subtitle=“456”
android:title=“123”>


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

在真机跑起来之后,看到的结果是下面这样的。

此时心中真是万千匹草泥马在奔腾,除了设置背景色和TextView有效外,说好的 logonavigationIconsubtitletitle 都跑哪去了?在编译器没报错又不见效果的情况下,参考了其他开发者的用法后找到了以下的解决方案,就是在根布局中加入自定义属性的命名空间

xmlns:toolbar=“http://schemas.android.com/apk/res-auto”(这里的toolbar可以换成你想要其他命名,做过自定义控件的童鞋相比很熟悉此用法了)

然后把所有用 android:xxx 设置无效的,都用 toolbar:xxx 设置即可生效。最终的布局代码如下:

<?xml version="1.0" encoding="utf-8"?>


<android.support.v7.widget.Toolbar
android:id=“@+id/toolbar”
android:layout_width=“match_parent”
android:layout_height=“wrap_content”
android:background=“@color/color_0176da”
toolbar:navigationIcon=“@mipmap/ic_drawer_home”
toolbar:logo=“@mipmap/ic_launcher”
toolbar:subtitle=“456”
toolbar:title=“123”>


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

到此即可解决 xml 中属性设置失效的问题,为什么会出现这种问题呢?我猜测是因为这个控件是兼容版的控件,用 android:xxx 设置无效是的这些属性是在兼容包中,不在默认的Android SDK中,所以我们需要额外的引入。至于为什么IDE不报错,估计就是bug了吧!

坑二:Action Menu Item 的文字颜色设置无效

系统默设置了ActionMenu每个Item的文字颜色和大小,像ToolbarActivity在Google原生5.1系统下默认效果就是下面这样的

此时,如果我有需求要改变一下item文字颜色,应该怎么破?我按照网上比较普遍的解决方案,做了如下两步的修改操作:

  • 在styles.xml中自定义一个Theme,并设置 actionMenuTextColor 属性(注意:不是 android:actionMenuTextColor )
  • 在布局文件的Toolbar中设置popupTheme(注意:是toolbar:xxx,不是android:xxx)
    <android.support.v7.widget.Toolbar android:id=“@+id/toolbar” android:layout_width=“match_parent” android:layout_height=“wrap_content” android:background=“@color/color_0176da” toolbar:popupTheme=“@style/Theme.ToolBar.Base”>   
    </android.support.v7.widget.Toolbar>

运行之后,文字的颜色的并没有发生任何改变。说好的改变颜色呢……找来找去,最后再 StackOverflow 找到一个还不错的解决方案,就是把上面的的 actionMenuTextColor 属性换成 android:textColorPrimary 即可解决,最终得到下面的运行效果。

这种方法也有一个小缺点,如果我把自定义控件换成Button,你会发现Button默认的文字颜色也变成了红色。所以,此处如果有朋友有更好的解决方案,请留言赐教。
如果你想要修改 ActionMenu Item 的文字大小,也可以在theme中设置加上如下设置

20sp

以上就是目前使用 Toolbar 一些比较折腾的坑,感觉 Google 对 Toolbar 这些坑,还可以进一步优化优化,不然就坑苦了开发者们了。

仿知乎主页面

为了加深一下 Toolbar 的开发体验,我们使用 Toolbar 来实现知乎主页的效果!先来看下知乎主页的效果

如果前面的内容你看明白,想撸出这个界面无非是几分钟的事情,下面就直接上代码,不做赘述了。
ZhiHuActivity界面代码

public class ZhiHuActivity extends BaseActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_zhi_hu);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.inflateMenu(R.menu.zhihu_toolbar_menu);
toolbar.setNavigationIcon(R.mipmap.ic_drawer_home);
toolbar.setTitle(R.string.home_page);
toolbar.setTitleTextColor(getResources().getColor(android.R.color.white));
}
}

zhihu_toolbar_menu.xml 菜单

<?xml version="1.0" encoding="utf-8"?>

activity_zhi_hu.xml 布局

<?xml version="1.0" encoding="utf-8"?>


<android.support.v7.widget.Toolbar
android:id=“@+id/toolbar”
android:layout_width=“match_parent”
android:layout_height=“wrap_content”
android:background=“@color/color_0176da”
android:theme=“@style/Theme.ToolBar.ZhiHu”>
</android.support.v7.widget.Toolbar>



styles.xml 中的 Theme.ToolBar.ZhiHu,给 Toolbar 设置android:theme用的

... # 最后

自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。

深知大多数初中级Android工程师,想要提升技能,往往是自己摸索成长,自己不成体系的自学效果低效漫长且无助

因此我收集整理了一份《2024年Android移动开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。

既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门

如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!

由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门**

如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!

由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!

  • 4
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值