Android Toolbar 使用

2024-08-22 15:08
文章标签 android 使用 toolbar

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

概述

自从Google 推出 Material Design 发展至今,市面上大多的App都逐步采用了这种设计方式。其中新版本的5.X SDK中推荐使用AppCompatActivity代替了ActionBarActivity。对于ActionBar 本人并没有深入研究过。目前新版本的SDK也已经弃用了。取而代之的是ToolBar。

ToolBar 位于android.support.v7.widget.Toolbar,提供了低版本的兼容,包含了大多的ActionBar操作。并且ToolBar可以直接在布局文件中声明。相对ActionBar灵活很多。

ToolBar共有2中使用方式:

  • 将ToolBar作为ActionBar使用
  • 将ToolBar作为单独控件使用,意味着ToobBar可以和ActionBar共存。

本文主要说的是第一种方式,代替ActionBar。

使用ToolBar

隐藏ActionBar

App的主题需要继承 Theme.AppCompat.Light.NoActionBar

<style name="Theme.MaterialDesign" parent="Theme.AppCompat.Light.NoActionBar"><item name="colorPrimary">@color/app_primary_color</item><item name="colorPrimaryDark">@color/app_primary_dark_color</item><item name="colorAccent">@color/app_primary_color</item><item name="android:textSize">16sp</item><item name="android:windowBackground">@color/white</item>
</style>

此处我使用了一些Color Palette ,对应Material Design

其中各种颜色的对应如下图:

其中navigationBarColor 属性5.0以下设备可能会失效,可以通过定义values-v21来设定。

在xml中声明ToolBar
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"android:id="@id/toolbar"style="@style/ToolBarStyle"><TextView
        android:id="@id/toolbar_title"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:ellipsize="end"android:singleLine="true"android:textColor="@color/white"android:textSize="20sp" />
</android.support.v7.widget.Toolbar>

由于本质上ToolBar是一个ViewGroud ,并且在ToolBar中的Title 属性显示的标题是在左上角的,所以我在这里定义了一个TextView用于显示标题

其中Toolbar 需要设定样式,ToolBarStyle

 <style name="ToolBarStyle"><item name="android:layout_width">match_parent</item><item name="android:layout_height">45dp</item><item name="android:minHeight">45dp</item><item name="android:background">?attr/colorPrimary</item><item name="android:theme">@style/PopWindowStyle</item></style>

ToolBar 需要设定 background 这里设为 colorPrimary 的值,跟上面Material Design Theme 设定的ActionBar颜色一致。

<style name="PopWindowStyle" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar"><item name="android:colorBackground">@color/white</item><item name="android:textColorPrimary">@color/red</item>
</style>

这里设定了ToolBar的背景颜色和文字颜色。

在代码中使用ToolBar

首先,当然需要findViewById找到ToolBar

toolbar = (Toolbar) findViewById(R.id.toolbar); 

其次我这里有个title的TextView也需要找到:

toolbar_title = (TextView) findViewById(R.id.toolbar_title);

然后代替ActionBar

setSupportAction(toolbar);

注意,调用了 setSupportActionBar 之后,菜单的加载只能在onCreateOptionsMenu中加载了,然后在onOptionsItemSelected 处理菜单的点击事件。

假如你不需要ActionBar的功能,只需要作为标题和一些菜单的作用,你也可以不调用setSupportActionBar 然后直接用ToolBar 加载Menu 。

toolbar.inflateMenu(menuId);
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {@Overridepublic boolean onMenuItemClick(MenuItem item) {return false;}});

通过setOnMenuItemClickListener来处理菜单的点击时间。

在实验过程中,也碰到一些问题。 假如我需要实现在ToolBar右边显示一个图标,点击之后会弹出相应的菜单选项出来,我采用的是定义Menu的二级菜单,然后用ToolBar加载。效果实现了,但是弹出来的选项框会出现在ToolBar顶部,而且把ToolBar的右边部分遮住了,我的需求是,选项框会在TooBar的右下方显示。(现在大多App都是这样的,毕竟不能挡住了菜单栏) 但是我发现并没有方法,最后想了个折中的方法,使用PopupWindow 在菜单点击的时候弹出来显示在ToolBar下方。目前没有找到ToolBar本事的实现方式。

例子

本例子实现ToolBar和DrawerLayout结合,左右两边都简单加载一个空白的Fragment,效果图:
这里写图片描述

例子实现起来非常简单。

首先是布局文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><include layout="@layout/widget_toolbar" /><android.support.v4.widget.DrawerLayout
        android:id="@+id/drawerlayout"android:layout_width="match_parent"android:layout_height="match_parent"><FrameLayout
            android:id="@+id/drawer_content"android:layout_width="match_parent"android:layout_height="match_parent"></FrameLayout><FrameLayout
            android:id="@+id/drawer_menu"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_gravity="left"android:background="@color/white"></FrameLayout></android.support.v4.widget.DrawerLayout></LinearLayout>

接下来是Activity代码:

package com.crxz.sample;import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.widget.TextView;import com.crxz.R;/*** Created by Crxz on 16-4-29* Description:*/
public class DrawerToolbarActivity extends AppCompatActivity {Toolbar mToolbar;TextView mToolbar_title;DrawerLayout mDrawerLayout;SampleFragment leftFragment;SampleFragment contentFragment;ActionBarDrawerToggle mActionBarDrawerToggle;@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_drawer_toolbar);initToolBar();initViews();}private void initViews() {mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerlayout);mActionBarDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, mToolbar, R.string.open, R.string.close);mActionBarDrawerToggle.syncState();mDrawerLayout.setDrawerListener(mActionBarDrawerToggle);leftFragment = new SampleFragment();contentFragment = new SampleFragment();getSupportFragmentManager().beginTransaction().add(R.id.drawer_menu,leftFragment,"left").commit();getSupportFragmentManager().beginTransaction().add(R.id.drawer_content,contentFragment,"left").commit();}private void initToolBar() {mToolbar = (Toolbar) findViewById(R.id.toolbar);mToolbar.setTitle("");mToolbar_title = (TextView) findViewById(R.id.toolbar_title);mToolbar_title.setText("Title");setSupportActionBar(mToolbar);mToolbar.setNavigationIcon(R.drawable.ic_toolbar_back);}}

几十行代码即可实现ToolBar + DrawerLayou结合 ,是不是很方便!!!

曾经我纠结过ToolBar 左上角的图标是怎么实现的,现在看来是因为ActionBarDrawerToggle自带的。

这篇关于Android Toolbar 使用的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



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

相关文章

Nginx中配置使用非默认80端口进行服务的完整指南

《Nginx中配置使用非默认80端口进行服务的完整指南》在实际生产环境中,我们经常需要将Nginx配置在其他端口上运行,本文将详细介绍如何在Nginx中配置使用非默认端口进行服务,希望对大家有所帮助... 目录一、为什么需要使用非默认端口二、配置Nginx使用非默认端口的基本方法2.1 修改listen指令

Python WebSockets 库从基础到实战使用举例

《PythonWebSockets库从基础到实战使用举例》WebSocket是一种全双工、持久化的网络通信协议,适用于需要低延迟的应用,如实时聊天、股票行情推送、在线协作、多人游戏等,本文给大家介... 目录1. 引言2. 为什么使用 WebSocket?3. 安装 WebSockets 库4. 使用 We

python中的显式声明类型参数使用方式

《python中的显式声明类型参数使用方式》文章探讨了Python3.10+版本中类型注解的使用,指出FastAPI官方示例强调显式声明参数类型,通过|操作符替代Union/Optional,可提升代... 目录背景python函数显式声明的类型汇总基本类型集合类型Optional and Union(py

Java使用正则提取字符串中的内容的详细步骤

《Java使用正则提取字符串中的内容的详细步骤》:本文主要介绍Java中使用正则表达式提取字符串内容的方法,通过Pattern和Matcher类实现,涵盖编译正则、查找匹配、分组捕获、数字与邮箱提... 目录1. 基础流程2. 关键方法说明3. 常见场景示例场景1:提取所有数字场景2:提取邮箱地址4. 高级

使用SpringBoot+InfluxDB实现高效数据存储与查询

《使用SpringBoot+InfluxDB实现高效数据存储与查询》InfluxDB是一个开源的时间序列数据库,特别适合处理带有时间戳的监控数据、指标数据等,下面详细介绍如何在SpringBoot项目... 目录1、项目介绍2、 InfluxDB 介绍3、Spring Boot 配置 InfluxDB4、I

使用Java读取本地文件并转换为MultipartFile对象的方法

《使用Java读取本地文件并转换为MultipartFile对象的方法》在许多JavaWeb应用中,我们经常会遇到将本地文件上传至服务器或其他系统的需求,在这种场景下,MultipartFile对象非... 目录1. 基本需求2. 自定义 MultipartFile 类3. 实现代码4. 代码解析5. 自定

使用Python实现无损放大图片功能

《使用Python实现无损放大图片功能》本文介绍了如何使用Python的Pillow库进行无损图片放大,区分了JPEG和PNG格式在放大过程中的特点,并给出了示例代码,JPEG格式可能受压缩影响,需先... 目录一、什么是无损放大?二、实现方法步骤1:读取图片步骤2:无损放大图片步骤3:保存图片三、示php

使用Python实现一个简易计算器的新手指南

《使用Python实现一个简易计算器的新手指南》计算器是编程入门的经典项目,它涵盖了变量、输入输出、条件判断等核心编程概念,通过这个小项目,可以快速掌握Python的基础语法,并为后续更复杂的项目打下... 目录准备工作基础概念解析分步实现计算器第一步:获取用户输入第二步:实现基本运算第三步:显示计算结果进

python之uv使用详解

《python之uv使用详解》文章介绍uv在Ubuntu上用于Python项目管理,涵盖安装、初始化、依赖管理、运行调试及Docker应用,强调CI中使用--locked确保依赖一致性... 目录安装与更新standalonepip 安装创建php以及初始化项目依赖管理uv run直接在命令行运行pytho

C#使用Spire.XLS快速生成多表格Excel文件

《C#使用Spire.XLS快速生成多表格Excel文件》在日常开发中,我们经常需要将业务数据导出为结构清晰的Excel文件,本文将手把手教你使用Spire.XLS这个强大的.NET组件,只需几行C#... 目录一、Spire.XLS核心优势清单1.1 性能碾压:从3秒到0.5秒的质变1.2 批量操作的优雅