Android中Snackbar的使用方法及小技巧

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

前言

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() {  @OverrIDe  public 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() { @OverrIDe public voID ondismissed(Snackbar snackbar,int event) { super.ondismissed(snackbar,event); // Snackbar关闭时回调 } @OverrIDe public 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 it  return (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 fallback   fallback = (VIEwGroup) vIEw;  }  }  if (vIEw != null) {  // Else,we will loop and crawl up the vIEw hIErarchy and try to find a parent  final 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 fallback return fallback; }

详细的过程Google的工程师已经写的非常的清楚了，我们主要需要了解的就是当一个VIEw的直接父布局为CoordinatorLayout时，就以这个CoordinatorLayout为标准来显示Snackbar

我们可以做个小实验验证一下

在传入的VIEw控件外面套一层CoordinatorLayout

 <androID.support.design.Widget.CoordinatorLayout androID:layout_wIDth="match_parent" androID:layout_height="100dp"> <TextVIEw  androID: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太丑怎么办？

我们可以来@R_419_6942@它的外观

1.改变按钮的文字颜色

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

 Snackbar sb = Snackbar.make(mOpenTv,Snackbar.LENGTH_SHORT); sb.setAction("确定",new VIEw.OnClickListener() {  @OverrIDe  public voID onClick(VIEw v) {  } }); sb.setActionTextcolor(color.YELLOW); sb.show();

2.改变消息内容的文字颜色

Snackbar没有给我们提供改变消息文本颜色的API接口，但在查看源码时发现了这个方法getVIEw

 /** * Returns the {@link Snackbar}'s vIEw. */ @NonNull public 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"> <TextVIEw  androID: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"/> <button  androID: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"  /></merge>

相信看到这里大家应该知道怎么做了，TextVIEw的ID为snackbar_text，我们通过getVIEw()来获取这个TextVIEw控件

 Snackbar sb = Snackbar.make(mOpenTv,new VIEw.OnClickListener() {  @OverrIDe  public 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() {   @OverrIDe   public 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,d.getMinimumWIDth(),d.getMinimumHeight());  tv.setCompoundDrawables(d,null,null); // 给TextVIEw左边添加图标  tv.setGravity(Gravity.CENTER); // 让文字居中  sb.show(); }

注意要设置setGravity使其居中，不然文字默认在上面不好看啊

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

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对编程小技巧的支持。

您可能感兴趣的文章:Android重要控件SnackBar使用方法详解Android提醒微技巧你真的了解Dialog、Toast和Snackbar吗Android 开发之Dialog,Toast，Snackbar提醒Android中如何指定SnackBar在屏幕的位置及小问题解决 总结

以上是内存溢出为你收集整理的Android中Snackbar的使用方法及小技巧全部内容，希望文章能够帮你解决Android中Snackbar的使用方法及小技巧所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。