Android ToolBar自定义图标,关联DrawerLayout
Android5.0出现了一个可以代替ActionBar的控件ToolBar,使用更加灵活,一般我们使用ToolBar来和DrawerLayout配合使用,官方提供了一个开关类ActionBarDrawerToggle,来实现ToolBar和DrawerLayout的关联,但是 有时根据我们的需求需要更改左侧的图标,不在需要系统默认的三条杠的图标同时点击图标还想要DrawerLayout的侧拉页面出来,下面讲解两种不同的方式
一:通过代码来实现改变ToolBar的图标
public class TempActivity extends AppCompatActivity {
ActionBarDrawerToggle toggle;
private DrawerLayout mDrawerLayout;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.text_tool_bar);
initToolBar();
}
private void initToolBar() {
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
//设置图标
toolbar.setNavigationIcon(R.drawable.ic_launcher);
// 标题
toolbar.setTitle("Title");
//把ToolBar的设置的ActionBar的位置
setSupportActionBar(toolbar);
//获取开关同时让开关和DrawerLayout关联在一起
toggle = new ActionBarDrawerToggle(this, mDrawerLayout, , );
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
//设置点击事件,点击弹出menu界面
mDrawerLayout.setDrawerListener(toggle);
}
//覆写方法让系统判断点击的图标后是否弹出侧拉页面
@Override
public boolean onOptionsItemSelected(MenuItem item) {
toggle.onOptionsItemSelected(item);
return super.onOptionsItemSelected(item);
}
}
这样就把左侧的图标设置成了我们需要的图标,同时点击图标也可以弹出DrawerLayout的侧拉页面,但是注意:在以上的代码中少了一行代码toggle.syncState();作用是将左侧小图标和侧拉页面的状态同步,只有当去掉这一行代码的时候,这个方法自定义的图标才会显示
弊端:1.使用代码来放置图标没有XML灵活,
2.这种方式不能给图标是指背景选择器
二:通过XML来实现自定义图标(好处是,可以灵活的放置控件在ToolBar的位置)
使用XML来自定义图标也有两种方式
方式1:在ToolBar的根节点设置属性
<android.support.v7.widget.Toolbar
app:navigationIcon="@drawable/ic_add_follow"
android:id="@+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@android:color/holo_green_light">
</android.support.v7.widget.Toolbar>
以上的布局中添加了app:navigationIcon=”@drawable/ic_add_follow” 这一行代码,用来展示图标,注意命名空间不一样
同样在代码中和DrawerLayout关联覆写onOptionsItemSelected方法即可完成和侧拉页面的关联
public class TextActivity extends AppCompatActivity {
private ActionBarDrawerToggle toggle;
private ImageView toolBarIcon;
private DrawerLayout mDrawerLayout;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.text_tool_bar);
initToolBar();
}
private void initToolBar() {
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
//不显示标题
toolbar.setTitle("");
setSupportActionBar(toolbar);
//把开关和DrawerLayout关联
toggle = new ActionBarDrawerToggle(this, mDrawerLayout, , );
}
//覆写方法让系统判断点击的图标后是否弹出侧拉页面
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
case android.R.id.home:
toggle.onOptionsItemSelected(item);
}
return super.onOptionsItemSelected(item);
}
弊端:一:这种方式虽然可以在布局文件中来设置图标,但是无法给图标设置选择器
二:由于是在ToolBar的根节点来设置图片,所以不能只当图片摆放的位置
优点:直接在XML中指定图片,而且一行代码搞定
方式2:通过查看ToolBar发现它继承了ViewGroup,所以我们可以在ToolBar的里面来设置子控件来自定义图标
布局:
<android.support.v7.widget.Toolbar
android:id="@+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@android:color/holo_green_light">
<ImageView
android:layout_gravity="left"
android:id="@+id/tool_bar_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher"
android:background="@drawable/selector_infodetail_back_bg"/>
</android.support.v7.widget.Toolbar>
我们可以设置ImageView的layout_gravity的属性来指定图标的位置,同时可以给ImageView来设置背景选择器
代码逻辑:
public class TextActivity extends AppCompatActivity {
private ActionBarDrawerToggle toggle;
private DrawerLayout mDrawerLayout;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.text_tool_bar);
initToolBar();
}
private void initToolBar() {
//找到图标的id
ImageView toolBarIcon = (ImageView) findViewById(R.id.tool_bar_icon);
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
toolbar.setTitle("");
setSupportActionBar(toolbar);
//设置监听
toolBarIcon.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
toggle();
}
});
}
}
private void toggle() {
int drawerLockMode = mDrawerLayout.getDrawerLockMode(GravityCompat.START);
if (mDrawerLayout.isDrawerVisible(GravityCompat.START)
&& (drawerLockMode != DrawerLayout.LOCK_MODE_LOCKED_OPEN)) {
mDrawerLayout.closeDrawer(GravityCompat.START);
} else if (drawerLockMode != DrawerLayout.LOCK_MODE_LOCKED_CLOSED) {
mDrawerLayout.openDrawer(GravityCompat.START);
}
}
通过这种方式设置的图标就不能通过覆写onOptionsItemSelected方法的方式来实现侧拉页面的打开和关闭了,因为图标的id已经不是android.R.id.home,所以只能写监听事件来完成侧拉页面的打开和关闭。
通过查看onOptionsItemSelected的源码发现系统内部实现方式最终调用的是toggle方法,但是这个方法是私有的我们不能通过对象调用到,发现这个方法中只用到了DrawerLayout的对象,所以就直接将这个方法拷贝到自己的类中来使用,完成了这个效果
弊端:XML中代码比较多
优点:可以给图标设置状态选择器,图标的摆放位置比较灵活,还可以放其他的控件
以上几种方式都可以实现更改ToolBar图标的需求,根据具体需求选择最方便的一种
Android ToolBar自定义图标,关联DrawerLayout的更多相关文章
- Delphi 7使用自定义图标关联文件类型
Delphi 7使用自定义图标关联文件类型 5.2 Delphi编程(40) 版权声明:本文为博主原创文章,未经博主允许不得转载. 在开发过程中,我们经常需要属于自己的文件类型,自定义的后缀名不仅可 ...
- android ToolBar与DrawerLayout笔记
通过Android Studio 生成的Nagvition DrawerLayout Activity 自带的布局中的NagvitionView会覆盖ToolBar直接通到statusBar. 但是自 ...
- Android定位&地图&导航——基于百度地图,实现自定义图标绘制并点击时弹出泡泡
一.问题描述 上一次我们使用百度地图实现基本的定位功能,接下来我们继续实现搜索和定位,并使用LocationOverlay绘制定位位置,同时展示如何使用自定义图标绘制并点击时弹出泡泡 如图所示: 二. ...
- Android实例-自定义程序名称、图标、全屏和可旋转方向(XE8+小米2)
1.自定义程序名称Project->Options->Version Info->label(改成需要显示的中文名即可) ,但是需要安装到安卓手机才可以显示. 2.全屏显示Proje ...
- Android开发app如何设定应用图标下的应用名称为汉字以及自定义图标
一.应用名称为汉字 二.自定义图标
- [置顶]
xamarin android toolbar(踩坑完全入门详解)
网上关于toolbar的教程有很多,很多新手,在使用toolbar的时候踩坑实在太多了,不好好总结一下,实在浪费.如果你想学习toolbar,你肯定会去去搜索androd toolbar,既然你能看到 ...
- <Android 基础(七)> DrawerLayout and NavigationView
介绍 DrawerLayout是Support Library包中实现了侧滑菜单效果的控件 android.support.v4.widget.DrawerLayout NavigationView是 ...
- Assign a Custom Image 设置自定义图标
In this lesson, you will learn how to associate a business class with a custom image. This image wil ...
- Android实现自定义带文字和图片的Button
Android实现自定义带文字和图片的Button 在Android开发中经常会需要用到带文字和图片的button,下面来讲解一下常用的实现办法. 一.用系统自带的Button实现 最简单的一种办法就 ...
随机推荐
- linux配置 yum 源
使用 yum 命令安装软件包需要一个yum仓库(即yum源),yum通过客户端(yum命令本身即是yum客户端)去连接yum源服务器,CentOS默认yum源为官方的 http://mirrorlis ...
- revit二次开发之族的类型参数与实例参数的转换
1背景小伙伴在做revit二次开发的时候,可能需要在族环境中将族的类型参数与实例参数相互转换. 2思路1.使用族管理器FamilyManager,参见注释12.首先获取需要转换的参数(单个与批量),参 ...
- vue 中获取到数据点击失效
// var data = Object.assign([],ret.t); //动态创建dom后点击 元素不添加背景色 Object.assign(复制下)
- 七夕心形demo
from turtle import * pensize(1) pencolor('red') fillcolor('pink') speed(5) up() goto(-30, 100) down( ...
- id和class命名规范
- Spring Boot-整合Mybatis(五)
原始的整合方式 1.添加依赖 <!--mybatis起步依赖--> <dependency> <groupId>org.mybatis.spring.boot< ...
- HDU 4527
搞了好久,发现自己是想法没错的,错在输入,必须是while(){} #include <iostream> #include <cstdio> #include <alg ...
- UVa Problem 10051
这题有点类似LIS,由于颜色最多100种,所以只需建立一个100的数组,按对立面的关系以某种颜色为向上面的最大值就可以了. #include <iostream> #include & ...
- Coco2d-js/Cocos2d-html5中Android返回键实现
导语: 首先Cocos2d-x其中实现Menu和Back按键相对简单一点,而在资源较少的Cocos2d-html5其中.要实现返回还是有一点不一样的,并且有没有详细的demo.也就仅仅有自己去看api ...
- Dozer--第三方复制工具,哎哟,还不错!
Dozer简单点说,就是拷贝工具,也是复制工具的意思,官方的解释是:Dozer is a Java Bean to Java Bean mapper that recursively copies d ...