美文网首页
一个点击展开的控件

一个点击展开的控件

作者: 梧桐树下承诺 | 来源:发表于2017-01-04 15:58 被阅读28次
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                    android:id="@+id/widget33"
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent">
        <ImageView
            android:id="@+id/img_menu"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="10dp"
            android:src="@drawable/set_icon_3"/>
    
        <ImageView
            android:id="@+id/img_menu1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="10dp"
            android:src="@drawable/set_icon_4"
            android:visibility="gone"/>
    
        <ImageView
            android:id="@+id/img_menu2"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="10dp"
            android:src="@drawable/set_icon_1"
            android:visibility="gone"/>
    
        <ImageView
            android:id="@+id/img_menu3"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="10dp"
            android:src="@drawable/set_icon_4"
            android:visibility="gone"/>
    
        <ImageView
            android:id="@+id/img_menu4"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="10dp"
            android:src="@drawable/set_icon_1"
            android:visibility="gone"/>
    
        <ImageView
            android:id="@+id/img_menu5"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="10dp"
            android:src="@drawable/set_icon_4"
            android:visibility="gone"/>
    
    </RelativeLayout>
    

    这个是自定义类

    public class ArcMenu {
        private Activity context;
        private int[] imageRes;
        private List<ImageView> imageViewList = new ArrayList<>();
        private boolean isShowMenu = false;
        int radius = 180;
        double angle;
        public ArcMenu(Activity context, int[] imageRes) {
            angle = Math.PI / 2 / (imageRes.length - 2);
            radius = Tool.dip2px(context, radius);
            this.context = context;
            this.imageRes = imageRes;
            for (int imagRe : imageRes) {
                ImageView imageView = (ImageView) context.findViewById(imagRe);
                imageViewList.add(imageView);
            }
        }
    
        private void openMenu() {
            isShowMenu = true;
            setItemVisible(true);
            ObjectAnimator animator1;
            ObjectAnimator animator2;
            List<ObjectAnimator> objectAnimators = new ArrayList<>();
            AnimatorSet set = new AnimatorSet();
    
            for (int i = 1; i < imageRes.length; i++) {
                animator1 = ObjectAnimator.ofFloat(imageViewList.get(i), "translationX", (float) (-radius * Math.sin(angle * (i - 1))));
                animator2 = ObjectAnimator.ofFloat(imageViewList.get(i), "translationY", (float) (-radius * Math.cos(angle * (i - 1))));
                objectAnimators.add(animator1);
                objectAnimators.add(animator2);
            }
    
            for (int i = 0; i < objectAnimators.size(); i++) {
                set.playTogether(objectAnimators.get(i));
            }
            set.setDuration(200);
            set.start();
            //第0个图标,菜单图标,加入动画
            ObjectAnimator.ofFloat(imageViewList.get(0), "rotation", 0, 135f).setDuration(200).start();
        }
    
        private void closeMenu() {
            isShowMenu = false;
            ObjectAnimator animator1 = null;
            ObjectAnimator animator2;
            List<ObjectAnimator> objectAnimators = new ArrayList<>();
            AnimatorSet set = new AnimatorSet();
    
            for (int i = 1; i < imageRes.length; i++) {
                animator1 = ObjectAnimator.ofFloat(imageViewList.get(i), "translationX", 0);
                animator2 = ObjectAnimator.ofFloat(imageViewList.get(i), "translationY", 0);
                objectAnimators.add(animator1);
                objectAnimators.add(animator2);
            }
    
            animator1.addListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    setItemVisible(false);
                    super.onAnimationEnd(animation);
                }
            });
    
            for (int i = 0; i < objectAnimators.size(); i++) {
                set.playTogether(objectAnimators.get(i));
            }
    
            set.setDuration(200);
            set.start();
            ObjectAnimator.ofFloat(imageViewList.get(0), "rotation", 135f, 0).setDuration(200).start();
        }
    
        public void switchMenu() {
            if (isShowMenu) {
                closeMenu();
            } else {
                openMenu();
            }
        }
    
        public void clickItem() {
            setItemVisible(false);
            closeMenu();
        }
    
        private void setItemVisible(boolean isVisible) {
            for (int i = 1; i < imageRes.length; i++) {
                if (isVisible) {
                    imageViewList.get(i).setVisibility(View.VISIBLE);
                } else {
                    imageViewList.get(i).setVisibility(View.GONE);
                }
            }
        }
    }
    

    MainActivity类是这样的.

    public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    
        private ArcMenu mArcMenu;
        private int[] imageRes = {R.id.img_menu, R.id.img_menu1,
                R.id.img_menu2, R.id.img_menu3, R.id.img_menu4, R.id.img_menu5};
    
        private ImageView mImgMenu;
        private ImageView mImgMenu1;
        private ImageView mImgMenu2;
        private ImageView mImgMenu3;
        private ImageView mImgMenu4;
        private ImageView mImgMenu5;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            mArcMenu = new ArcMenu(this, imageRes);
            mImgMenu = (ImageView) findViewById(R.id.img_menu);
    
            mImgMenu1 = (ImageView) findViewById(R.id.img_menu1);
            mImgMenu2 = (ImageView) findViewById(R.id.img_menu2);
            mImgMenu3 = (ImageView) findViewById(R.id.img_menu3);
            mImgMenu4 = (ImageView) findViewById(R.id.img_menu4);
            mImgMenu5 = (ImageView) findViewById(R.id.img_menu5);
    
            mImgMenu.setOnClickListener(this);
            mImgMenu1.setOnClickListener(this);
            mImgMenu2.setOnClickListener(this);
            mImgMenu3.setOnClickListener(this);
            mImgMenu4.setOnClickListener(this);
            mImgMenu5.setOnClickListener(this);
        }
    
    
        @Override
        public void onClick(View v) {
            switch (v.getId()) {
                case R.id.img_menu:
                    mArcMenu.switchMenu();
                    break;
                case R.id.img_menu1:
                    mArcMenu.clickItem();
                    break;
                case R.id.img_menu2:
                    mArcMenu.clickItem();
                    break;
                case R.id.img_menu3:
                    mArcMenu.clickItem();
                    break;
                case R.id.img_menu4:
                    mArcMenu.clickItem();
                    break;
                default:
                    break;
            }
        }
    }
    

    相关文章

      网友评论

          本文标题:一个点击展开的控件

          本文链接:https://www.haomeiwen.com/subject/mynovttx.html