Day6补间动画中两种菜单的实现

1.普通带旋转回弹的菜单

image.png

image.png

1.导入素材

2.activity_main.xml配置

3.btn_style.xml

4.MainActivity

public class MainActivity extends AppCompatActivity {

    private int[] resId = {R.id.b, R.id.c, R.id.d, R.id.e};
    private boolean isOpen = false;

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

    private void initView() {
        //给菜单按钮添加点击事件
        ImageButton menu = findViewById(R.id.a);
        menu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //遍历数组 取出每一个按钮
                for (int i = 0; i < resId.length; i++) {

                    //判断是打开 还是关闭
                    if (isOpen == true) {
                        //之前是打开 现在需要关闭
                        close(i);
                    } else {
                        //之前是关闭的 现在需要打开
                        open(i);
                    }
                }

                isOpen = !isOpen;
            }
        });
    }

    public void open(int i) {
        animate(i, true);
    }

    public void close(int i) {
        animate(i, false);
    }

    public void animate(int i, boolean state) {
        //计算平分之后的两个之间的角度
        double angle = (Math.PI / (resId.length + 1));

        //获取id对应控件
        ImageButton ib = findViewById(resId[i]);

        //计算当前控件对应的角度
        double mAngle = (i + 1) * angle;

        //计算x距离
        float x = (float) (Math.cos(mAngle) * 400);
        //计算y距离
        float y = (float) (Math.sin(mAngle) * 400);

        float startx;
        float tox;
        float starty;
        float toy;
        Interpolator interpolator;
        if (state == true) {
            startx = 0;
            starty = 0;
            tox = x;
            toy = -y;
            interpolator = new BounceInterpolator();
        } else {
            startx = x;
            starty = -y;
            tox = 0;
            toy = 0;
            interpolator = new AnticipateInterpolator();
        }

        //移动的动画
        TranslateAnimation tAnim = new TranslateAnimation(
                startx, tox, starty, toy);
        tAnim.setDuration(500);
        tAnim.setInterpolator(interpolator);

        //旋转动画
        RotateAnimation rAnim = new RotateAnimation(0, 360 * 3,
                Animation.RELATIVE_TO_SELF, 0.5f,
                Animation.RELATIVE_TO_SELF, 0.5f);
        rAnim.setDuration(500);

        //创建一个AnimationSet集合 包裹多个动画
        AnimationSet set = new AnimationSet(false);
        set.setFillAfter(true);
        set.addAnimation(rAnim);
        set.addAnimation(tAnim);

        //开始动画
        ib.startAnimation(set);
    }
}

2.有层级的菜单

image.png

image.png

image.png

1.导入素材

2.activity_main.xml配置

3.管理旋转的xml文件

rotate_in_anim.xml

rotate_out_anim.xml

4.MainActivity

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    //记录第三层菜单的状态
    private boolean islevel3Open = true;
    private boolean islevel2Open=true;
    private RelativeLayout level3;
    private RelativeLayout level2;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //加载容器
        level3 = findViewById(R.id.rl_level3);
        level2=findViewById(R.id.rl_level2);
        //menu按钮
        ImageButton menu = findViewById(R.id.ib_menu);
        ImageButton home=findViewById(R.id.ib_home);
        //添加点击事件
        menu.setOnClickListener(this);
        home.setOnClickListener(this);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.ib_menu:
                if (islevel3Open) {
                    //关闭
                    close(level3,0);
                } else {
                    open(level3);
                }
                islevel3Open = !islevel3Open;
                break;
            case R.id.ib_home:
                if(islevel3Open){
                    //关闭第三层菜单
                    close(level3,0);
                    islevel3Open=false;
                }if(islevel2Open){
                    close(level2,100);
            }else{
                    open(level2);
            }
                islevel2Open=!islevel2Open;


                break;
            default:
                break;
        }
    }

    public void open(RelativeLayout rl) {

        Animation in = AnimationUtils.loadAnimation(this, R.anim.rotate_in_anim);
rl.startAnimation(in);
//子控件可点击
        changeState(rl,true);
    }

    public void close(RelativeLayout rl,long delay ) {
 Animation out=AnimationUtils.loadAnimation(this,R.anim.rotate_out_anim);
 out.setStartOffset(delay);
 rl.startAnimation(out);
 //子控件不可点击
        changeState(rl,false);
    }
public  void changeState(RelativeLayout rl,boolean enable){

    //1.获取容器子控件的个数
    int childCount=rl.getChildCount();
    //2.遍历容器的子控件
    for (int i = 0; i 

心得

更加熟悉了补间动画，对控件相关属性的控制也变得更加了解