前面我们介绍过了NavigationView、TextInputLayout和FloatingActionButton这个三个控件,有兴趣的可以猛戳了解:AndroidASD完全解析01之NavigationView AndroidASD完全解析02之TextInputLayout 、AndroidASD完全解析03之FloatingActionButton,这一篇我们介绍一下ADS库中的CoordinatorLayout控件和SnackBar控件吧。
概述
SnackBar控件
SnackBar控件是ASD库中的一个控件,使用跟Toast差不多,SnackBar是从屏幕底部弹出一条消息。但是SnackBar比Toast更加强大。SnackBar有如下的优点:
弹出消息一小段时间之后或者用户点击屏幕,SnackBar会消失
SnackBar可以设置一个可选操作
可以把SnackBar滑出屏幕,也可以弃用
SnackBar会在屏幕所有元素的上层显示,不是像吐司一样在屏幕中央
在一段时间内只能有一个SnackBar显示
SnackBar比Toast更加轻量级,使用的时候需要传入一个View,官方推荐和CoordinatorLayout一起使用,我们先简单介绍一下CoordinatorLayout这个控件,后面会做更详细的介绍。
CoordinatorLayout控件
CoordinatorLayout控件是Meterial Design风格的重要组件,其目的就是协调里面View的行为。CoordinatorLayout就是一个超级FrameLayout,就是一个容器,它可以放其它组件。CoordinatorLayout实现了多种Material Design中提到的滚动效果,我们可以不用写很复杂代码就可以实现,这些效果包括:
让浮动操作按钮上下滑动,为Snackbar留出空间。
扩展或者缩小Toolbar或者头部,让主内容区域有更多的空间。
控制哪个view应该扩展还是收缩,以及其显示大小比例,包括视差滚动效果动画。
CoordinatorLayout控件的使用是ASD库的难点,下面我们通过一些例子体会一下CoordinatorLayout和SnackBar的使用:
使用
跟ASD库的其它控件一样,使用SnackBar和CoordinatorLayout需要在bundle.gradle中添加如下代码:
compile 'com.android.support:design:24.0.0'
SnackBar单独使用,一般用一个Button控件或者其它控件设置一点点击事件,显示一个SnackBar,下面我们看一下代码:
首先是布局文件的代码:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="10dp">
<Button
android:id="@+id/btn_show_simple_sb"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="简单的SnackBar"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_show_sb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
app:elevation="5dp"
app:fabSize="auto"
app:rippleColor="@color/colorPrimaryDark"/>
</RelativeLayout>
<android.support.design.widget.CoordinatorLayout
android:id="@+id/cl_sb"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_show_cl_sb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:padding="8dp"
app:elevation="5dp"
app:fabSize="auto"
app:rippleColor="@color/colorPrimaryDark"/>
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
这里面没有什么需要注意的,接着就是Activity的代码:
package com.example.adsdemo;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
/**
* Created by Devin on 2016/8/15.
*/
public class SBActivity extends AppCompatActivity {
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_cl);
findViewById(R.id.btn_show_simple_sb).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Snackbar.make(view, "你要退出这个APP吗?", Snackbar.LENGTH_LONG).setAction("确定", new View.OnClickListener() {
@Override
public void onClick(View view) {
ToastUtils.showToast(SBActivity.this, "点击了确定");
}
}).show();
}
});
findViewById(R.id.fab_show_sb).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Snackbar.make(view, "通过FAB显示的SnackBar", Snackbar.LENGTH_LONG).show();
}
});
findViewById(R.id.fab_show_cl_sb).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Snackbar.make(view, "SnackBar与FAB和CL一起使用", Snackbar.LENGTH_LONG).setAction("确定", new View.OnClickListener() {
@Override
public void onClick(View view) {
ToastUtils.showToast(SBActivity.this, "点击了确定");
}
}).show();
}
});
}
}
这里面Snackbar的使用和吐司差不多,但是可以设置Action。
实现效果图:
这里实现的比较简单,CoordinatorLayout我们后面会详细的介绍一次,SnackBar就简单介绍到这里了,附上SnackBar的国内镜像API,猛戳这里