ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Android Toolbar配合menu使用详解

2021-03-05 19:59:38  阅读:209  来源: 互联网

标签:Toast 菜单 show menu item Android Toolbar


Android Toolbar配合menu使用详解

历史上的今天(2021.3.5):
1898年3月5日,周恩来生于江苏淮安,早年留学日本。1919年在天津参加“五·四”运动。(1976年1月8日周恩来逝世。)

Toolbar使用

注意:需要更改为Theme.AppCompat.Light.NoActionBar


布局使用:

<androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?android:attr/actionBarSize"
            android:background="@color/grey"
            app:navigationIcon="@mipmap/ic_launcher"
            app:subtitle="子标题"
            app:subtitleTextColor="@color/red"
            app:title="主标题"
            app:titleMarginStart="30dp"
            app:titleTextColor="@color/red" />
Toolbar参数类型说明
backgroundcolor/drawable背景色
theme@stylemenu的一些常见操作
(字体大小颜色等)
layout_scrollFlags配合AppBarLayout使用
下边单独讲该属性
navigationIconmipmap/drawable左侧返回按钮
titleString主标题
subTitleString子标题
titleMarginStartdp主标题距离左侧按钮距离
titleTextColorcolor字体颜色
minHeightdpToolbar最小高度

效果图(1.1):
在这里插入图片描述

修改为返回按钮,并且为白色:

//配合menu使用,不添加menu不显示
        setSupportActionBar(toolbar);

        //以下三行是修改回退按钮为白色的逻辑
        Drawable upArrow = ContextCompat.getDrawable(this, R.drawable.abc_ic_ab_back_material);
        upArrow.setColorFilter(getResources().getColor(R.color.white), PorterDuff.Mode.SRC_ATOP);
        getSupportActionBar().setHomeAsUpIndicator(upArrow);

        toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this, "返回", Toast.LENGTH_SHORT).show();
            }
        });

注意:在代码中更改图标时,xml布局中一定要使用app:navigationIcon=""

效果图(1.2):

Toolbar字体居中:

点击源码可知,Toolbar是ViewGroup


所以直接在他内部创建TextView居中即可
在这里插入图片描述
在内部创建了TextView会吧原本Toolbar的属性覆盖掉

layout_scrollFlags属性:

AppBarLayout依赖
implementation ‘com.google.android.material:material:1.0.0’

简单使用:

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appbarlayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        tools:ignore="MissingConstraints">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?android:attr/actionBarSize"
            android:background="@color/grey"
            android:theme="@style/ToolBarStyle"
            app:layout_scrollFlags="scroll"
            app:navigationIcon="@color/colorPrimaryDark"
            app:subtitle="子标题"
            app:subtitleTextColor="@color/red"
            app:title="主标题"
            app:titleMarginStart="30dp"
            app:titleTextColor="@color/red"
            tools:ignore="MissingConstraints">


        </androidx.appcompat.widget.Toolbar>

    </com.google.android.material.appbar.AppBarLayout>


    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rel"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

注意:
根目录为:androidx.coordinatorlayout.widget.CoordinatorLayout,这个布局可以理解为加强版的FramLayout

app:layout_scrollFlags=”scroll”app:layout_scrollFlags=”scroll|enterAlways”
app:layout_scrollFlags=“scroll|enterAlways|snap”app:layout_scrollFlags=“scroll|enterAlways|exitUntilCollapsed”

需要配合height 和 minHeight 属性使用

普通menu使用

一般在右上角(常配合toolbar出现)不可变化的menu称之为普通menu

在res目录下创建menu文件夹,创建以menu为跟标签的目录:

menu属性:

  • <menu>是菜单项的容器。<menu>元素必须是该文件的根节点,并且能够包含一个或多个<item>和<group>元素。
  • <item>是菜单项,用于定义MenuItem,可以嵌套<menu>元素,以便创建子菜单。
  • <group>是<item>元素的不可见容器(可选)。可以使用它对菜单项进行分组,使一组菜单项共享可用性和可见性等属性。

item属性:

  • android:id:菜单项(MenuItem)的唯一标识
  • android:icon:菜单项的图标(可选)
  • android:title:菜单项的标题(必选)
  • android:showAsAction:指定菜单项的显示方式。
    • ifRoom 表示在屏幕空间足够的情况下显示在Toolbar中,不够的话就显示在菜单中,如果设置该属性,长按时弹出对应的文字
    • never 表示永远不显示在Toolbar中,而是一直显示在菜单中 (默认)
    • always 表示永远显示在Toolbar中,如果屏幕空间不够则不显示

声明:Toolbar中的action按钮只会显示图标,菜单中的action按钮只会显示文字。

简单xml文件:
在这里插入图片描述
代码:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <!--
    ifRoom 表示在屏幕空间足够的情况下显示在Toolbar中,不够的话就显示在菜单中,
            如果设置该属性,长按时弹出对应的文字
    never 表示永远不显示在Toolbar中,而是一直显示在菜单中   (默认)
    always 表示永远显示在Toolbar中,如果屏幕空间不够则不显示

    声明:Toolbar中的action按钮只会显示图标,菜单中的action按钮只会显示文字。

    -->
    <item
        android:id="@+id/menu_my"
        android:icon="@mipmap/ic_launcher"
        android:title="我的"
        app:showAsAction="never" />

    <item
        android:id="@+id/menu_setting"
        android:icon="@mipmap/ic_launcher"
        android:title="设置"
        app:showAsAction="never" />

    <item
        android:id="@+id/menu_genduo"
        android:title="更多">
        <menu>
            <item
                android:id="@+id/menu_item1"
                android:title="年龄" />
            <item
                android:id="@+id/menu_item2"
                android:title="班级" />

        </menu>

    </item>
</menu>

配合Toolbar使用:

 @Override//普通菜单
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_menu, menu);
		//返回true代表普通菜单显示
        return true;
    }

点击事件监听:

  @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()) {
            case R.id.menu_my:
                Toast.makeText(this, "我的", Toast.LENGTH_SHORT).show();
                break;
                .....
        }
        return super.onOptionsItemSelected(item);
    }

效果图(1.3):


对menu简单设置:
在这里插入图片描述
代码:

<!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="actionOverflowMenuStyle">@style/ToolBarStyle</item> <!--注意添加!-->
    </style>

    <!-- ToolBar -->
    <style name="ToolBarStyle" parent="@style/ThemeOverlay.AppCompat.ActionBar">
        <!--menu按钮颜色-->
        <item name="android:textColorPrimary">#FFFFFF</item>
        <!--字体颜色-->
        <item name="android:textColor">@color/white</item>
        <!--  修改字体大小-->
        <item name="android:textSize">14sp</item>
        <!--设置menu在 ... 下方-->
        <item name="overlapAnchor">false</item>
        <!--menu背景色-->
        <item name="android:popupBackground">@color/colorPrimary</item>
    </style>

记得在布局中使用哦:

效果图(1.4):


menu按钮简单逻辑操作:

先来看效果图:
效果图(1.5):

toolbar_menu_select代码:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/menu_start"
        android:title="开始"
        app:showAsAction="ifRoom"></item>
    <item
        android:id="@+id/menu_stop"
        android:title="结束"
        app:showAsAction="ifRoom"></item>
</menu>

java逻辑代码:

 private Boolean isSelect = true;
 
    @Override//普通菜单
    public boolean onCreateOptionsMenu(Menu menu) {
        //对menu的点击操作  start
        getMenuInflater().inflate(R.menu.toolbar_menu_select, menu);
        MenuItem menu_start = menu.findItem(R.id.menu_start);
        MenuItem menu_stop = menu.findItem(R.id.menu_stop);
        if (isSelect) {
            menu_start.setEnabled(true);
            menu_stop.setEnabled(false);
        } else {
            menu_start.setEnabled(false);
            menu_stop.setEnabled(true);
        }
        //对menu的点击操作  stop
        return true;
    }

//menu点击事件监听
 @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()) {
            case R.id.menu_start:
                Toast.makeText(this, "开始", Toast.LENGTH_SHORT).show();
                isSelect = !isSelect;
                invalidateOptionsMenu(); //刷新onCreateOptionsMenu
                break;
            case R.id.menu_stop:
                isSelect = !isSelect;
                invalidateOptionsMenu();
                Toast.makeText(this, "结束", Toast.LENGTH_SHORT).show();
                break;
        }
        return super.onOptionsItemSelected(item);
    }

上下文menu使用:

常在某一个View上弹出的称之为上下文menu菜单(长按之后弹出)

这里以RecyclerView点击事件举例

方法一:

RecyclerView代码:

我这里适配器使用的是万能适配器

 private void initRecyclerView() {
        RecyclerView rel = findViewById(R.id.rel);

        rel.setLayoutManager(new LinearLayoutManager(this));

        final ArrayList<String> mlist = new ArrayList<>();
        for (int i = 0; i < 100; i++) {
            mlist.add("元素" + (i + 1));
        }

        MyAdapter adapter = new MyAdapter(R.layout.rel_item_layout, mlist);

        rel.setAdapter(adapter);

        /*
         * 单击事件
         * */
        adapter.setOnItemClickListener(new BaseQuickAdapter.OnItemClickListener() {
            @Override
            public void onItemClick(BaseQuickAdapter adapter, View view, int position) {
                Toast.makeText(MainActivity.this, mlist.get(position), Toast.LENGTH_SHORT).show();
            }
        });

        /*
         * 长按事件注册上下文菜单
         * */
        adapter.setOnItemLongClickListener(new BaseQuickAdapter.OnItemLongClickListener() {
            @Override
            public boolean onItemLongClick(BaseQuickAdapter adapter, View view, int position) {
                //注册上下文菜单
                registerForContextMenu(view);
                return false;
            }
        });
    }

这里最关键的就是在长按事件中注册Menu
registerForContextMenu(view);

上下文菜单代码:

  //上下文菜单
    @Override
    public void onCreateContextMenu(ContextMenu menu, View v, ContextMenu.ContextMenuInfo menuInfo) {
        super.onCreateContextMenu(menu, v, menuInfo);
        menu.setHeaderTitle("请选择操作:");
        menu.add("添加").setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                Toast.makeText(MainActivity.this, "添加", Toast.LENGTH_SHORT).show();
                return false;
            }
        });
        menu.add("删除");
    }

效果图(1.6):

方式二:

创建toolbar_menu_context,xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/menu_add"
        android:title="添加"
        app:showAsAction="ifRoom"></item>

    <item
        android:id="@+id/menu_remove"
        android:title="删除"
        app:showAsAction="ifRoom"></item>
</menu>

代码中使用:

  //上下文菜单
    @Override
    public void onCreateContextMenu(ContextMenu menu, View v, ContextMenu.ContextMenuInfo menuInfo) {
        super.onCreateContextMenu(menu, v, menuInfo);
        getMenuInflater().inflate(R.menu.toolbar_menu_context, menu);
    }

    //上下文菜单点击事件
    @Override
    public boolean onContextItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()) {
            case R.id.menu_add:
                Toast.makeText(this, "add", Toast.LENGTH_SHORT).show();
                break;
            case R.id.menu_remove:
                Toast.makeText(this, "remove", Toast.LENGTH_SHORT).show();
                break;
            default:
                return super.onContextItemSelected(item);
        }
        return true;
    }

效果和方式一是一样的,这里就不给效果图了~

PopupMenu菜单:

还是先上效果图:


popup_menu.xml代码:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/menu_my"
        android:icon="@mipmap/ic_launcher"
        android:title="我的"
        app:showAsAction="never" />

    <item
        android:id="@+id/menu_setting"
        android:icon="@mipmap/ic_launcher"
        android:title="设置"
        app:showAsAction="never" />

    <item
        android:id="@+id/menu_genduo"
        android:title="更多">
        <menu>
            <item
                android:id="@+id/menu_item1"
                android:title="年龄" />
            <item
                android:id="@+id/menu_item2"
                android:title="班级" />

        </menu>

    </item>
</menu>

popupMenu代码比较简单,就直接上代码了~

 //popupMenu菜单
    public void onPopupMenuClick(View view) {
        PopupMenu popupMenu=new PopupMenu(MainActivity.this,view);//1.实例化PopupMenu
        getMenuInflater().inflate(R.menu.popup_menu,popupMenu.getMenu());//2.加载Menu资源

		//监听事件
        popupMenu.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
               switch (item.getItemId()){
                   case R.id.menu_my:
                       Toast.makeText(MainActivity.this, "我的", Toast.LENGTH_SHORT).show();
                       break;
                   case R.id.menu_setting:
                       Toast.makeText(MainActivity.this, "设置", Toast.LENGTH_SHORT).show();
                       break;
                   case R.id.menu_genduo:
                       Toast.makeText(MainActivity.this, "更多", Toast.LENGTH_SHORT).show();
                       break;
                   case R.id.menu_item1:
                       Toast.makeText(MainActivity.this, "年龄", Toast.LENGTH_SHORT).show();
                       break;
                   case R.id.menu_item2:
                       Toast.makeText(MainActivity.this, "班级", Toast.LENGTH_SHORT).show();
                       break;
               }
                return false;
            }
        });
        popupMenu.show();//4.显示弹出菜单
    }

完整代码

相关文章:

原创不易,您的点赞就是对我最大的支持~(如果有不足的地方,欢迎补充哦!)

标签:Toast,菜单,show,menu,item,Android,Toolbar
来源: https://blog.csdn.net/weixin_44819566/article/details/114404236

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有