android扇形动画弹出icon的功能

1，设置布局

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentRight="true"
    android:layout_alignParentBottom="true"
    android:layout_marginRight="12dp"

 >
<RelativeLayout
    android:id="@+id/rel_diaocha"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_alignParentRight="true"
    android:layout_alignParentBottom="true"
    android:background="@drawable/icon_tibao_bg"
    android:layout_marginBottom="200dp"
    android:visibility="gone"
    >
    <TextView
        android:id="@+id/iv_icon1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableTop="@drawable/icon_tibao_diaocha"
        android:text="调查"
        android:textSize="10sp"
        android:textColor="@color/white"
        android:layout_centerInParent="true"
        />
</RelativeLayout>

<RelativeLayout
    android:id="@+id/rel_kaoshi"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_alignParentRight="true"
    android:layout_alignParentBottom="true"
    android:background="@drawable/icon_tibao_bg"
    android:layout_marginBottom="200dp"
    android:visibility="gone"
    >
    <TextView
        android:id="@+id/iv_icon2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableTop="@drawable/icon_tibao_kaoshi"
        android:text="考试"
        android:textSize="10sp"
        android:textColor="@color/white"
        android:layout_centerInParent="true"
        />
</RelativeLayout>

<RelativeLayout
    android:id="@+id/rel_toupiao"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_alignParentRight="true"
    android:layout_alignParentBottom="true"
    android:background="@drawable/icon_tibao_bg"
    android:layout_marginBottom="200dp"
    android:visibility="gone"
    >
    <TextView
        android:id="@+id/iv_icon3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableTop="@drawable/icon_tibao_toupiao"
        android:text="投票"
        android:textSize="10sp"
        android:textColor="@color/white"
        android:layout_centerInParent="true"
        />
</RelativeLayout>

    <RelativeLayout
        android:id="@+id/rel_biaodan"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="200dp"
        android:background="@drawable/icon_tibao_bg"
        android:visibility="gone"
        >

        <TextView
            android:id="@+id/iv_icon4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:drawableTop="@drawable/icon_tibao_biaodan"
            android:text="表单"
            android:textColor="@color/white"
            android:textSize="10sp" />
    </RelativeLayout>

    <ImageView
        android:id="@+id/iv_start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="200dp"
        />
   <!-- android:background="@drawable/icon_tibao_start"-->
</RelativeLayout>

2，动画设置

2.1 打开动画的方法；

private void showIcon() {

    //设置动画时间
    int duration = 1000;
    //动画距离,屏幕宽度的60%
    float distance = getScreenWidth() * 0.1f;
    float distance2 = getScreenWidth() * 0.3f;
    //相邻ImageView运动角度式22.5度
    float angle0 = (float) (90f * Math.PI / 180);//调查
    float angle1 = (float) (150f * Math.PI / 180);//考试
    float angle2 = (float) (210f * Math.PI / 180);//投票
    float angle3 = (float) (270f * Math.PI / 180);//表单

    //icon1
    ///  PropertyValuesHolder p1 = PropertyValuesHolder.ofFloat("TranslationX", 0f, distance);
    //icon2
    PropertyValuesHolder p1 = PropertyValuesHolder.ofFloat("TranslationX", 0f, (float) (distance2 * Math.cos(angle0)));
    PropertyValuesHolder p12 = PropertyValuesHolder.ofFloat("TranslationY", 0f, -(float) (distance2 * Math.sin(angle0)));
    //icon2
    PropertyValuesHolder p21 = PropertyValuesHolder.ofFloat("TranslationX", 0f, (float) (distance2 * Math.cos(angle1)));
    PropertyValuesHolder p22 = PropertyValuesHolder.ofFloat("TranslationY", 0f, -(float) (distance2 * Math.sin(angle1)));
    //icon3
    PropertyValuesHolder p31 = PropertyValuesHolder.ofFloat("TranslationX", 0f, (float) (distance2 * Math.cos(angle2)));
    PropertyValuesHolder p32 = PropertyValuesHolder.ofFloat("TranslationY", 0f, -(float) (distance2 * Math.sin(angle2)));
    //icon4
    PropertyValuesHolder p41 = PropertyValuesHolder.ofFloat("TranslationX", 0f, (float) (distance2 * Math.cos(angle3)));
    PropertyValuesHolder p42 = PropertyValuesHolder.ofFloat("TranslationY", 0f, -(float) (distance2 * Math.sin(angle3)));
    //icon5
    //  PropertyValuesHolder p5 = PropertyValuesHolder.ofFloat("TranslationY", 0f, -distance);

    ObjectAnimator animator1 = ObjectAnimator.ofPropertyValuesHolder(relDiaocha, p1, p12).setDuration(duration);
    ObjectAnimator animator2 = ObjectAnimator.ofPropertyValuesHolder(relKaoshi, p21, p22).setDuration(duration);
    ObjectAnimator animator3 = ObjectAnimator.ofPropertyValuesHolder(relToupiao, p31, p32).setDuration(duration);
    ObjectAnimator animator4 = ObjectAnimator.ofPropertyValuesHolder(relBiaodan, p41, p42).setDuration(duration);
    //  ObjectAnimator animator5 = ObjectAnimator.ofPropertyValuesHolder(relBiaodan, p5).setDuration(duration);

    //添加自由落体效果插值器
    animator1.setInterpolator(new BounceInterpolator());
    animator2.setInterpolator(new BounceInterpolator());
    animator3.setInterpolator(new BounceInterpolator());
    animator4.setInterpolator(new BounceInterpolator());
    //  animator5.setInterpolator(new BounceInterpolator());

    //启动动画
    animator1.start();
    animator2.start();
    animator3.start();
    animator4.start();
    //   animator5.start();
}

2.2 关闭动画的方法

/**
 * /**
 * * 动画实现，因为除了沿X,Y轴的图标，另外3个都有角度，所有，要有三角函数计算
 * * 使图标位移距离相等，实现扇形效果
 */

private void closeIcon() {

    //设置动画时间
    int duration = 1000;
    //动画距离,屏幕宽度的60%
    float distance2 = getScreenWidth() * 0.3f;
    //相邻ImageView运动角度式22.5度
    float angle0 = (float) (90f * Math.PI / 180);//调查
    float angle1 = (float) (150f * Math.PI / 180);//考试
    float angle2 = (float) (210f * Math.PI / 180);//投票
    float angle3 = (float) (270f * Math.PI / 180);//表单

    //icon1
    ///  PropertyValuesHolder p1 = PropertyValuesHolder.ofFloat("TranslationX", 0f, distance);
    //icon2
    PropertyValuesHolder p1 = PropertyValuesHolder.ofFloat("TranslationX", (float) (distance2 * Math.cos(angle0)), 0f);
    PropertyValuesHolder p12 = PropertyValuesHolder.ofFloat("TranslationY", -(float) (distance2 * Math.sin(angle0)), 0f);
    //icon2
    PropertyValuesHolder p21 = PropertyValuesHolder.ofFloat("TranslationX", (float) (distance2 * Math.cos(angle1)), 0f);
    PropertyValuesHolder p22 = PropertyValuesHolder.ofFloat("TranslationY", -(float) (distance2 * Math.sin(angle1)), 0f);
    //icon3
    PropertyValuesHolder p31 = PropertyValuesHolder.ofFloat("TranslationX", (float) (distance2 * Math.cos(angle2)), 0f);
    PropertyValuesHolder p32 = PropertyValuesHolder.ofFloat("TranslationY", -(float) (distance2 * Math.sin(angle2)), 0f);
    //icon4
    PropertyValuesHolder p41 = PropertyValuesHolder.ofFloat("TranslationX", (float) (distance2 * Math.cos(angle3)), 0f);
    PropertyValuesHolder p42 = PropertyValuesHolder.ofFloat("TranslationY", -(float) (distance2 * Math.sin(angle3)), 0f);
    //icon5
    //  PropertyValuesHolder p5 = PropertyValuesHolder.ofFloat("TranslationY", 0f, -distance);

    ObjectAnimator animator1 = ObjectAnimator.ofPropertyValuesHolder(relDiaocha, p1, p12).setDuration(duration);
    ObjectAnimator animator2 = ObjectAnimator.ofPropertyValuesHolder(relKaoshi, p21, p22).setDuration(duration);
    ObjectAnimator animator3 = ObjectAnimator.ofPropertyValuesHolder(relToupiao, p31, p32).setDuration(duration);
    ObjectAnimator animator4 = ObjectAnimator.ofPropertyValuesHolder(relBiaodan, p41, p42).setDuration(duration);
    //  ObjectAnimator animator5 = ObjectAnimator.ofPropertyValuesHolder(relBiaodan, p5).setDuration(duration);

    //添加自由落体效果插值器
    animator1.setInterpolator(new BounceInterpolator());
    animator2.setInterpolator(new BounceInterpolator());
    animator3.setInterpolator(new BounceInterpolator());
    animator4.setInterpolator(new BounceInterpolator());
    //  animator5.setInterpolator(new BounceInterpolator());

    //启动动画
    animator1.start();
    animator2.start();
    animator3.start();
    animator4.start();
    //   animator5.start();
}

3，点击触发动画

@Override
public void onClick(View v) {

//点击最外层icon，展开icon动画
if (isOpen) { //打开状态
    //关闭
    ivStart.setBackgroundResource(R.drawable.icon_tibao_start);
    relBiaodan.setVisibility(View.GONE);
    relDiaocha.setVisibility(View.GONE);
    relKaoshi.setVisibility(View.GONE);
    relToupiao.setVisibility(View.GONE);
    closeIcon();
    isOpen = false;
} else {//关闭状态
    //打开
    ivStart.setBackgroundResource(R.drawable.icon_tibao_end);
    relBiaodan.setVisibility(View.VISIBLE);
    relDiaocha.setVisibility(View.VISIBLE);
    relKaoshi.setVisibility(View.VISIBLE);
    relToupiao.setVisibility(View.VISIBLE);
    showIcon();
    isOpen = true;
}

最后效果：

android扇形动画弹出icon的功能

android扇形动画弹出icon的功能

继续阅读

专访邓凡平：深入理解Android

与专家面对面：Android开发入门问与答

Android MVP架构MVCMVP

mvp初探

Android常用工具类简介目录

android常用工具类转载自：http://www.trinea.cn/android/android-common-utils/Android常用工具类

Android常用工具类ToastUtilsSizeUtilsLogUtilsRetrofitManagerAnimUtil

Android Studio 0.8.0解决 Failure [INSTALL_FAILED_OLDER_SDK] 问题

Android – ListView 中添加按钮，动态删除添加ItemView的操作

Kotlin的ListView与RecyclerView的简单应用

关于公司的那些坑：Android Studio篇

android SQLite事务和kotlin协程

无法正常编译错误Compilation failed to complete

关于Gradle配置的小结

AOP编程_Android优雅权限框架(1)概念基础，2021金三银四前言正文大纲正文

Android APK文件反编译Android APK文件反编译