Android 自定义View 抽奖大转盘(2)

这是转盘的第二个版本，添加了外围的圆圈

第一个demo在这儿可以找到

Android 自定义View 抽奖大转盘（1）
项目github链接 https://github.com/yukunkun/RotateView

镇楼图

S171011-11370203.jpg

项目的本来来源来自于

来源

添加外围的圆圈，主要由两部分组成

1.画小圆。2.圆盘位置的定位

圆盘位置如下

@Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        //就是让两个view居中，没有其他的操作
        int centerX = (right - left)/2;
        int centerY = (bottom - top)/2;
        boolean panReady = false;
        for(int i=0;i<getChildCount();i++){
            View child = getChildAt(i);
            if(child instanceof RotateView){
                rotatePan = (RotateView) child;
                int panWidth = child.getWidth();
                int panHeight = child.getHeight();
                child.layout(centerX - panWidth/2 , centerY - panHeight/2,centerX + panWidth/2, centerY + panHeight/2);
                panReady = true;
            }else if(child instanceof ImageView){
//                if(TextUtils.equals((String) child.getTag(),START_BTN_TAG)){
                    startBtn = (ImageView) child;
                    int btnWidth = child.getWidth();
                    int btnHeight = child.getHeight();
                    child.layout(centerX - btnWidth/2 , centerY - btnHeight/2 , centerX + btnWidth/2, centerY + btnHeight/2 );
//                }
            }
        }
    }

这里一看就能明白，两个View，居中显示，在onLayout方法里面

下面是画圆的方法

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        this.canvas = canvas;

        final int paddingLeft = getPaddingLeft();
        final int paddingRight = getPaddingRight();
        final int paddingTop = getPaddingTop();
        final int paddingBottom = getPaddingBottom();

        int width = getWidth() - paddingLeft - paddingRight;
        int height = getHeight() - paddingTop - paddingBottom;
        int MinValue = Math.min(width,height);

        radius = MinValue /2;
        CircleX = getWidth() /2;
        CircleY = getHeight() /2;
        //画背景
        canvas.drawCircle(CircleX,CircleY,radius,backgroundPaint);
        //画圆圈，主要功能也就在这里
        drawSmallCircle(isYellow);
    }

    private void drawSmallCircle(boolean FirstYellow) {
        //位置要在内部，每次的半径相应的变短一点
        int pointDistance = radius - Util.dip2px(context,10);
        //每次增加20度，也就是能够得到18个点
        for(int i=0;i<=360;i+=20){
            //每次获取到圆心的位置，由i控制位置
            int x = (int) (pointDistance * Math.sin(Util.change(i))) + CircleX;
            int y = (int) (pointDistance * Math.cos(Util.change(i))) + CircleY;

            //两个不同颜色圆
            if(FirstYellow)
                canvas.drawCircle(x,y,Util.dip2px(context,6),yellowPaint);
            else
                canvas.drawCircle(x,y,Util.dip2px(context,6),whitePaint);
            FirstYellow = !FirstYellow;
        }
    }

如上所示，在onDraw方法，画出了圆，根据不同的角度变化，获取到了小圆的圆心位置，画出圆

其中View之间的间距是由两个自定义View的位置差值来确定外围小圆的圆环宽度的。

感觉这里可以用一个自定义View来实现，之后会选择用一个自定义View来实现整个抽奖的大转盘。