点击按钮的径向菜单android？

Question

我想设计这样的菜单.

我尝试了动画,但它没有保留按钮的位置.

如果有人做过这种菜单,请指导我.

任何帮助将不胜感激.

Answer 1

我最近创建了这个圆形菜单,以便在我最近的项目中添加.看起来像

你需要的是创建一个新的视图并绘制这个视图,检查用户输入(他在哪里触摸),设计一个反馈机制,例如,在我的视图中,如果用户触摸5个弧中的任何一个,背景颜色变化天蓝色.这是我的onDrawMethod代码.

protected void onDraw(Canvas canvas) {
        // TODO Auto-generated method stub

        px = getMeasuredWidth()/2;     
        py = getMeasuredHeight();


        initial = 144;
        finalangle = 252;

        centerCircleradius  = 30;
        middleCircleRadius = 140;




            int init, fina;
            init = 160;    
            fina = 360;
            finalOVal.set(px-middleCircleRadius-4, py-middleCircleRadius-4, px+middleCircleRadius+4, py+middleCircleRadius+4);
            middleOval.set(px-middleCircleRadius, py-middleCircleRadius, px+middleCircleRadius, py+middleCircleRadius);
            while(init<fina)
            {
                circlePaint.setColor(colors[i]);
                canvas.drawArc(finalOVal,init,10,false, circlePaint);
                i++;
                if(i>=colors.length)
                {
                    i=0;
                }
                init = init + 10;

            }



            canvas.drawArc(middleOval, 180, 180, false, pencil);

            midInitial = 180;


            i=0;

            //Creating the first Arc
            if(arcTouched[0])
            {

                canvas.drawArc(middleOval, midInitial, 36, true, arcTouchedBack);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            else
            {
                canvas.drawArc(middleOval, midInitial, 36, true, middleCircleBody);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            canvas.drawBitmap(bitmap.get(0), null, (putBitmapTo(midInitial, 36, 140, px, py)), null);
            midInitial+=36;

            if(arcTouched[1])
            {

                canvas.drawArc(middleOval, midInitial, 36, true, arcTouchedBack);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            else
            {
                canvas.drawArc(middleOval, midInitial, 36, true, middleCircleBody);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            canvas.drawBitmap(bitmap.get(1), null, (putBitmapTo(midInitial, 36, 140, px, py)), null);
            midInitial+=36;

            if(arcTouched[2])
            {

                canvas.drawArc(middleOval, midInitial, 36, true, arcTouchedBack);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            else
            {
                canvas.drawArc(middleOval, midInitial, 36, true, middleCircleBody);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            canvas.drawBitmap(bitmap.get(2), null, (putBitmapTo(midInitial, 36, 140, px, py)), null);
            midInitial+=36;
            //Creatring the second Arc

            if(arcTouched[3])
            {

                canvas.drawArc(middleOval, midInitial, 36, true, arcTouchedBack);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            else
            {
                canvas.drawArc(middleOval, midInitial, 36, true, middleCircleBody);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            canvas.drawBitmap(bitmap.get(3), null, (putBitmapTo(midInitial, 36, 140, px, py)), null);
            midInitial+=36;

            if(arcTouched[4])
            {

                canvas.drawArc(middleOval, midInitial, 36, true, arcTouchedBack);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            else
            {
                canvas.drawArc(middleOval, midInitial, 36, true, middleCircleBody);
                canvas.drawArc(middleOval, midInitial, 36, true, pencil);
            }
            canvas.drawBitmap(bitmap.get(4), null, (putBitmapTo(midInitial, 36, 140, px, py)), null);           
            canvas.drawCircle(px, py-10, 40, pencil);
            canvas.drawCircle(px, py-10, 39, smallCircleCore);

            canvas.drawCircle(px, py-10, 35, bigArc);
            canvas.drawCircle(px, py-10, 20, smallCircleCore);

            canvas.drawCircle(px, py-10, 15, bigArc);
            canvas.drawLine(px-8, py-10, px+8, py-10, lineCore);

        canvas.save();
    }

您可能需要的一些参考.

位图 - >是包含图像的arraylist

arcToched [] - >是一个定义arc背景的数组,这个布尔数组的值在onTouchEvent()方法中被修改.

lineCore,smallCircleCore .....是油漆.

我知道这不是最好的方式,也不是专业的.我根据需要创建了这个菜单.在更改角度计算之前,它无法扩展.

此视图受Catch Notes应用程序的高度启发.我在创建此视图时遇到的唯一问题是确定触摸的弧线.我在这里使用的唯一动画就像Catch Notes一样(圆形菜单扩展了一个比给定大小更多然后恢复正常的那个).