【Android动画九章】-浮动菜单

最新推荐文章于 2021-05-26 03:16:15 发布

yayun0516

最新推荐文章于 2021-05-26 03:16:15 发布

阅读量2.7k

点赞数 4

分类专栏： Android 文章标签： android 属性动画

本文链接：https://blog.csdn.net/yayun0516/article/details/51418167

版权

Android 专栏收录该内容

243 篇文章 4 订阅

订阅专栏

这篇博客详细介绍了如何使用Android属性动画实现浮动菜单功能。通过在 Framelayout 中叠加 ImageView 并设置动画，实现了菜单项的动态展开和收起效果。文章还提供了MainActivity.java中的关键代码段，演示了如何通过遍历ImageView并应用不同的位移和插值器来实现平滑动画。此外，博主分享了个人电子书的购买链接，供读者进一步学习Android知识。

摘要由CSDN通过智能技术生成

上几节讨论了各种各样的属性动画，这里将这些知识组合起来，模拟如下图所示的浮动菜单功能。
这里写图片描述
1.activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/img1"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="bottom|right"
        android:layout_margin="20dp"
        android:src="@drawable/pic1" />

    <ImageView
        android:id="@+id/img2"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="bottom|right"
        android:layout_margin="20dp"
        android:src="@drawable/pic2" />

    <ImageView
        android:id="@+id/img3"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="bottom|right"
        android:layout_margin="20dp"
        android:src="@drawable/pic3" />
    <ImageView
        android:id="@+id/img_more"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="bottom|right"
        android:layout_margin="20dp"
        android:src="@drawable/more" />
</FrameLayout>

父布局采用了FrameLayout布局方式，所有ImageView控件叠在一起放在右下角。
2.MainActivity.java:

package demo.androidwar.com.animatormenu;

import android.animation.ObjectAnimator;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.animation.BounceInterpolator;
import android.widget.ImageView;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    private ImageView imageView1, imageView2, imageView3, imageViewMore;
    private boolean isSelected = false;
    private List<View> list = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initViews();

    }

    private void initViews() {
        imageView1 = (ImageView) findViewById(R.id.img1);
        imageView2 = (ImageView) findViewById(R.id.img2);
        imageView3 = (ImageView) findViewById(R.id.img3);
        imageViewMore = (ImageView) findViewById(R.id.img_more);
        imageViewMore.setOnClickListener(this);
        imageView1.setOnClickListener(this);
        imageView2.setOnClickListener(this);
        imageView3.setOnClickListener(this);
        list.add(imageView1);
        list.add(imageView2);
        list.add(imageView3);
    }

    private void endAnimator() {
        isSelected = false;
        ObjectAnimator animator = ObjectAnimator.ofFloat(imageViewMore, "rotation", 0F, 360F).setDuration(300);
        animator.setInterpolator(new BounceInterpolator());//设置插值器
        animator.start();//开始动画
        for (int i = 0; i < 3; i++) {
            ObjectAnimator.ofFloat(list.get(i), "translationY", -200 * (i + 1), 0F).setDuration(1000).start();
        }
    }

    private void startAnimator() {
        isSelected = true;
        for (int i = 0; i < 3; i++) {
            ObjectAnimator animator = ObjectAnimator.ofFloat(list.get(i), "translationY", 0F, -200 * (i + 1)).setDuration(1000);
            animator.setInterpolator(new BounceInterpolator());//设置插值器
            animator.start();
        }
        ObjectAnimator.ofFloat(imageViewMore, "rotation", 0F, 360F).setDuration(300).start();

    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.img_more:
                if (!isSelected) {
                    startAnimator();
                } else {
                    endAnimator();
                }
                break;
            case R.id.img1:
                Toast.makeText(MainActivity.this, "img1", Toast.LENGTH_SHORT).show();
                break;
            case R.id.img2:
                Toast.makeText(MainActivity.this, "img2", Toast.LENGTH_SHORT).show();
                break;
            case R.id.img3:
                Toast.makeText(MainActivity.this, "img3", Toast.LENGTH_SHORT).show();
                break;
        }
    }
}