Androidfloatingactionbutton详解

Androidfloatingactionbutton是一种圆形带有图标的简易浮动按钮，通过点击它可以执行某些操作。本文将从多个方面介绍androidfloatingactionbutton的使用方法，包括布局、样式、监听事件、动画效果等。

一、布局

1、将androidfloatingactionbutton添加到布局中：

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    app:elevation="6dp"
    app:pressedTranslationZ="12dp"
    app:layout_anchor="@id/bottomNavigationView"
    app:layout_anchorGravity="bottom|end" />

其中，app:elevation和app:pressedTranslationZ是用于设置按钮的阴影效果，在材料设计中，可视阴影是一个很重要的概念。app:layout_anchor和app:layout_anchorGravity是用于设置floating action button的位置，可以将它放置在布局的底部中心。

2、使用CoordinatorLayout布局：

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/coordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        app:theme="@style/AppTheme.AppBarOverlay">
        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />
    </android.support.design.widget.AppBarLayout>
    <include layout="@layout/content_main" />
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_add"
        app:layout_anchor="@id/content_main"
        app:layout_anchorGravity="bottom|end" />
</android.support.design.widget.CoordinatorLayout>

使用CoordinatorLayout让floating action button接管了整个页面，它可以让悬浮按钮与界面其它元素进行交互，从而实现一些令人惊讶的效果。

二、样式

1、背景颜色：

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    android:backgroundTint="@color/colorPrimary"
    app:elevation="6dp"
    app:pressedTranslationZ="12dp"
    app:layout_anchor="@id/bottomNavigationView"
    app:layout_anchorGravity="bottom|end" />

使用android:backgroundTint属性可以设置floating action button的背景颜色。

2、图标：

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    android:tint="@color/colorIcon"
    app:elevation="6dp"
    app:pressedTranslationZ="12dp"
    app:layout_anchor="@id/bottomNavigationView"
    app:layout_anchorGravity="bottom|end" />

使用android:tint属性可以为图标设置颜色。

三、监听事件

1、点击事件：

floatingActionButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        //在按钮被点击时执行的代码
    }
});

2、长按事件：

floatingActionButton.setOnLongClickListener(new View.OnLongClickListener() {
    @Override
    public boolean onLongClick(View view) {
        //在按钮被长按时执行的代码
        return true;
    }
});

3、动态改变按钮图标：

floatingActionButton.setImageResource(R.drawable.ic_alarm);

4、动态改变按钮颜色：

floatingActionButton.setBackgroundTintList(ColorStateList.valueOf(getResources().getColor(R.color.colorAccent)));

四、动画效果

1、隐藏：

floatingActionButton.hide();

2、显示：

floatingActionButton.show();

3、移动：

floatingActionButton.animate().x(100).y(200).setDuration(1000);

4、缩放：

floatingActionButton.animate().scaleX(2).scaleY(2).setDuration(1000);

5、旋转：

floatingActionButton.animate().rotation(360).setDuration(1000);

五、总结

本文详细介绍了androidfloatingactionbutton的使用方法，包括布局、样式、监听事件、动画效果等。希望对读者有所帮助。