Bottom Sheets(底部动作条)使用介绍

2023-11-08 23:30

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

Bottom Sheets是Android Support Library 23.2出现的新特性,Github在这之前就有开源的BottomSheet效果,感兴趣的可以搜索研究下。

下边是整合BottomSheets的一些知识点:

底部动作条

底部动作条(Bottom Sheets)是一个从屏幕底部边缘向上滑出的一个面板,使用这种方式向用户呈现一组功能。底部动作条呈现了简单、清晰、无需额外解释的一组操作。

使用

底部动作条(Bottom Sheets)特别适合有三个或者三个以上的操作需要提供给用户选择、并且不需要对操作有额外解释的情景。如果只有两个或者更少的操作,或者需要详加描述的,可以考虑使用菜单(Menu)或者对话框替代。

底部动作条(Bottom Sheets)可以是列表样式的也可以是宫格样式的。宫格布局可以增加视觉的清晰度。

你可以使用底部动作条(Bottom Sheets)展示和其 app 相关的操作,比如做为进入其他 app 的入口(通过 app 的 icon 进入)。

Bottom Sheet 一共有五个状态回调:

  • STATE_COLLAPSED 
    折叠状态。可通过app:behavior_peekHeight来设置默认显示的高度。

  • STATE_SETTING 
    拖拽松开之后到达终点位置(collapsed or expanded)前的状态。

  • STATE_EXPANDED 
    完全展开的状态。

  • STATE_HIDDEN 
    隐藏状态。默认是false,可通过app:behavior_hideable属性设置。

  • STATE_DRAGGING 
    被拖拽状态

BottomSheet的使用:

1、在AndroidStudio的build.gradle文件下,依赖 compile'com.android.support:design:23.2.0'

2、新建activity_main.xml布局文件;此处需要注意的是必须在CoordinatorLayout视图下添加一个View属性是 app:layout_behavior="android.support.design.widget.BottomSheetBehavior"的控件。这个控件可以是NestedScrollView,也可以是RecyclerView。

<span style="font-size:18px;"><android.support.design.widget.CoordinatorLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:id="@+id/main_content"android:layout_width="match_parent"android:layout_height="match_parent"android:fitsSystemWindows="true"><ScrollViewandroid:layout_width="match_parent"android:layout_height="match_parent"app:layout_behavior="@string/appbar_scrolling_view_behavior"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"android:paddingTop="24dp"><Buttonandroid:id="@+id/button_1"android:layout_width="match_parent"android:layout_height="wrap_content"android:text="STATE_EXPANDED"android:padding="16dp"android:layout_margin="8dp"android:textColor="@android:color/white"android:background="#ff669900"/><Buttonandroid:id="@+id/button_2"android:layout_width="match_parent"android:layout_height="wrap_content"android:padding="16dp"android:layout_margin="8dp"android:text="STATE_COLLAPSED"android:textColor="@android:color/white"android:background="#ff33b5e5"/><Buttonandroid:id="@+id/button_3"android:layout_width="match_parent"android:layout_height="wrap_content"android:padding="16dp"android:layout_margin="8dp"android:text="BottomSheetDialog"android:textColor="@android:color/white"android:background="#ffcc0000"/></LinearLayout></ScrollView><android.support.v4.widget.NestedScrollViewandroid:id="@+id/bottom_sheet"android:layout_width="match_parent"android:layout_height="350dp"android:clipToPadding="true"android:background="#ffffbb33"app:layout_behavior="android.support.design.widget.BottomSheetBehavior"><!--此处用于填充BottomSheets的自定义样式--><TextViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:text="底部动作条(Bottom Sheets)特别适合有三个或者三个以上的操作需要提供给用户选择、并且不需要对操作有额外解释的情景。如果只有两个或者更少的操作,或者需要详加描述的,可以考虑使用菜单(Menu)或者对话框替代。底部动作条(Bottom Sheets)可以是列表样式的也可以是宫格样式的。宫格布局可以增加视觉的清晰度。你可以使用底部动作条(Bottom Sheets)展示和其 app 相关的操作,比如做为进入其他 app 的入口(通过 app 的 icon 进入)。"android:padding="16dp"android:textSize="16sp"/></android.support.v4.widget.NestedScrollView></android.support.design.widget.CoordinatorLayout></span>


3、然后就是MAinActivity的代码,直接粘贴过来,里边也有BottomSheets的用法:

package com.glodon.bottomsheetsdemo;import android.os.Bundle;
import android.support.design.widget.BottomSheetBehavior;
import android.support.design.widget.BottomSheetDialog;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;public class MainActivity extends AppCompatActivity implements View.OnClickListener{private BottomSheetBehavior<View> mBottomSheetBehavior;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);View bottomSheet = findViewById( R.id.bottom_sheet );Button button1 = (Button) findViewById( R.id.button_1 );Button button2 = (Button) findViewById( R.id.button_2 );Button button3 = (Button) findViewById( R.id.button_3 );button1.setOnClickListener(this);button2.setOnClickListener(this);button3.setOnClickListener(this);mBottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);mBottomSheetBehavior.setPeekHeight(300);//设置内容栏默认高度mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);mBottomSheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {@Overridepublic void onStateChanged(View bottomSheet, int newState) {if (newState == BottomSheetBehavior.STATE_COLLAPSED) {mBottomSheetBehavior.setPeekHeight(0);//设置内容栏默认高度为0,即用户看不到}}@Overridepublic void onSlide(View bottomSheet, float slideOffset) {}});}@Overridepublic void onClick(View v) {switch( v.getId() ) {case R.id.button_1: {mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);break;}case R.id.button_2: {mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);break;}case R.id.button_3: {final BottomSheetDialog bottomSheetDialog=new BottomSheetDialog(MainActivity.this);bottomSheetDialog.setContentView(R.layout.bottom_sheet_dialog_layout);bottomSheetDialog.findViewById(R.id.tv_dialog_cancel).setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {bottomSheetDialog.dismiss();}});bottomSheetDialog.show();break;}}}
}

效果图:



附上Demo



这篇关于Bottom Sheets(底部动作条)使用介绍的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



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

相关文章

如何使用celery进行异步处理和定时任务(django)

《如何使用celery进行异步处理和定时任务(django)》文章介绍了Celery的基本概念、安装方法、如何使用Celery进行异步任务处理以及如何设置定时任务,通过Celery,可以在Web应用中... 目录一、celery的作用二、安装celery三、使用celery 异步执行任务四、使用celery

使用Python绘制蛇年春节祝福艺术图

《使用Python绘制蛇年春节祝福艺术图》:本文主要介绍如何使用Python的Matplotlib库绘制一幅富有创意的“蛇年有福”艺术图,这幅图结合了数字,蛇形,花朵等装饰,需要的可以参考下... 目录1. 绘图的基本概念2. 准备工作3. 实现代码解析3.1 设置绘图画布3.2 绘制数字“2025”3.3

Jsoncpp的安装与使用方式

《Jsoncpp的安装与使用方式》JsonCpp是一个用于解析和生成JSON数据的C++库,它支持解析JSON文件或字符串到C++对象,以及将C++对象序列化回JSON格式,安装JsonCpp可以通过... 目录安装jsoncppJsoncpp的使用Value类构造函数检测保存的数据类型提取数据对json数

python使用watchdog实现文件资源监控

《python使用watchdog实现文件资源监控》watchdog支持跨平台文件资源监控,可以检测指定文件夹下文件及文件夹变动,下面我们来看看Python如何使用watchdog实现文件资源监控吧... python文件监控库watchdogs简介随着Python在各种应用领域中的广泛使用,其生态环境也

Python中构建终端应用界面利器Blessed模块的使用

《Python中构建终端应用界面利器Blessed模块的使用》Blessed库作为一个轻量级且功能强大的解决方案,开始在开发者中赢得口碑,今天,我们就一起来探索一下它是如何让终端UI开发变得轻松而高... 目录一、安装与配置:简单、快速、无障碍二、基本功能:从彩色文本到动态交互1. 显示基本内容2. 创建链

springboot整合 xxl-job及使用步骤

《springboot整合xxl-job及使用步骤》XXL-JOB是一个分布式任务调度平台,用于解决分布式系统中的任务调度和管理问题,文章详细介绍了XXL-JOB的架构,包括调度中心、执行器和Web... 目录一、xxl-job是什么二、使用步骤1. 下载并运行管理端代码2. 访问管理页面,确认是否启动成功

使用Nginx来共享文件的详细教程

《使用Nginx来共享文件的详细教程》有时我们想共享电脑上的某些文件,一个比较方便的做法是,开一个HTTP服务,指向文件所在的目录,这次我们用nginx来实现这个需求,本文将通过代码示例一步步教你使用... 在本教程中,我们将向您展示如何使用开源 Web 服务器 Nginx 设置文件共享服务器步骤 0 —

Java中switch-case结构的使用方法举例详解

《Java中switch-case结构的使用方法举例详解》:本文主要介绍Java中switch-case结构使用的相关资料,switch-case结构是Java中处理多个分支条件的一种有效方式,它... 目录前言一、switch-case结构的基本语法二、使用示例三、注意事项四、总结前言对于Java初学者

Golang使用minio替代文件系统的实战教程

《Golang使用minio替代文件系统的实战教程》本文讨论项目开发中直接文件系统的限制或不足,接着介绍Minio对象存储的优势,同时给出Golang的实际示例代码,包括初始化客户端、读取minio对... 目录文件系统 vs Minio文件系统不足:对象存储:miniogolang连接Minio配置Min

使用Python绘制可爱的招财猫

《使用Python绘制可爱的招财猫》招财猫,也被称为“幸运猫”,是一种象征财富和好运的吉祥物,经常出现在亚洲文化的商店、餐厅和家庭中,今天,我将带你用Python和matplotlib库从零开始绘制一... 目录1. 为什么选择用 python 绘制?2. 绘图的基本概念3. 实现代码解析3.1 设置绘图画