下角动画旋转菜单、圆心弹出菜单ArcMenu 源码解析

支持类似Path的左下角动画旋转菜单及横向划出菜单、圆心弹出菜单

项目地址：https://github.com/daCapricorn/ArcMenu

 

一、关注3个效果

1. 点击中心控制点 的时候，展开效果：

• 中心控制点旋转45度的动画
• 周围children 弹出动画

     2.点击中心控制点的时候，收缩动画：

• 中心控制点旋转45度
• 周围children 自旋转并收缩

    3.展开时候，点击child

• 被点击的child放大，
• 其他chidren 消失

二、3个java文件

• ArcMenu.java  自定义View ，效果如图；主要有逻辑控制代码
• ArcLayout.java  A Layout that arranges its children around its center.主要有子view布局，展开、收缩的动画实现
• RotateAndTranslateAnimation.java  动画：控制objec产生位移，同时以object中心为轴心旋转。

 

三、展开和收缩代码实现

1. 点击中心控制点的时候，展开效果：

• 中心控制点旋转45度的动画
• 周围children 弹出动画

 

     2.点击中心控制点的时候，收缩动画：

• 中心控制点旋转45度
• 周围children 自旋转并收缩

先介绍三个重要的变量

private ArcLayout mArcLayout; //中心控制点图片

private ImageView mHintView; //当前状态: 是否已经展开；就像逻辑控制的开关一样，根据不同状态执行不同的动画效果

private boolean mExpanded = false;

 

ArcMenu.java中有这部分效果，实现代码

private void init(Context context) {
        LayoutInflater li = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        li.inflate(R.layout.arc_menu, this);

        mArcLayout = (ArcLayout) findViewById(R.id.item_layout);
        
        //中心控制点
        final ViewGroup controlLayout = (ViewGroup) findViewById(R.id.control_hint);
        controlLayout.setClickable(true);
        controlLayout.setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if (event.getAction() == MotionEvent.ACTION_DOWN) {
                    //中心控制点自旋转
                    mHintView.startAnimation(createHintSwitchAnimation(mArcLayout.isExpanded()));
                    //child 的收缩和展开
                    mArcLayout.switchState(true);
                }

                return false;
            }
        });

        mHintView = (ImageView) findViewById(R.id.control_hint);
    }

View Code