ToolBar自定义图标，关联DrawerLayout

2024-02-02 20:38
文章标签 自定义 关联 图标 toolbar drawerlayout

本文主要是介绍ToolBar自定义图标，关联DrawerLayout，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

Android5.0出现了一个可以代替ActionBar的控件ToolBar，使用更加灵活，一般我们使用ToolBar来和DrawerLayout配合使用，官方提供了一个开关类ActionBarDrawerToggle，来实现ToolBar和DrawerLayout的关联,但是 有时根据我们的需求需要更改左侧的图标，不在需要系统默认的三条杠的图标同时点击图标还想要DrawerLayout的侧拉页面出来，下面讲解两种不同的方式
一：通过代码来实现改变ToolBar的图标

public class TempActivity extends AppCompatActivity {ActionBarDrawerToggle toggle;private DrawerLayout mDrawerLayout;@Overrideprotected 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, 0, 0);getSupportActionBar().setDisplayHomeAsUpEnabled(true);//设置点击事件，点击弹出menu界面mDrawerLayout.setDrawerListener(toggle);}//覆写方法让系统判断点击的图标后是否弹出侧拉页面@Overridepublic 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.Toolbarapp: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;@Overrideprotected 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, 0, 0);}//覆写方法让系统判断点击的图标后是否弹出侧拉页面@Overridepublic 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.Toolbarandroid:id="@+id/tool_bar"android:layout_width="match_parent"android:layout_height="50dp"   android:background="@android:color/holo_green_light"><ImageViewandroid: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;@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.text_tool_bar);initToolBar();}private void initToolBar() {//找到图标的idImageView  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() {@Overridepublic 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图标的需求，根据具体需求选择最方便的一种

这篇关于ToolBar自定义图标，关联DrawerLayout的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/671888。

相关文章

捷瑞数字业绩波动性明显：关联交易不低，募资必要性遭质疑

捷瑞数字业绩波动性明显：关联交易不低，募资必要性遭质疑

《港湾商业观察》施子夫 5月22日，山东捷瑞数字科技股份有限公司（以下简称，捷瑞数字）及保荐机构国新证券披露第三轮问询的回复，继续推进北交所上市进程。 从2023年6月递表开始，监管层已下发三轮审核问询函，关注到捷瑞数字存在同业竞争、关联交易、募资合理性、期后业绩波动等焦点问题。公司的上市之路多少被阴影笼罩。​ 业绩波动遭问询 捷瑞数字成立于2000年，公司是一家以数字孪生驱动的工
阅读更多...
ROS话题通信流程自定义数据格式

ROS话题通信流程自定义数据格式

ROS话题通信流程自定义数据格式 需求流程实现步骤定义msg文件编辑配置文件编译 在 ROS 通信协议中，数据载体是一个较为重要组成部分，ROS 中通过 std_msgs 封装了一些原生的数据类型,比如:String、Int32、Int64、Char、Bool、Empty… 但是，这些数据一般只包含一个 data 字段，结构的单一意味着功能上的局限性，当传输一些复杂的数据，比如:
阅读更多...
Toolbar+DrawerLayout使用详情结合网络各大神

Toolbar+DrawerLayout使用详情结合网络各大神

最近也想搞下toolbar+drawerlayout的使用。结合网络上各大神的杰作，我把大部分的内容效果都完成了遍。现在记录下各个功能效果的实现以及一些细节注意点。 这图弹出两个菜单内容都是仿QQ界面的选项。左边一个是drawerlayout的弹窗。右边是toolbar的popup弹窗。 开始实现步骤详情： 1.创建toolbar布局跟drawerlayout布局 <?xml vers
阅读更多...
添加自定义的CALayer

添加自定义的CALayer

iOS开发UI篇—CAlayer(创建图层) 一、添加一个图层 添加图层的步骤： 1.创建layer 2.设置layer的属性（设置了颜色，bounds才能显示出来） 3.将layer添加到界面上（控制器view的layer上）  1 // 2 // YYViewController.m 3 // 01-创建一个简单的图层 4 // 5 //
阅读更多...
android自定义View的和FramgentActivity的一个小坑

android自定义View的和FramgentActivity的一个小坑

对于自定义View //加载样式TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.TitleBarView, defStyleAttr, 0);setTitle(typedArray.getString(R.styleable.TitleBarView_main_title));//不能写成
阅读更多...
第三十七章 添加和使用自定义标题元素 - 自定义标头的继承

第三十七章 添加和使用自定义标题元素 - 自定义标头的继承

文章目录 第三十七章 添加和使用自定义标题元素 - 自定义标头的继承自定义标头的继承示例 在 `SOAPHEADERS` 参数中指定支持的标头元素自定义标头的继承 第三十七章 添加和使用自定义标题元素 - 自定义标头的继承 自定义标头的继承 如果创建此Web 服务的子类，该子类将继承不特定于方法的标头信息 — 包含在 <request> 或 <response> 元素中的标头信
阅读更多...
【Linux文件系统】被打开的文件与文件系统的文件之间的关联刨析总结

【Linux文件系统】被打开的文件与文件系统的文件之间的关联刨析总结

操作系统管理物理内存以及与外设磁盘硬件进行数据的交换 操作系统如何管理物理内存呢？ 其实操作系统内核先对内存先描述再组织的！操作系统管理内存的基本单位是4KB，操作系统会为每一个4KB大小的物理内存块创建一个描述该4KB内存块的struct page结构体，该结构体存储着这4KB内存块的属性信息，通过管理struct page来对内存进行管理，page结构体的大小比较小，OS通常将它们组成一个
阅读更多...
把Sublime Text 2 加入右键菜单（带图标）, Edit with Sublime Text

把Sublime Text 2 加入右键菜单（带图标）, Edit with Sublime Text

Sublime Text 2 是现在很受大家欢迎的编辑器了，不仅是在web前端，在书定简单的php、Js等代码时，也是相当的好用，再配合多种的插件和新颖的界面，更是让人欲罢不能。 在使用时，我们通过喜欢打开一个文件的时候，右击再选择打开程序，比如会用记事本、Notedpad++之类的，这时如果把Sublime Text也加入到其中毕竟会方便不少，在找了一番后，实验成功，效果如下： 实现
阅读更多...
自定义recyclerView实现时光轴效果

自定义recyclerView实现时光轴效果

时光轴效果在很多app上都有出现，例如淘宝中快递的跟踪，本文将使用recyclerView实现时光轴效果，我们会到自定义控件，首先先看一下效果图： 接下来是步骤分析 1自定义属性 这个大家应该都了解了，根据我们之前的分析，直接在attrs.xml中进行声明 <declare-styleable name="TimeLine"><attr name="beginLine" f
阅读更多...
Android自定义系列——9.Path详细用法

Android自定义系列——9.Path详细用法

rXxx方法 rXxx方法的坐标使用的是相对位置(基于当前点的位移)，而之前方法的坐标是绝对位置(基于当前坐标系的坐标)。 Path path = new Path();path.moveTo(100,100);path.lineTo(100,200);canvas.drawPath(path,mDeafultPaint); 在这个例子中，先移动点到坐标(100，100)处，之后再连接
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2