Android Snackbar使用方法及小技巧-design

article/2025/9/18 18:54:20

Snackbar和Toast相似,都是为了给用户提供交互信息,Snackbar是固定在底部的,显示时从下往上滑出

这里写图片描述

要使用Snackbar,需要在项目的build.gradle中添加依赖

dependencies {compile 'com.android.support:design:23.4.0'
}

Snackbar的使用方法和Toast很相似

Snackbar.make(mOpenTv, "消息内容", Snackbar.LENGTH_SHORT).setAction("确定", new View.OnClickListener() {@Overridepublic void onClick(View v) {}}).show();

第一个参数需要传入一个View,可以是界面当中的任意一个View控件,Snackbar会自动根据这个控件找到最外层的布局来显示

第二个参数就是我们需要显示的内容,注意这里的内容最多显示两行哦,超出两行后的内容会变成“…”

第三个参数为Snackbar显示的时长,有三种模式供选择

  • LENGTH_SHORT:短时间显示

  • LENGTH_LONG:长时间显示

  • LENGTH_INDEFINITE:一直显示,只有当用户触发Action点击事件或手动删除时才会消失

Snackbar可以通过setAction方法设置一个点击事件,和用户进行交互

我们还可以通过setCallback方法来监听Snackbar的显示和关闭

        Snackbar sb = Snackbar.make(mOpenTv, "消息内容", Snackbar.LENGTH_SHORT);sb.setCallback(new Snackbar.Callback() {@Overridepublic void onDismissed(Snackbar snackbar, int event) {super.onDismissed(snackbar, event);// Snackbar关闭时回调}@Overridepublic void onShown(Snackbar snackbar) {super.onShown(snackbar);// Snackbar打开时回调}});sb.show();

Snackbar还支持滑出删除,需要在布局文件中使用CoordinatorLayout作为根布局
这里写图片描述

建议要使用Snackbar的时候最好是以CoordinatorLayout作为根布局,如果以其它RelativeLayout,LinearLayout等作为根布局的话,会出现以下这种情况

这里写图片描述

FloatingActionButton被遮到了,使用CoordinatorLayout作为根布局可以避免这种情况

这里写图片描述

Snackbar只能在底部显示吗?
是也不是,为啥这么说呢,Snackbar确实是在CoordinatorLayout底部显示的,但并不等于是在屏幕顶部
首先我们要知道Snackbar显示的原理是什么
之前介绍中的第一个传进去的参数View,Snackbar会通过这个View控件找到它所在的根布局,我们来查看下源码

    public static Snackbar make(@NonNull View view, @NonNull CharSequence text,@Duration int duration) {Snackbar snackbar = new Snackbar(findSuitableParent(view));snackbar.setText(text);snackbar.setDuration(duration);return snackbar;}

我们传进去的view会经过findSuitableParent方法的处理,我们再来看下这个方法的具体实现

    private static ViewGroup findSuitableParent(View view) {ViewGroup fallback = null;do {if (view instanceof CoordinatorLayout) {// We've found a CoordinatorLayout, use itreturn (ViewGroup) view;} else if (view instanceof FrameLayout) {if (view.getId() == android.R.id.content) {// If we've hit the decor content view, then we didn't find a CoL in the// hierarchy, so use it.return (ViewGroup) view;} else {// It's not the content view but we'll use it as our fallbackfallback = (ViewGroup) view;}}if (view != null) {// Else, we will loop and crawl up the view hierarchy and try to find a parentfinal ViewParent parent = view.getParent();view = parent instanceof View ? (View) parent : null;}} while (view != null);// If we reach here then we didn't find a CoL or a suitable content view so we'll fallbackreturn fallback;}

详细的过程google的工程师已经写的非常的清楚了,我们主要需要了解的就是当一个View的直接父布局为CoordinatorLayout时,就以这个CoordinatorLayout为标准来显示Snackbar
我们可以做个小实验验证一下
在传入的View控件外面套一层CoordinatorLayout

    <android.support.design.widget.CoordinatorLayoutandroid:layout_width="match_parent"android:layout_height="100dp"><TextViewandroid:id="@+id/tv_open_snackbar"android:layout_width="match_parent"android:layout_height="wrap_content"android:gravity="center"android:text="打开Snackbar"android:textSize="28sp"/></android.support.design.widget.CoordinatorLayout>

再运行一下看看,效果就变成了下面这样
这里写图片描述
所以说Snackbar的显示位置还是可以通过这个小技巧来改变的

如果嫌默认的Snackbar太丑怎么办?
我们可以来自定义它的外观

1.改变按钮的文字颜色
通过调用setActionTextColor方法即可改变按钮的文字颜色

        Snackbar sb = Snackbar.make(mOpenTv, "消息内容", Snackbar.LENGTH_SHORT);sb.setAction("确定", new View.OnClickListener() {@Overridepublic void onClick(View v) {}});sb.setActionTextColor(Color.YELLOW);sb.show();

这里写图片描述

2.改变消息内容的文字颜色
Snackbar没有给我们提供改变消息文本颜色的api接口,但在查看源码时发现了这个方法getView

    /*** Returns the {@link Snackbar}'s view.*/@NonNullpublic View getView() {return mView;}

这里返回的mView其实是一个SnackbarLayout布局,在SnackbarLayout的构造方法中找到了它的布局文件design_layout_snackbar_include

            // Now inflate our content. We need to do this manually rather than using an <include>// in the layout since older versions of the Android do not inflate includes with// the correct Context.LayoutInflater.from(context).inflate(R.layout.design_layout_snackbar_include, this);

design_layout_snackbar_include布局文件里只有两个控件,一个TextView,一个Button

<merge xmlns:android="http://schemas.android.com/apk/res/android"><TextViewandroid:id="@+id/snackbar_text"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"android:paddingTop="@dimen/design_snackbar_padding_vertical"android:paddingBottom="@dimen/design_snackbar_padding_vertical"android:paddingLeft="@dimen/design_snackbar_padding_horizontal"android:paddingRight="@dimen/design_snackbar_padding_horizontal"android:textAppearance="@style/TextAppearance.Design.Snackbar.Message"android:maxLines="@integer/design_snackbar_text_max_lines"android:layout_gravity="center_vertical|left|start"android:ellipsize="end"android:textAlignment="viewStart"/><Buttonandroid:id="@+id/snackbar_action"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="@dimen/design_snackbar_extra_spacing_horizontal"android:layout_marginStart="@dimen/design_snackbar_extra_spacing_horizontal"android:layout_gravity="center_vertical|right|end"android:paddingTop="@dimen/design_snackbar_padding_vertical"android:paddingBottom="@dimen/design_snackbar_padding_vertical"android:paddingLeft="@dimen/design_snackbar_padding_horizontal"android:paddingRight="@dimen/design_snackbar_padding_horizontal"android:visibility="gone"android:textColor="?attr/colorAccent"style="?attr/borderlessButtonStyle"/></merge>

相信看到这里大家应该知道怎么做了,TextView的id为snackbar_text,我们通过getView()来获取这个TextView控件

        Snackbar sb = Snackbar.make(mOpenTv, "消息内容", Snackbar.LENGTH_SHORT);sb.setAction("确定", new View.OnClickListener() {@Overridepublic void onClick(View v) {}});sb.setActionTextColor(Color.YELLOW);View view = sb.getView();TextView tv = (TextView) view.findViewById(R.id.snackbar_text);tv.setTextColor(Color.RED);sb.show();

这里写图片描述
同样的,我们也可以通过tv.setTextSize设置它的文字大小

3.改变消息内容的背景
同理,根据以上方法,得到它的布局,调用对应的api接口就好

        View view = sb.getView();view.setBackgroundColor(Color.RED);

像这种红红的给用户警告的提示,是不是比Toast要来的炫酷多了呢
这里写图片描述

这里写图片描述

4.给消息内容添加图标
获取到消息内容的TextView后,调用setCompoundDrawables方法设置它的图标,可自由选择图标放置的位置,四个参数分别对应TextView的左、上、右、下

        Snackbar sb = Snackbar.make(mOpenTv, "消息内容", Snackbar.LENGTH_SHORT);sb.setAction("确定", new View.OnClickListener() {@Overridepublic void onClick(View v) {}});sb.setActionTextColor(Color.YELLOW);View view = sb.getView();TextView tv = (TextView) view.findViewById(R.id.snackbar_text);Drawable d = ContextCompat.getDrawable(this, R.drawable.warn);d.setBounds(0, 0, d.getMinimumWidth(), d.getMinimumHeight());tv.setCompoundDrawables(d, null, null, null);   // 给TextView左边添加图标tv.setGravity(Gravity.CENTER);  // 让文字居中sb.show();}

这里写图片描述
注意要设置setGravity使其居中,不然文字默认在上面不好看啊

就先介绍这么多,其实只要拿到了它的布局,接下来怎么整就看各位的喜好啦


http://chatgpt.dhexx.cn/article/TiGxYnGo.shtml

相关文章

Android 快别用Toast了,来试试Snackbar

&#x1f525; 应用场景 Toast提示默认显示在界面底部&#xff0c;使用Toast.setGravity()将提示显示在中间&#xff0c;如下&#xff1a; Toast toast Toast.makeText(this, str, Toast.LENGTH_SHORT);toast.setGravity(Gravity.CENTER, 0, 0);toast.show();运行在在Android …

Android---简易Snackbar

目录 Snackbar 简介 Snackbar 特性 完整Demo Snackbar 简介 Snackbar 是 Android5.0 新特性---Material Design 中的一个控件&#xff0c;用来代替 Toast。Snackbar 就是一个类似 Toast 的快速弹出消息提示的控件&#xff0c;手机上显示在底部&#xff0c;大屏幕设备显示在左…

Android Snackbar基本使用

概述 Snackbar 是 Android 5.0 新特性——Material Design 中的一个控件&#xff0c;用来代替 Toast &#xff0c;Snackbar与Toast的主要区别是&#xff1a;Snackbar可以滑动退出&#xff0c;也可以处理用户交互&#xff08;点击&#xff09;事件。 样式 使用 Snackbar需要配…

Android提醒微技巧,你真的了解Dialog、Toast和Snackbar吗?

转载请注明出处&#xff1a;http://blog.csdn.net/guolin_blog/article/details/51336415 本文同步发表于我的微信公众号&#xff0c;扫一扫文章底部的二维码或在微信搜索 郭霖 即可关注&#xff0c;每天都有文章更新。 今天给大家带来一篇简单易懂的微技巧文章&#xff0c;并没…

Android开发——Snackbar使用详解

Snackbar是Android支持库中用于显示简单消息并且提供和用户的一个简单操作的一种弹出式提醒。当使用Snackbar时&#xff0c;提示会出现在消息最底部&#xff0c;通常含有一段信息和一个可点击的按钮。下图是Gmail中删除一封邮件时弹出的Snackbar&#xff1a; 在上图中&#xf…

Android Snackbar的使用

在项目中肯定有不少地方用到Toast&#xff0c;但是在项目各种各样的需求上&#xff0c;Toast已经不能满足我们的需求了。 其实google在Android 5.0的时候就推出了Snackbar&#xff0c;它算是Toast的一个进阶控件。 它是Material Design中的一个控件&#xff0c;与Toast的最大区…

Snackbar的使用和顶部Snackbar实现

下载链接&#xff1a;Snackbar顶部显示 也可以module的形式直接导入使用 &#xff1a;module导入教程 谷歌在android 5.0 发布后&#xff0c;随后公布了design库和设计理念&#xff08;需翻墙&#xff09;&#xff0c;意图在于规范安卓app的风格&#xff0c;类似而不仅仅ios的…

SnackBar 简单使用

1.简介 Snackbar是Android Support Design Library库中的一个控件&#xff0c;可以在屏幕底部快速弹出消息&#xff0c;比Toast更加好用.可以添加点击行为。多用于结合协调布局使用&#xff08;CoordinatorLayout&#xff09;。 implementation com.android.support:design:28…

MaterialDesign之Snackbar学习笔记

近期实在太忙了&#xff0c;看到好的文章先转载&#xff0c;后续自己慢慢消化吧&#xff01; 转载 http://www.jianshu.com/p/cd1e80e64311#rd 没时间解释了&#xff0c;快使用Snackbar!——Android Snackbar花式使用指南 字数2405 阅读1628 评论4 喜欢54 本文是在《Design…

Snackbar使用详解

Snackbar Snackbar是Android Support Design Library库中的一个控件&#xff0c;可以在屏幕底部快速弹出消息&#xff0c;比Toast更加好用。 开发出一个好的产品&#xff0c;友好的交互是不可缺少的&#xff0c;通常给用户提示信息的方式有三种&#xff1a;Dialog、Toast、Sn…

Snackbar使用详解及其相关框架TSnackbar

简述&#xff1a; Snackbar 是 Android design support library 中的一个组件&#xff0c;它的作用和Toast类似&#xff0c;显示吐司&#xff0c;但Snackbar的特别之处在于Snackbar显示的提示信息可以和用户交互&#xff0c;更好地获取用户反馈信息。同时&#xff0c;它显示的吐…

HAWQ:基于 Hessian 的混合精度神经网络量化

HAWQ&#xff1a;基于 Hessian 的混合精度神经网络量化 摘要动机方法海森方法的有效性分析海森矩阵方法推导根据幂迭代求海森矩阵的最大特征值根据海森矩阵最大特征值确定量化精度与顺序 实验结果ResNet20 On CIFAR-10ResNet50 on ImageNetSqueezeNext on ImageNetInception-V3…

HAWQ技术解析(二) —— 安装部署

一、安装规划1. 选择安装介质 HAWQ的安装介质有两种选择&#xff0c;一是下载源码手工编译&#xff0c;二是使用Pivotal公司提供的HDB安装包。源码的下载地址为 http://apache.org/dyn/closer.cgi/incubator/hawq/2.0.0.0-incubating/apache-hawq-src-2.0.0.0-incubating.tar.…

HAWQ取代传统数仓实践(二)——搭建示例模型(MySQL、HAWQ)

一、业务场景 本系列实验将应用HAWQ数据库&#xff0c;为一个销售订单系统建立数据仓库。本篇说明示例的业务场景、数据仓库架构、实验环境、源和目标库的建立过程、测试数据和日期维度的生成。后面陆续进行初始数据装载、定期数据装载、调度ETL工作流自动执行、维度表技术、事…

HAWQ从0.5开始安装说明.包含hadoop和hawq

文档是从自己的云笔记中复制,格式什么的可能有问题.已修复了一遍. 零.前提 一.安装hadoop 1.1下载并复制hadoop2.6.5 1.2编辑系统配置文件 1.3创建hadoop的tmp临时目录 1.4开始修改配置文件 1.5复制hadoop到其他所有节点上 1.6开始初始化hadoop 1.7 如果服务器重启了,…

开源数据库HAWQ,架构调研

hawq的简介 https://cloud.tencent.com/developer/article/1433137 HAWQ&#xff0c;全称Hadoop With Query&#xff08;带查询Hadoop&#xff09;。HAWQ使企业能够获益于经过锤炼的基于MPP的分析功能及其查询性能&#xff0c;同时利用Hadoop堆栈。HAWQ是一个Hadoop原生大规模…

apache hawq

为什么80%的码农都做不了架构师&#xff1f;>>> 资料地址&#xff1a; 导航页 What is HAWQ? HAWQ Architecture How HAWQ Manages Resources Understanding the Fault Tolerance Service Table Distribution and Storage Choosing the Table Distribution Pol…

HAWQ技术解析(一) —— HAWQ简介

一、SQL on Hadoop 过去五年里&#xff0c;许多企业已慢慢开始接受Hadoop生态系统&#xff0c;将它用作其大数据分析堆栈的核心组件。尽管Hadoop生态系统的MapReduce组件是一个强大的典范&#xff0c;但随着时间的推移&#xff0c;MapReduce自身并不是连接存储在Hadoop生态系统…

《HAWQ-V3: Dyadic Neural Network Quantization》论文阅读

HAWQ-V3阅读笔记 Abstract 混合精度量化&#xff0c;integer-only&#xff0c; Methodology 只采用均匀量化 权重对称量化&#xff0c;激活非对称量化&#xff0c;对量化步长S采用静态量化&#xff0c;采用per-channel的量化方式 3.1量化矩阵的乘法与卷积&#xff08;核心…

HAWQ手动安装

HAWQ手动安装及使用手册 1 HAWQ简介 HAWQ 是 Pivotal 设计的一个大规模并行 SQL 分析处理引擎&#xff0c;支持事务处理。HAWQ 将复杂的查询分割成简单的任何&#xff0c;并分发到并行处理系统中的处理单元执行。包括查询规划器、动态管道、前沿互联和查询执行优化器等等。提…