Demo4 告别Toast:精致的Snackbar
在我之前学习android的很长一段时间内,Toast是用来提示信息的重要手段,想必你也跟我一样。今天我们将来学习新的用来提示信息的组件Snackbar,今后就让我们告别Toast。
Snackbar也是design support library的组件,使用之前导入design库即可。Snackbar这个组件是在屏幕的底部一个微小的黑色条显示着一条简短的消息,用法跟Toast类似,但是他们有着不同的概念,Snackbar不同于 Toast,它的表现是作为 UI 的一部分而不是覆盖在屏幕上。今天我们在布局中只放置一个Button,当我们点击Button时,显示Actionbar。我们可以通过下面代码来唤起Snackbar:
Snackbar.make((LinearLayout)findViewById(R.id.Mainlayout), //注意,因为Snackbar是布局的一部分,所以要指定其所属布局或组件,这里我们指定其为主布局
"Hello I am Snackbar",
Snackbar.LENGTH_SHORT).show();
这样的SnackBar太单调了不是吗。接下来我们要给我们的SnackBar加上一个action,也就是像下面这样,在Snackbar右侧有一个可以点击的标签,就像Button,当你点击他,便可以响应按下消息,当然你要事先实现这个点击事件的监听器。
这个内容对你来说肯定也很简单,就直接上代码(我们在其点击事件中使用了Toast…):
Snackbar.make((LinearLayout)findViewById(R.id.Mainlayout), //注意,因为Snackbar是布局的一部分,所以要指定其所属布局或组件,这里我们指定其为主布局
"Hello I am Snackbar",
Snackbar.LENGTH_SHORT).setAction("Click me!", new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "T.T", Toast.LENGTH_SHORT).show();
}
}).show();
顺带一提,在Snackbar的make方法中,第三个参数如果设置为Snackbar.LENGTH_INDEFINITE,表示点击事件发生后才撤销Snackbar。
鉴于今天内容比较轻松,接下来就再给大家补个课。现在我们先把FloatActionButton加到布局底端,哈?就这样而已是了。接下来我们再运行程序。有没有觉得什么不妥。咦?FloatActionButton被遮住了:
这是非常不好的用户体验,那我们有办法解决吗。答案是肯定的,要借助design组件库的新布局:CoordinationLayout。故名思意,这个布局会自动调整其内容布局的位置以达到协同工作的效果。方法很简单,直接将我们之前的布局改成CoordinationLayout就行了,最后的布局文件如下:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/Mainlayout"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="25dp"
android:text="Demo Snackbar"
android:gravity="center"/>
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="show a Snckbar" />
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:src="@android:drawable/ic_dialog_email"/>
</android.support.design.widget.CoordinatorLayout>
直接运行程序,奇迹就发生了。直接上图:
Demo源码下载地址:Demo4:SnackBar