Android Design Support Library使用详解——Snackbar

时间:2022-12-29 23:02:12

Google在2015 I/O大会上,给我们带来了更加详细的Material Design规范,同时也引入了Android Design Support Library,为我们提供了基于Material设计规范的控件。它兼容性广,能兼容到android 2.1(按Google官方数据,兼容android 2.3以上即可覆盖当前市面上所有Android设备),并且高度封装,使用简洁,可谓业界良心之作。

与Dialog及Toast的异同

在与用户的交互过程中,有时我们需要给用户一些提示信息,甚至可能提供一些操作的选择。通常,我们会使用Dialog或Toast来进行这种提示。这两种提示各有特点,但却似乎都在各自的特点上走了极端。

Dialog的特点是,它弹出来的时候会中断用户当前的操作,直到这个Dialog被处理。它除了向用户提供一些信息之外,也可能包含一些操作,通常用于必须打断用户的提示,比如当用户进行清空数据等重要操作时进行二次确认的提示。

Toast则是走了另外一个极端。它用于向用户提供少量的信息展示,并且不会中断用户当前的操作,这样在与用户的交互过程中也不会显得唐突。但它也只能用于展示少量信息,不能向用户提供一些操作选择。

而在Android Design Support Library中,谷歌为我们引入了Snackbar,它使用简单,与Toast相似,并且吸收了Dialog与Toast各自的优点,而避免了它们设计上的不足。它在界面的底部向用户展示少量信息,并且可以向用户提供一种轻量级的反馈操作,如下图:

Android Design Support Library使用详解——Snackbar

在这个例子中,原先对于未验证的车牌是点击后直接跳到车牌列表的界面并提示去验证,但显然提示用户未验证并给出“去验证”的操作建议会更加友好。

快速使用

Snackbar的使用很简单,接口与Toast相似。像上面的图中的例子,代码如下:

Snackbar.make(view, "需要验证该车牌才能使用该功能", Snackbar.LENGTH_LONG)
.setAction("去验证", new View.OnClickListener() {
@Override
public void onClick(View view) {
Activities.to(getActivity(), VehicleListActivity.class);
}
}).show();

接口介绍

Snackbar向我们提供了以下相关的接口:

  • static Snackbar make(View view, int resId, int duration)static Snackbar make(View view, CharSequence text, int duration):用于创建一个Snackbar,参数如下:
    • view:用于找到合适的parent的view,以把自己添加上去
    • resIdtext:展示的信息
    • duration:展示的时间,参数值如下:
      • LENGTH_LONG 显示2750毫秒
      • LENGTH_SHORT 显示1500毫秒
      • LENGTH_INDEFINITE 一直展示,直到它被dismiss掉,或者是下一个Snackbar被显示时。
  • setText(int resId)setText(CharSequence message):更新Snackbar上的提示消息。
  • setAction(int resId, View.OnClickListener listener)setAction(CharSequence text, View.OnClickListener listener):设置显示到Snackbar上的操作。
  • setActionTextColor(ColorStateList colors)setActionTextColor(int color):设置操作的文本颜色。
  • setDuration(int duration)getDuration():设置及获取显示的时间
  • show()dismiss()isShown():显示、隐藏Snackbar,以及判断当前Snackbar是否正在被显示。
  • setCallback(Snackbar.Callback callback):设置当前Snackbar可见性变化时的回调

Snackbar提供的接口非常简单并且易于理解,需要注意的是,与Toast不同,当新的Snackbar被显示时,会先隐藏掉上一个Snackbar然后显示新的Snackbar,而不像Toast那样等前面的Toast显示完毕才显示。

一些技巧

设置消息的文本颜色

Snackbar并没有提供设置消息文本颜色的API。通过定位到它的布局代码,我们可以看到它是通过一个style来配置:

android:textAppearance="@style/TextAppearance.Design.Snackbar.Message"

该style对应源码:

  <style name="TextAppearance.Design.Snackbar.Message" parent="android:TextAppearance">
<item name="android:textSize">@dimen/design_snackbar_text_size</item>
<item name="android:textColor">?android:textColorPrimary</item>
</style>

可见其颜色读的是theme中的android:textColorPrimary的值。但是如果我们想要修改它的颜色的话,配置android:textColorPrimary是无效的,我们要配置的是theme里面的android:textColor

然后可能有一个问题,通常我们会在theme里使用这个属性为整个应用配置默认的文本颜色,比如在我公司的项目里,就使用#333来作业默认的黑色文本,这样就使得Snackbar的提示消息看不见(Snackbar的背景色是#ff303030)。这种情况下只能使用比较hack的方式来修改它的颜色值了。我试过覆盖它的style定义,但是未能成功。最后是通过getView()接口获取到SnackbarLayout,再拿到里面的TextView来修改其文本颜色,代码如下:

((TextView)snackbar.getView().findViewById(android.support.design.R.id.snackbar_text)).setTextColor(Color.WHITE);

滑动删除的Snackbar

当Snackbar与CoordinatorLayout一起使用时,即Snackbar显示在CoordinatorLayout里面时,可以通过在Snackbar上右滑的操作把当前的Snackbar隐藏掉,即我们在调用Snackbar.make(…)方法时,传入的View应该为CoordinatorLayout或CoordinatorLayout的子view。

另外Snackbar与FloatingActionButton如果都在CoordinatorLayout内时,Snackbar展示时FloatingActionButton会跟着上移,而不会出现互相遮挡的情况。