自定义扇形按钮

最近公司需要做一个扇形按钮,没有现成的控件,所以只能自己去自定义。

大致需求如下:
其一:分为四个模块,可以点击任何模块,然后进行不同业务操作
其二:点击时,文字随之变化

效果如下:
这里写图片描述

实现思路及其简要代码:

1,绘制背景 :
//定义画笔
paint.setColor(circleColor);
paint.setStrokeWidth(circleWidth);
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.STROKE);
float x = (getWidth() - getHeight() / 2) / 2;
float y = getHeight() / 4;
//绘制半圆
RectF oval = new RectF(x, y, getWidth() - x, getHeight() - y);
canvas.drawArc(oval, 90, -180, false, paint);
//绘制隔线
paint.setColor(backgroundColor);
paint.setStyle(Paint.Style.FILL);
paint.setStrokeWidth(5);//圆环隔线的宽度
canvas.drawLine(center, center, center, 0, paint);
canvas.drawLine(center, center, (float) (center + 0.5 * center * Math.sqrt(3)), center * 1 / 2, paint);
canvas.drawLine(center, center, (float) (center + 0.5 * center * Math.sqrt(3)), center * 3 / 2, paint);
canvas.drawLine(center, center, center, center * 2, paint);
//绘制文字
paint.setColor(Color.WHITE);
paint.setTextSize(banciTextSize);
canvas.drawText(“一班”, (float) (center + 0.25 * center), (float) 0.4 * center, paint);
canvas.drawText(“二班”, (float) (center + 0.6 * center), center, paint);
canvas.drawText(“三班”, (float) (center + 0.3 * center), (float) (center + 0.7 * center), paint);

2,定义点击事件,
this.setOnTouchListener(onTouchListener);
1)定义关于方向枚举
public enum Dir {

    FIRST, SECOND, THIRD, UNDEFINE, CENTER
}
  2)检测点击方向和范围
  private Dir checkDir(float x, float y) {

        Dir dir = Dir.CENTER;
        if (Math.pow(y - center, 2) + Math.pow(x - center, 2) < Math.pow(center / 2, 2)) {// 判断在中心圆圈内
            dir = Dir.CENTER;
        } else if (Math.pow(y - center, 2) + Math.pow(x - center, 2) > Math.pow(center, 2)) {// 判断在最大的圆弧外
            dir = Dir.UNDEFINE;
        } else if (y < x && y + x < 2 * center) {
            dir = Dir.FIRST;
        } else if (y < x && y + x > 2 * center) {
            dir = Dir.SECOND;
        } else if (y > x) {
            dir = Dir.THIRD;
        }
        return dir;
    }

3)绘制点击的扇形
private void drawOnclikColor(Canvas canvas, Dir dir) {

    float x = (getWidth() - getHeight() / 2) / 2;
    float y = getHeight() / 4;
    paint.setColor(Color.BLACK);
    paint.setTextSize(banciTextSize);
    RectF oval = new RectF(x, y, getWidth() - x, getHeight() - y);
    switch (dir) {
        case FIRST:
            canvas.drawText("一班", (float) (center + 0.25 * center), (float) 0.4 * center, paint);
            if (onChooseListener != null) {
                onChooseListener.setChooseFirst(1);
            }
            break;
        case SECOND:
            canvas.drawText("二班", (float) (center + 0.6 * center), center, paint);
            if (onChooseListener != null) {
                onChooseListener.setChooseFirst(2);
            }
            break;
        case THIRD:
            canvas.drawText("三班", (float) (center + 0.3 * center), (float) (center + 0.7 * center), paint);
            if (onChooseListener != null) {
                onChooseListener.setChooseFirst(3);
            }

            break;
        case CENTER:
            if (onChooseListener != null) {
                onChooseListener.setChooseFirst(0);
            }
            break;

        default:
            break;
    }

    paint.setStyle(Paint.Style.FILL);
}

3,定义接口,供外部调用

public interface OnChooseListener {
void setChooseFirst(int type);
}
public void setOnChooseListener(OnChooseListener onChooseListener) {
this.onChooseListener = onChooseListener;
}

阅读更多
个人分类: 自定义控件
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭