一、悬浮按钮

FloatingActionButton是Design Support中的一个控件,它会默认colorAccent作为按钮的颜色,还可以给按钮一个图标。

这是没有图标的,这是有图标的

然后布局文件这样写:

<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="16dp"
android:src="@drawable/ic_done"
app:elevation="8dp"/>

layout_gravity的属性值bottomb表示在底部,end会根据系统确定是在左下还是右下。elevation表示按钮的悬浮高度,属性值越大,阴影就越小。。。其实区别并不大,平时用默认的就好了。

然后是按钮响应:

//悬浮按钮
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(MainActivity.this,"你点击了悬浮按钮",Toast.LENGTH_SHORT).show();
}
});

和普通按钮差不多。。

然后通过drawable来实现一个简单的阴影效果:

  在drawable创建一个fab.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<layer-list>
<!-- Shadow -->
<item android:top="1dp" android:right="1dp">
<layer-list>
<item>
<shape android:shape="oval">
<solid android:color="#08000000"/>
<padding
android:bottom="3px"
android:left="3px"
android:right="3px"
android:top="3px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#09000000"/>
<padding
android:bottom="2px"
android:left="2px"
android:right="2px"
android:top="2px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#10000000"/>
<padding
android:bottom="2px"
android:left="2px"
android:right="2px"
android:top="2px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#11000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#12000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#13000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#14000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#15000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#16000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
</layer-list>
</item> <!-- Blue button pressed -->
<item>
<shape android:shape="oval">
<solid android:color="#90CAF9"/>
</shape>
</item>
</layer-list>
</item> <item android:state_enabled="true"> <layer-list>
<!-- Shadow -->
<item android:top="2dp" android:right="1dp">
<layer-list>
<item>
<shape android:shape="oval">
<solid android:color="#08000000"/>
<padding
android:bottom="4px"
android:left="4px"
android:right="4px"
android:top="4px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#09000000"/>
<padding
android:bottom="2px"
android:left="2px"
android:right="2px"
android:top="2px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#10000000"/>
<padding
android:bottom="2px"
android:left="2px"
android:right="2px"
android:top="2px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#11000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#12000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#13000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#14000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#15000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#16000000"/>
<padding
android:bottom="1px"
android:left="1px"
android:right="1px"
android:top="1px"
/>
</shape>
</item>
</layer-list>
</item> <!-- Blue button --> <item>
<shape android:shape="oval">
<solid android:color="#03A9F4"/>
</shape>
</item>
</layer-list> </item> </selector>

  然后在悬浮按钮布局文件这里加上属性:background

        <android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/fab"
android:layout_gravity="bottom|end"
android:layout_margin="16dp"
android:src="@drawable/ic_done"
app:elevation="8dp"/>

二、Snackbar

  和Toast一样用于提示的,但是它的提示当中有一个按钮,具体用法和效果就是:

        //悬浮按钮
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Snackbar.make(view,"这是一个提醒", Snackbar.LENGTH_SHORT)
.setAction("可点", new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(MainActivity.this,"你点了",Toast.LENGTH_SHORT).show();
}
})
.show();
}
});

调用make()方法创建一个对象,第一个参数是当前布局的任意一个View,另外两个参数和Toast一样。setAction就是那个可以点击的按钮的设定,第一个参数是按钮的内容,然后就是响应了。

三、CoordinatorLayout

  可以用来替换原来的FrameLayout,它可以监听各个子控件的各种事件,自动 做出合理的响应。

  例如,把上面的布局文件修改成这样:

    <android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"> <android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/> <android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/fab"
android:layout_gravity="bottom|end"
android:layout_margin="16dp"
android:src="@drawable/ic_done"
app:elevation="8dp"/> </android.support.design.widget.CoordinatorLayout>

重新点击一下悬浮按钮:

之前Snackbar出现的时候会挡住这个悬浮按钮,从FrameLayout改成CoordinatorLayout就不会了。

android ——悬浮按钮及可交互提示的更多相关文章

  1. android悬浮按钮(Floating action button)的两种实现方法

    原文: http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1028/1857.html 最近android中有很多新的设计规范被引入 ...

  2. Android用悬浮按钮实现翻页效果

    今天给大家分享下自己用悬浮按钮点击实现翻页效果的例子. 首先,一个按钮要实现悬浮,就要用到系统顶级窗口相关的WindowManager,WindowManager.LayoutParams.那么在An ...

  3. Android 5.0新控件——FloatingActionButton(悬浮按钮)

    Android 5.0新控件--FloatingActionButton(悬浮按钮) FloatingActionButton是5.0以后的新控件,一个悬浮按钮,之所以叫做悬浮按钮,主要是因为自带阴影 ...

  4. 013 Android ActionFloatingButton悬浮按钮组件与Snackbar组件使用

    1.导入ActionFloatingButton组件(点击下载按钮,安装组件) 2,.ImageView图片XML设置 <ImageView android:id="@+id/imag ...

  5. Android FloatingActionButton(FAB) 悬浮按钮

    FloatingActionButton 悬浮按钮                                                                            ...

  6. FloatingActionButtonDemo【悬浮按钮的使用,顺带snackBar的使用】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 FloatingActionButton简称FAB. 一. 对于App或某个页面中是否要使用FloatingActionButton ...

  7. Android客户端与服务端交互之登陆示例

    Android客户端与服务端交互之登陆示例 今天了解了一下android客户端与服务端是怎样交互的,发现其实跟web有点类似吧,然后网上找了大神的登陆示例,是基于IntentService的 1.后台 ...

  8. FloatingActionButton(悬浮按钮)使用学习<一>

      FloatingActionButton简称FAB.   一. 对于App或某个页面中是否要使用FloatingActionButton必要性:     FAB代表一个App或一个页面中最主要的操 ...

  9. Android悬浮窗及其拖动事件

    主页面布局很简单,只有一个RelativelyLayout <?xml version="1.0" encoding="utf-8"?> <R ...

随机推荐

  1. 修改SearchBar的取消按钮Cancel为中文

    一开始在网上看到很多方法都是循环,好吧,我也循环 创建UISearchBar的时候循环,不行 用searchBarTextDidBeginEditing事件去循环,也不行 无语了,搜索了Baidu第一 ...

  2. NetCore AutoMapper的封装

     需要引用AutoMapper的Nuget包  如果需要忽略某个字段就在字段上面打标签如下:  [IgnoreMap] public string IgnoreValue { get; set; } ...

  3. AWS S3 上传文件

    一.获取签名的URL 通过后端给的接口拿到已经签名好的文件上传的URL地址 二.读取文件(注:AWS 接受的二进制,不能使用form-data) // 获取文件二进制 getFileMd5 = (ke ...

  4. P2344 奶牛抗议 离散化+前缀和+动态规划+树状数组

    [题目背景] Generic Cow Protests, 2011 Feb [题目描述] 约翰家的N 头奶牛正在排队游行抗议.一些奶牛情绪激动,约翰测算下来,排在第i 位的奶牛的理智度为Ai,数字可正 ...

  5. activiti学习笔记

    activiti入门 activiti官网 pom.xml文件 xml <!-- activiti --> <dependency> <groupId>org.ac ...

  6. 版本管理--svn解决代码冲突

    高级的svn解决冲突的方法: 选择正在冲突的文件,右键,选择Edit confilicts,这时候出现一个弹框, 看你实际的需要用自己的代码,还是用同事的代码,或者合并起来.最后点击Mark as r ...

  7. Hamcrest的简单应用

    import org.junit.Before; import org.junit.Ignore; import org.junit.Test; import java.util.ArrayList; ...

  8. JQuery学习笔记(3)——节点操作 节点查找

    插入节点 内部插入 所谓的内部插入,就是指在节点里面的插入,而外部插入,则是在节点外面插入. append() prepend() appendTo() prependTo() append和prep ...

  9. Scrum 使用絮叨

    关于Scrum 的一些絮叨 Scrum 的推行的基础在于全员参与,全员协作,包含Dev, QA(quality assurance) ,BA(Business analyst)以及Supporter ...

  10. Python趣用—配平化学方程式

    不知不觉已经毕业多年了,不知道大家是否还记得怎么配平化学方程式呢?反正小编我是已经记不太清了,所以今天的文章除了分享如何用python配平化学方程式,顺带着还会复习 一些化学方程式的知识,希望广大化学 ...