Android 悬浮按钮两种实现方法

最近android中有很多新的设计规范被引入，最流行的莫过于被称作Promoted Actions的设计了，Promoted Actions是指一种操作按钮，它不是放在actionbar中，而是直接在可见的UI布局中（当然这里的UI指的是setContentView所管辖的范围）。因此它更容易在代码中被获取到（试想如果你要在actionbar中获取一个菜单按钮是不是很难？），Promoted Actions往往主要用于一个界面的主要操作，比如在email的邮件列表界面，promoted action可以用于接受一个新邮件。promoted action在外观上其实就是一个悬浮按钮，更常见的是漂浮在界面上的圆形按钮，一般我直接将promoted action称作悬浮按钮，英文名称Float Action Button 简称（FAB，不是FBI哈）。

float action button是android l中的产物，但是我们也可以在更早的版本中实现。假设我这里有一个列表界面，我想使用floataction button代表添加新元素的功能，界面如下：

http://a3ab771892fd198a96736e50.javacodegeeks.netdna-cdn.com/wp-content/uploads/2014/09/android_floating_action_button_14.png

要实现float action button可以有多种方法，一种只适合android L，另外一种适合任意版本。

用ImageButton实现
这种方式其实是在ImageButton的属性中使用了android L才有的一些特性：

<ImageButtonandroid:layout_width="56dp"android:layout_height="56dp"android:src="@drawable/plus"android:layout_alignParentBottom="true"android:layout_alignParentRight="true"android:layout_marginRight="16dp"android:layout_marginBottom="16dp"android:tint="@android:color/white"android:id="@+id/fab"android:elevation="1dp"android:background="@drawable/ripple"android:stateListAnimator="@anim/fab_anim"/>

仔细一点，你会发现我们将这个ImageButton放到了布局的右下角，为了实现float action button应该具备的效果，需要考虑以下几个方面：

·Background

·Shadow

·Animation

背景上我们使用ripple drawable来增强吸引力。注意上面的xml代码中我们将background设置成了@drawable/ripple ，ripple drawable的定义如下：

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorControlHighlight"><item><shape android:shape="oval"><solid android:color="?android:colorAccent"
/></shape></item></ripple>

既然是悬浮按钮，那就需要强调维度上面的感觉，当按钮被按下的时候，按钮的阴影需要扩大，并且这个过程是渐变的，我们使用属性动画去改变translatioz。

<selector xmlns:android="http://schemas.android.com/apk/res/android"><itemandroid:state_enabled="true"android:state_pressed="true"><objectAnimatorandroid:duration="@android:integer/config_shortAnimTime"android:propertyName="translationZ"android:valueFrom="@dimen/start_z"android:valueTo="@dimen/end_z"android:valueType="floatType"
/></item><item><objectAnimatorandroid:duration="@android:integer/config_shortAnimTime"android:propertyName="translationZ"android:valueFrom="@dimen/end_z"android:valueTo="@dimen/start_z"android:valueType="floatType"
/></item></selector>

使用自定义控件的方式实现悬浮按钮
这种方式不依赖于android L，而是码代码。

首先定义一个这样的类：

public class CustomFAB extends ImageButton {...}
然后是读取一些自定义的属性（假设你了解styleable的用法）private void init(AttributeSet attrSet) {Resources.Theme theme = ctx.getTheme();TypedArray arr = theme.obtainStyledAttributes(attrSet, R.styleable.FAB, 0, 0);try
{setBgColor(arr.getColor(R.styleable.FAB_bg_color, Color.BLUE));setBgColorPressed(arr.getColor(R.styleable.FAB_bg_color_pressed, Color.GRAY));StateListDrawable sld = new
StateListDrawable();sld.addState(new
int[] {android.R.attr.state_pressed}, createButton(bgColorPressed));sld.addState(new
int[] {}, createButton(bgColor));setBackground(sld);}catch(Throwable t) {}finally {arr.recycle();}}

在xml中我们需要加入如下代码，一般是在attr.xml文件中。

<?xml version="1.0"
encoding="utf-8"?><resources><declare-styleable name="FAB"><!-- Background color --><attr name="bg_color"
format="color|reference"/><attr name="bg_color_pressed"
format="color|reference"/></declare-styleable></resources>

使用StateListDrawable来实现不同状态下的背景


private Drawable createButton(int color) {OvalShape oShape = new
OvalShape();ShapeDrawable sd = new
ShapeDrawable(oShape);setWillNotDraw(false);sd.getPaint().setColor(color);OvalShape oShape1 = new
OvalShape();ShapeDrawable sd1 = new
ShapeDrawable(oShape);sd1.setShaderFactory(new
ShapeDrawable.ShaderFactory() {@Overridepublic Shader resize(int width, int height) {LinearGradient lg = new
LinearGradient(0,0,0, height,new
int[] {Color.WHITE,Color.GRAY,Color.DKGRAY,Color.BLACK}, null, Shader.TileMode.REPEAT);return
lg;}});LayerDrawable ld = new
LayerDrawable(new
Drawable[] { sd1, sd });ld.setLayerInset(0, 5, 5, 0, 0);ld.setLayerInset(1, 0, 0, 5, 5);return
ld;}

最后将控件放xml中：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"xmlns:custom="http://schemas.android.com/apk/res/com.survivingwithandroid.fab"android:layout_width="match_parent"android:layout_height="match_parent"android:paddingLeft="@dimen/activity_horizontal_margin"android:paddingRight="@dimen/activity_horizontal_margin"android:paddingTop="@dimen/activity_vertical_margin"android:paddingBottom="@dimen/activity_vertical_margin"tools:context=".MyActivity">...<com.survivingwithandroid.fab.CustomFABandroid:layout_width="56dp"android:layout_height="56dp"android:src="@android:drawable/ic_input_add"android:layout_alignParentBottom="true"android:layout_alignParentRight="true"android:layout_marginRight="16dp"android:layout_marginBottom="16dp"custom:bg_color="@color/light_blue"android:tint="@android:color/white"/></RelativeLayout>

Android 悬浮按钮两种实现方法相关推荐

android studio gradle 自动更新,android studio gradle 两种更新方法更新
又快一年没有使用AS了,正好要查看一个Android项目代码,干脆升级到新版试试看新变化,旧版本为3.1.2,目前最新版本为3.4.2,AS的升级是很简单的直接update等待即可. 升级完了,打开G ...
Android 线程 thread 两种实现方法！
这篇文章中有三点需要提前说明一下, 一: 在android中有两种实现线程thread的方法: 一种是,扩展java.lang.Thread类另一种是,实现Runnable接口二: Thread类 ...
（最新react-native-0.59.5) 如何将ReactNative项目集成到现有得Android项目中（两种实现方法之一）
背景:最近在学习React-Native相关的知识,有个需求,如果已经存在一个成熟的Android 或者 IOS项目,如何实现在后续的开发中用RN来实现部分功能.再此我只是讲解一下Android de ...
android中view手势滑动冲突的两种解决方法
android中view手势滑动冲突的解决方法,主要解决方法有两种,外部和内部拦截.有需要的可以参考下. Android手势事件的冲突跟点击事件的分发过程息息相关,由三个重要的方法来共同完成,分别是: ...
android平板电脑的虚拟键盘,win10平板电脑不弹出虚拟键盘的两种解决方法
平板电脑升级到了最新版Windows10系统后,发现在开机的时候没有弹出虚拟键盘,这样就没办法打字了,此问题对我们来说其实是比较少见的,如果真的出现这样的情况怎么办?今天小编就为大家整理了win10平 ...
android 毫秒计时器,Android时分秒计时器的两种实现方法
可能我们在开发中会时常用到计时器这玩意儿,比如在录像的时候,我们可能需要在右上角显示一个计时器.这个东西其实实现起来非常简单. 只需要用一个控件Chronometer,是的,就这么简单,我都不好意思讲 ...
Android之AsyncTask两种线程池分析和总结
Android AsyncTask两种线程池分析和总结 (一) 前言在android AsyncTask里面有两种线程池供我们调用 1． THREAD_POOL_EXECUTOR, 异步 ...
android中资源文件的两种访问方式,Android_Android学习笔记-保存文件（Saving Files），Android设备有两种文件存储区域 - phpStudy...
Android学习笔记-保存文件(Saving Files) Android设备有两种文件存储区域: 内部存储和外部存储 ("internal" and "externa ...
w ndows10怎么联网,windows10所有uwp应用都无法联网的两种解决方法
使用win10系统的用户变得越来越多了,因为他们反馈的电脑问题也变多了.比如,近期一位使用win10系统的的用户遇到了电脑所有uwp应用全部无法联网的问题,桌面应用都可以正常上网,这是怎么回事呢?接下 ...
Win10禁用管理员帐户后无法进入的两种解决方法
使用过Windows10系统的朋友都知道,它的默认用户账户是Administrator账户,因为这样操作起来会更方便.不过,一位朋友表示自己不小心将Administrator管理员账户给禁用了,导致无 ...

Android 悬浮按钮两种实现方法

Android 悬浮按钮两种实现方法相关推荐

最新文章

热门文章

Android 悬浮按钮 两种实现方法

Android 悬浮按钮 两种实现方法相关推荐

最新文章

热门文章

Android 悬浮按钮两种实现方法

Android 悬浮按钮两种实现方法相关推荐