Android 圆盘颜色选择器,十六进制色值表,百分比透明效果值,渐变效果

圆盘颜色选择器

默认效果
在这里插入图片描述
自定义效果
在这里插入图片描述
使用方法

在这里插入图片描述
在这里插入图片描述
YColorView
注释很详细,代码难度适中,主要就是实心圆弧的计算有一丢丢绕

/**
 * 作者:zch
 * 时间:2022/5/6 9:58
 * 描述:圆盘形颜色选择器
 */
public class YColorView extends View {
    
    

    private int[] c = null;
    private final int[] m_c = {
    
    Color.BLUE,Color.RED,Color.GREEN,Color.BLACK,Color.GRAY,Color.YELLOW,Color.WHITE,Color.MAGENTA,Color.LTGRAY,Color.BLUE};

    public YColorView(Context context) {
    
    
        super(context);
    }

    public YColorView(Context context, @Nullable AttributeSet attrs) {
    
    
        super(context, attrs);
    }

    //动态设置颜色
    public void setColor(int[] i){
    
    
        this.c = i;
        //刷新,此方法无需在UI线程使用
        postInvalidate();
    }

    @SuppressLint("DrawAllocation")
    @Override
    protected void onDraw(Canvas canvas) {
    
    
        super.onDraw(canvas);
        //定义画笔
        Paint paint = new Paint();
        //防锯齿
        paint.setAntiAlias(true);
        //获取宽度
        int measuredWidth = getMeasuredWidth();
        //获取高度
        int measuredHeight = getMeasuredHeight();
        //取最小的为半径,防止长方形
        int length = Math.min(measuredWidth, measuredHeight);
        //设置风格-实心圆
        paint.setStyle(Paint.Style.FILL);

        //自定义颜色的情况下,否则使用默认
        RectF rectF;
        if (c != null && c.length > 0){
    
    
            //一个圆 360 度,需要多少颜色,就将这些颜色在 360内均分
            int l = 360 / c.length;
            for (int i=0; i< c.length; i++){
    
    
                //设置一个圆弧以及范围,虽然是一个圆弧,也要按照圆来设置左上右下的范围
                rectF = new RectF(0,0,length,length);
                //设置当前画笔颜色
                paint.setColor(c[i]);
                //将画笔与圆弧搞在画板里面,起始位置要按当前下标的位置计算,弧度固定均分360度
                canvas.drawArc(rectF, i * l, l,true, paint);
            }
        }else {
    
    
            //设置一个圆弧以及范围,虽然是一个圆弧,也要按照圆来设置左上右下的范围
            rectF = new RectF(0,0,length,length);
            //指定扫射圆心 cx, cy
            //指定渐变色色值数组
            //对应色值数组,用来控制对应色值的权重,如为 null,就按系统的均匀划分吧
            SweepGradient sweepGraditent = new SweepGradient(length/2f,length/2f,m_c,null);
            //确定好渐变色后,只要把这个渐变色效果设置给画笔,画笔就能带着颜色画出来了
            paint.setShader(sweepGraditent);
            canvas.drawArc(rectF, 0, 360, false, paint);
        }
    }

    @SuppressLint("ClickableViewAccessibility")
    @Override
    public boolean onTouchEvent(MotionEvent event) {
    
    
        //重新焦点方法,用于在移动以及点击时及时获取颜色
        int action = event.getAction();
        switch (action) {
    
    
            case MotionEvent.ACTION_DOWN:
            case MotionEvent.ACTION_MOVE:
                //获取当前位置的颜色,通过回调及时返回数据,这里加限制,否则手指到指定范围会闪退
                if (event.getX() < getMeasuredWidth() && event.getY() < getMeasuredHeight()){
    
    
                    int pixel = createBitmapFromView(this).getPixel((int) Math.abs(event.getX()), (int) Math.abs(event.getY()));
                    onYColorViewInterface.onYColorChange(pixel);
                }
                break;
            case MotionEvent.ACTION_UP:
                break;
        }
        return true;
    }

    interface OnYColorViewInterface{
    
    
        void onYColorChange(int color);
    }

    public OnYColorViewInterface onYColorViewInterface;

    public void addOnYColorListener(OnYColorViewInterface onYColorViewInterface){
    
    
        this.onYColorViewInterface = onYColorViewInterface;
    }

    //将该View转换成一个图像,用于根据坐标获取当前图像的颜色
    public static Bitmap createBitmapFromView(View view) {
    
    
        Bitmap bitmap = null;
        //开启view缓存bitmap
        view.setDrawingCacheEnabled(true);
        //设置view缓存Bitmap质量
        view.setDrawingCacheQuality(DRAWING_CACHE_QUALITY_HIGH);
        //获取缓存的bitmap
        Bitmap cache = view.getDrawingCache();
        if (cache != null && !cache.isRecycled()) {
    
    
            bitmap = Bitmap.createBitmap(cache);
        }
        //销毁view缓存bitmap
        view.destroyDrawingCache();
        //关闭view缓存bitmap
        view.setDrawingCacheEnabled(false);
        return bitmap;
    }
}

渐变效果
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false">
        <shape android:shape="rectangle">

            <stroke android:width="1dp" android:color="#FFD2D2" />

            <corners android:radius="1dp"/>

            <gradient
                android:angle="0"
                android:startColor="#FF3333"
                android:endColor="#F8F8F8"
                android:type="linear" />
        </shape>

    </item>
</selector>

十六进制色值表

在这里插入图片描述
在这里插入图片描述
百分比透明效果值

加在十六进制前面,例如: 黑色 #000000 ;百分之五十透明度 #80000000

100% — FF
99% — FC
98% — FA
97% — F7
96% — F5
95% — F2
94% — F0
93% — ED
92% — EB
91% — E8
90% — E6
89% — E3
88% — E0
87% — DE
86% — DB
85% — D9
84% — D6
83% — D4
82% — D1
81% — CF
80% — CC
79% — C9
78% — C7
77% — C4
76% — C2
75% — BF
74% — BD
73% — BA
72% — B8
71% — B5
70% — B3
69% — B0
68% — AD
67% — AB
66% — A8
65% — A6
64% — A3
63% — A1
62% — 9E
61% — 9C
60% — 99
59% — 96
58% — 94
57% — 91
56% — 8F
55% — 8C
54% — 8A
53% — 87
52% — 85
51% — 82
50% — 80
49% — 7D
48% — 7A
47% — 78
46% — 75
45% — 73
44% — 70
43% — 6E
42% — 6B
41% — 69
40% — 66
39% — 63
38% — 61
37% — 5E
36% — 5C
35% — 59
34% — 57
33% — 54
32% — 52
31% — 4F
30% — 4D
29% — 4A
28% — 47
27% — 45
26% — 42
25% — 40
24% — 3D
23% — 3B
22% — 38
21% — 36
20% — 33
19% — 30
18% — 2E
17% — 2B
16% — 29
15% — 26
14% — 24
13% — 21
12% — 1F
11% — 1C
10% — 1A
9% — 17
8% — 14
7% — 12
6% — 0F
5% — 0D
4% — 0A
3% — 08
2% — 05
1% — 03
0% — 00

猜你喜欢

转载自blog.csdn.net/As_thin/article/details/124608014