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

2024-06-24 13:18

本文主要是介绍Toolbar+DrawerLayout使用详情结合网络各大神,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

最近也想搞下toolbar+drawerlayout的使用。结合网络上各大神的杰作,我把大部分的内容效果都完成了遍。现在记录下各个功能效果的实现以及一些细节注意点。
这里写图片描述
这图弹出两个菜单内容都是仿QQ界面的选项。左边一个是drawerlayout的弹窗。右边是toolbar的popup弹窗。
开始实现步骤详情:
1.创建toolbar布局跟drawerlayout布局

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/custom_toolbar"android:background="@color/colorPrimary"android:minHeight="50dp"android:layout_width="match_parent"android:layout_height="wrap_content"></android.support.v7.widget.Toolbar>

drawerlayout的主页面我是用FrameLayout

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/custom_drawerlayout"android:layout_width="match_parent"android:layout_height="match_parent"><!-- main layout --><FrameLayout
       android:id="@+id/lv_fragment"android:layout_width="match_parent"android:layout_height="match_parent"></FrameLayout><!-- slide menu --><LinearLayout
        android:layout_width="match_parent"android:layout_height="match_parent"android:background="#00ffff"android:layout_gravity="start"><ListView
            android:id="@+id/lv_left_menu"android:divider="@null"android:layout_width="match_parent"android:layout_height="match_parent"></ListView></LinearLayout>

2.通过findViewById找到各个控件,设置toolbar的标题以及样式

toolbar.setTitle("QQ订制中心");toolbar.setTitleTextColor(Color.parseColor("#ffffff"));

3.替换actionbar为toolbar,设置切换键可用

//把actionbar替换成toolbarsetSupportActionBar(toolbar);//设置返回键可用getSupportActionBar().setHomeButtonEnabled(true);getSupportActionBar().setDisplayHomeAsUpEnabled(true);

4.实现开关事件,绑定toolbar跟drawerlayout。

        mDrawerToggle = new ActionBarDrawerToggle(this,mDrawerLayout,toolbar,R.string.open,R.string.close){@Overridepublic void onDrawerClosed(View drawerView) {super.onDrawerClosed(drawerView);}@Overridepublic void onDrawerOpened(View drawerView) {super.onDrawerOpened(drawerView);}};

5.设置菜单切换同步

 mDrawerToggle.syncState();mDrawerLayout.addDrawerListener(mDrawerToggle);

自此切换侧滑菜单功能已实现。下面实现侧滑菜单里面的内容部分。
6.新建一个ListView布局使用simpleAdapter适配绑定图片与文字,布局就是线性布局横向一个ImageView一个TextView。

 //设置侧滑菜单列表simpleAdapter = new SimpleAdapter(this,getData(),R.layout.listview_item,new String[]{"img","name"},new int[]{R.id.list_iv,R.id.list_tv});
 /*** 获取数据*  private String[] lvs ={"我的QQ会员","QQ钱包","个性装扮","我的收藏","我的相册","我的文件","我的名片夹"};*  private int[] ivm ={R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,};*/private List<Map<String, Object>> getData(){List<Map<String, Object>> list = new ArrayList<>();for (int i=0;i<lvs.length;i++){Map<String, Object> map = new HashMap<>();map.put("img",ivm[i]);map.put("name",lvs[i]);list.add(map);}return list;}

7.实现setOnItemClickListener 事件。
<——————–下面是toolbar右边的内容——————–>
8.创建菜单文件并重写onCreateOptionsMenu方法
这里写图片描述
其中要注意的地方已经标出来了。always是显示出来的,never是在更多里的popup菜单项。

 /*** 将menu利用重载函数OnCreateOptionsMenu(Menu menu)函数来将自定义的menu* @param menu* @return*/@Overridepublic boolean onCreateOptionsMenu(Menu menu) {getMenuInflater().inflate(R.menu.toolbar_right_menu,menu);return super.onCreateOptionsMenu(menu);}

9.给popup菜单项显示出图标,重写onPrepareOptionsPanel方法

/*** 设置toolbar的popup窗口列表图标*/@Overrideprotected boolean onPrepareOptionsPanel(View view, Menu menu) {if(menu!=null){if(menu.getClass()==MenuBuilder.class){try {Method m = menu.getClass().getDeclaredMethod("setOptionalIconsVisible",Boolean.TYPE);m.setAccessible(true);m.invoke(menu,true);} catch (Exception e) {e.printStackTrace();}}}return super.onPrepareOptionsPanel(view, menu);}

10.把popup菜单弹出的位置置于toolbar的下方。
在代码中设置为

 //设置右上弹框的样式toolbar.setPopupTheme(R.style.ToolbarPopupTheme);

而在style.xml文件中

 <!-- toolbar弹出菜单样式 --><style name="ToolbarPopupTheme" parent="@style/ThemeOverlay.AppCompat.Light"><!--<item name="android:colorBackground">#ffffff</item>--><item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item> <!--新增一个item,用于控制menu--></style><style name="OverflowMenuStyle" parent="Widget.AppCompat.Light.PopupMenu.Overflow"><item name="overlapAnchor">false</item>  <!--把该属性改为false即可使menu位置位于toolbar之下--></style>

11.实现toolbar右边按钮的点击事件:实现setOnMenuItemClickListener监听事件。例如

 toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {@Overridepublic boolean onMenuItemClick(MenuItem item) {switch (item.getItemId()){case R.id.menu_search:Toast.makeText(MainActivity.this,"这是查找按钮",Toast.LENGTH_SHORT).show();break;

自此功能已完成。
最后我把MainAcitivity的所有代码都贴出来以便看得更清楚。

package com.example.toolbaranddrawerlayout;import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.view.menu.MenuBuilder;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.FrameLayout;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.Toast;import java.lang.reflect.Method;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;import layout.CollectFragment;
import layout.FileFragment;
import layout.HolderFragment;
import layout.MoneyFragment;
import layout.PersonalityFragment;
import layout.PhotoFragment;
import layout.VipFragment;public class MainActivity extends AppCompatActivity {private Toolbar toolbar;private DrawerLayout mDrawerLayout;private ActionBarDrawerToggle mDrawerToggle;private ListView lvLeftMenu;private String[] lvs ={"我的QQ会员","QQ钱包","个性装扮","我的收藏","我的相册","我的文件","我的名片夹"};private int[] ivm ={R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,};
//    private ArrayAdapter arrayAdapter;private SimpleAdapter simpleAdapter;private Fragment myVip,QQmoney,personality,myCollect,myPhoto,myFile,myHolder;private FrameLayout fl;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);findView();toolbar.setTitle("QQ订制中心");toolbar.setTitleTextColor(Color.parseColor("#ffffff"));//设置右上弹框的样式toolbar.setPopupTheme(R.style.ToolbarPopupTheme);
//        toolbar.inflateMenu(R.menu.toolbar_right_menu);//把actionbar替换成toolbarsetSupportActionBar(toolbar);//设置返回键可用getSupportActionBar().setHomeButtonEnabled(true);getSupportActionBar().setDisplayHomeAsUpEnabled(true);
//        toolbar.setNavigationIcon(R.mipmap.pic);//设置toolbar监听事件,这个一定要放在setSupportActionBar方法后面才有效toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {@Overridepublic boolean onMenuItemClick(MenuItem item) {switch (item.getItemId()){case R.id.menu_search:Toast.makeText(MainActivity.this,"这是查找按钮",Toast.LENGTH_SHORT).show();break;case R.id.menu_share:Toast.makeText(MainActivity.this,"这是链接按钮",Toast.LENGTH_SHORT).show();break;case R.id.menu_more:Toast.makeText(MainActivity.this,"启动多人聊天",Toast.LENGTH_SHORT).show();break;case R.id.menu_addFriend:Toast.makeText(MainActivity.this,"添加好友",Toast.LENGTH_SHORT).show();break;case R.id.menu_scan:Toast.makeText(MainActivity.this,"扫一扫",Toast.LENGTH_SHORT).show();break;case R.id.menu_faceToFace:Toast.makeText(MainActivity.this,"面对面快传",Toast.LENGTH_SHORT).show();break;case R.id.menu_pay:Toast.makeText(MainActivity.this,"付款",Toast.LENGTH_SHORT).show();break;}return true;}});//创建返回键,并实现开关监听mDrawerToggle = new ActionBarDrawerToggle(this,mDrawerLayout,toolbar,R.string.open,R.string.close){@Overridepublic void onDrawerClosed(View drawerView) {super.onDrawerClosed(drawerView);}@Overridepublic void onDrawerOpened(View drawerView) {super.onDrawerOpened(drawerView);}};mDrawerToggle.syncState();mDrawerLayout.addDrawerListener(mDrawerToggle);//设置侧滑菜单列表simpleAdapter = new SimpleAdapter(this,getData(),R.layout.listview_item,new String[]{"img","name"},new int[]{R.id.list_iv,R.id.list_tv});lvLeftMenu.setAdapter(simpleAdapter);lvLeftMenu.setOnItemClickListener(new AdapterView.OnItemClickListener() {@Overridepublic void onItemClick(AdapterView<?> parent, View view, int position, long id) {switch (position){case 0:if(myVip==null){myVip = new VipFragment();}getSupportFragmentManager().beginTransaction().replace(R.id.lv_fragment,myVip).commit();mDrawerLayout.closeDrawers();break;case 1:if(QQmoney==null){QQmoney = new MoneyFragment();}getSupportFragmentManager().beginTransaction().replace(R.id.lv_fragment,QQmoney).commit();mDrawerLayout.closeDrawers();break;case 2:if(personality==null){personality = new PersonalityFragment();}getSupportFragmentManager().beginTransaction().replace(R.id.lv_fragment,personality).commit();mDrawerLayout.closeDrawers();break;case 3:if(myCollect==null){myCollect = new CollectFragment();}getSupportFragmentManager().beginTransaction().replace(R.id.lv_fragment,myCollect).commit();mDrawerLayout.closeDrawers();break;case 4:if(myPhoto==null){myPhoto = new PhotoFragment();}getSupportFragmentManager().beginTransaction().replace(R.id.lv_fragment,myPhoto).commit();mDrawerLayout.closeDrawers();break;case 5:if(myFile==null){myFile = new FileFragment();}getSupportFragmentManager().beginTransaction().replace(R.id.lv_fragment,myFile).commit();mDrawerLayout.closeDrawers();break;case 6:if(myHolder==null){myHolder = new HolderFragment();}getSupportFragmentManager().beginTransaction().replace(R.id.lv_fragment,myHolder).commit();mDrawerLayout.closeDrawers();break;}}});}/*** 获取数据*  private String[] lvs ={"我的QQ会员","QQ钱包","个性装扮","我的收藏","我的相册","我的文件","我的名片夹"};*  private int[] ivm ={R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,R.mipmap.pic,};*/private List<Map<String, Object>> getData(){List<Map<String, Object>> list = new ArrayList<>();for (int i=0;i<lvs.length;i++){Map<String, Object> map = new HashMap<>();map.put("img",ivm[i]);map.put("name",lvs[i]);list.add(map);}return list;}private void findView() {fl = (FrameLayout) findViewById(R.id.lv_fragment);toolbar = (Toolbar) findViewById(R.id.custom_toolbar);mDrawerLayout = (DrawerLayout) findViewById(R.id.custom_drawerlayout);lvLeftMenu = (ListView) findViewById(R.id.lv_left_menu);}/*** 将menu利用重载函数OnCreateOptionsMenu(Menu menu)函数来将自定义的menu* @param menu* @return*/@Overridepublic boolean onCreateOptionsMenu(Menu menu) {getMenuInflater().inflate(R.menu.toolbar_right_menu,menu);return super.onCreateOptionsMenu(menu);}/*** 设置toolbar的popup窗口列表图标*/@Overrideprotected boolean onPrepareOptionsPanel(View view, Menu menu) {if(menu!=null){if(menu.getClass()==MenuBuilder.class){try {Method m = menu.getClass().getDeclaredMethod("setOptionalIconsVisible",Boolean.TYPE);m.setAccessible(true);m.invoke(menu,true);} catch (Exception e) {e.printStackTrace();}}}return super.onPrepareOptionsPanel(view, menu);}
}

这篇关于Toolbar+DrawerLayout使用详情结合网络各大神的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1090254

相关文章

中文分词jieba库的使用与实景应用(一)

知识星球:https://articles.zsxq.com/id_fxvgc803qmr2.html 目录 一.定义: 精确模式(默认模式): 全模式: 搜索引擎模式: paddle 模式(基于深度学习的分词模式): 二 自定义词典 三.文本解析   调整词出现的频率 四. 关键词提取 A. 基于TF-IDF算法的关键词提取 B. 基于TextRank算法的关键词提取

使用SecondaryNameNode恢复NameNode的数据

1)需求: NameNode进程挂了并且存储的数据也丢失了,如何恢复NameNode 此种方式恢复的数据可能存在小部分数据的丢失。 2)故障模拟 (1)kill -9 NameNode进程 [lytfly@hadoop102 current]$ kill -9 19886 (2)删除NameNode存储的数据(/opt/module/hadoop-3.1.4/data/tmp/dfs/na

Hadoop数据压缩使用介绍

一、压缩原则 (1)运算密集型的Job,少用压缩 (2)IO密集型的Job,多用压缩 二、压缩算法比较 三、压缩位置选择 四、压缩参数配置 1)为了支持多种压缩/解压缩算法,Hadoop引入了编码/解码器 2)要在Hadoop中启用压缩,可以配置如下参数

Makefile简明使用教程

文章目录 规则makefile文件的基本语法:加在命令前的特殊符号:.PHONY伪目标: Makefilev1 直观写法v2 加上中间过程v3 伪目标v4 变量 make 选项-f-n-C Make 是一种流行的构建工具,常用于将源代码转换成可执行文件或者其他形式的输出文件(如库文件、文档等)。Make 可以自动化地执行编译、链接等一系列操作。 规则 makefile文件

使用opencv优化图片(画面变清晰)

文章目录 需求影响照片清晰度的因素 实现降噪测试代码 锐化空间锐化Unsharp Masking频率域锐化对比测试 对比度增强常用算法对比测试 需求 对图像进行优化,使其看起来更清晰,同时保持尺寸不变,通常涉及到图像处理技术如锐化、降噪、对比度增强等 影响照片清晰度的因素 影响照片清晰度的因素有很多,主要可以从以下几个方面来分析 1. 拍摄设备 相机传感器:相机传

Linux 网络编程 --- 应用层

一、自定义协议和序列化反序列化 代码: 序列化反序列化实现网络版本计算器 二、HTTP协议 1、谈两个简单的预备知识 https://www.baidu.com/ --- 域名 --- 域名解析 --- IP地址 http的端口号为80端口,https的端口号为443 url为统一资源定位符。CSDNhttps://mp.csdn.net/mp_blog/creation/editor

pdfmake生成pdf的使用

实际项目中有时会有根据填写的表单数据或者其他格式的数据,将数据自动填充到pdf文件中根据固定模板生成pdf文件的需求 文章目录 利用pdfmake生成pdf文件1.下载安装pdfmake第三方包2.封装生成pdf文件的共用配置3.生成pdf文件的文件模板内容4.调用方法生成pdf 利用pdfmake生成pdf文件 1.下载安装pdfmake第三方包 npm i pdfma

零基础学习Redis(10) -- zset类型命令使用

zset是有序集合,内部除了存储元素外,还会存储一个score,存储在zset中的元素会按照score的大小升序排列,不同元素的score可以重复,score相同的元素会按照元素的字典序排列。 1. zset常用命令 1.1 zadd  zadd key [NX | XX] [GT | LT]   [CH] [INCR] score member [score member ...]

git使用的说明总结

Git使用说明 下载安装(下载地址) macOS: Git - Downloading macOS Windows: Git - Downloading Windows Linux/Unix: Git (git-scm.com) 创建新仓库 本地创建新仓库:创建新文件夹,进入文件夹目录,执行指令 git init ,用以创建新的git 克隆仓库 执行指令用以创建一个本地仓库的

ASIO网络调试助手之一:简介

多年前,写过几篇《Boost.Asio C++网络编程》的学习文章,一直没机会实践。最近项目中用到了Asio,于是抽空写了个网络调试助手。 开发环境: Win10 Qt5.12.6 + Asio(standalone) + spdlog 支持协议: UDP + TCP Client + TCP Server 独立的Asio(http://www.think-async.com)只包含了头文件,不依