Snackbar 以及注意事项

2019-06-03  本文已影响0人  w小强

介绍

Snackbar出现在Android5.1以后,按照官方的介绍:Snackbar为了给提供一种简单快捷的操作。

在使用snackbar时,我们要导入design包.

注意事项

  1. 必须导入V7包并且使用AppCompatActivity
  2. 在CoordinatorLayout下使用Snackbar才支持侧滑功能

最简单的Snackbar

/**
* @param view 通过这个View查找父布局
* @param msg 需要显示的消息
* @params Snackbar.LENGTH_SHORT 显示时间,和toast一样
*/
Snackbar.make(view,msg,Snackbar.LENGTH_SHORT).show();

Snackbar会把自己加在符合条件的父层布局,至于什么是符合条件可以看下面的源码:


image

可以通过make方法的源码看到,如果view 或者View的父布局是CoordinatorLayout,那么直接加载CoordinatorLayout上。

如果是Framelayout,并且是content根布局,那么就显示在根布局上。

如果不是根布局,那么就暂存,继续找下一个。一直找到根布局

因为Snackbar是添加到View中的,所以和Toast相比,Snackbar当Activity不可见的时候也会消失

Snackbar显示时间

Snackbar动作

添加一个简单的行为

image
  1. 添加一个string的资源ID当做动作触发点。
  2. 直接添加一个字符串当做动作的触发点。
  3. 设置动作的颜色,

Snackbar主动动作

监听Snackbar的状态

可以通过addCallback(BaseCallback<B> callback)监听Snackbar的显示和消失,通过removeCallback(BaseCallback<B> callback)清除这种监听。

bar.addCallback(new BaseTransientBottomBar.BaseCallback<Snackbar>() {
@Override
public void onDismissed(Snackbar transientBottomBar, int event) {
Log.d("q","Snackbar 消时了");
}

@Override
public void onShown(Snackbar transientBottomBar) {
Log.d("q","Snackbar 显示了");
}
});

自定义Snackbar

修改背景色和修改msg字体颜色

image

通过源码发现,Snackbar加载了一个R.layout.design_layout_snackbar_include的布局文件。

打开这个布局文件


image

所以要改变背景色和msg字体颜色可以进行如下的操作

bar.getView().setBackgroundColor(0xff0000ff);
((TextView)bar.getView().findViewById(android.support.design.R.id.snackbar_text)).setTextColor(0xffff0000);

自定义图标

Snackbar使用的是SnackbarLayout当做父布局,SnackbarLayout是一个FrameLayout。
所以可以通过如下代码增加View:


image
Snackbar bar = Snackbar.make(view,msg,10*1000);
Snackbar.SnackbarLayout layout = (Snackbar.SnackbarLayout) bar.getView();
ImageView image = new ImageView(bar.getContext());
image.setBackgroundColor(0x00ffffff); image.setImageResource(R.drawable.xingxing);
FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.WRAP_CONTENT, FrameLayout.LayoutParams.WRAP_CONTENT);
params.gravity = Gravity.CENTER_VERTICAL|Gravity.RIGHT;
layout.addView(image,params);
bar.show();

最终的效果图:

image
上一篇下一篇

猜你喜欢

热点阅读