更改颜色选择器的大小

Question

我是 android 编程新手，我想在我的应用程序中添加一个颜色选择器栏。 我已关注 http://v4all123.blogspot.com/2013/06/simple-colorpicker-for-android.html

因为我只想要一个酒吧，所以我将代码修改为：

import android.app.Dialog;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.Shader;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;

public class ColorPicker extends Dialog {

    public interface OnColorChangedListener {
        void colorChanged(String key, int color);
    }

    private OnColorChangedListener mListener;
    private int mInitialColor, mDefaultColor;
    private String mKey;

    private static class ColorPickerView extends View {
        private Paint mPaint;
        private float mCurrentHue = 0;
        private int  mDefaultColor;
        private final int[] mHueBarColors = new int[258];

        private OnColorChangedListener mListener;
        private int maincolorforbar;

        ColorPickerView(Context c, OnColorChangedListener l, int color, int defaultColor) {
            super(c);
            mListener = l;
            mDefaultColor = defaultColor;

            // Get the current hue from the current color and update the main
            // color field
            float[] hsv = new float[3];
            Color.colorToHSV(color, hsv);
            mCurrentHue = hsv[0];
            /*updateMainColors();*/



            // Initialize the colors of the hue slider bar
            int index = 0;
            for (float i = 0; i < 256; i += 256 / 42) // Red (#f00) to pink
            // (#f0f)
            {
                mHueBarColors[index] = Color.rgb(255, 0, (int) i);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) // Pink (#f0f) to blue
            // (#00f)
            {
                mHueBarColors[index] = Color.rgb(255 - (int) i, 0, 255);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) // Blue (#00f) to light
            // blue (#0ff)
            {
                mHueBarColors[index] = Color.rgb(0, (int) i, 255);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) // Light blue (#0ff) to
            // green (#0f0)
            {
                mHueBarColors[index] = Color.rgb(0, 255, 255 - (int) i);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) // Green (#0f0) to yellow
            // (#ff0)
            {
                mHueBarColors[index] = Color.rgb((int) i, 255, 0);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) // Yellow (#ff0) to red
            // (#f00)
            {
                mHueBarColors[index] = Color.rgb(255, 255 - (int) i, 0);
                index++;
            }

            // Initializes the Paint that will draw the View
            mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
            mPaint.setTextAlign(Paint.Align.CENTER);
            mPaint.setTextSize(50);
        }

        // Get the current selected color from the hue bar
        private int getCurrentMainColor() {
            int translatedHue = 255 - (int) (mCurrentHue * 255 / 360);
            int index = 0;
            for (float i = 0; i < 256; i += 256 / 42) {
                if (index == translatedHue)
                    return Color.rgb(255, 0, (int) i);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) {
                if (index == translatedHue)
                    return Color.rgb(255 - (int) i, 0, 255);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) {
                if (index == translatedHue)
                    return Color.rgb(0, (int) i, 255);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 30) {
                if (index == translatedHue)
                    return Color.rgb(0, 255, 255 - (int) i);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) {
                if (index == translatedHue)
                    return Color.rgb((int) i, 255, 0);
                index++;
            }
            for (float i = 0; i < 256; i += 256 / 42) {
                if (index == translatedHue)
                    return Color.rgb(255, 255 - (int) i, 0);
                index++;
            }

            return Color.RED;
        }





        @Override
        protected void onDraw(Canvas canvas) {
            int translatedHue = 255 - (int) (mCurrentHue * 255 / 360);
            // Display all the colors of the hue bar with lines
            for (int x = 0; x < 256; x++) {
                // If this is not the current selected hue, display the actual
                // color
                if (translatedHue != x) {
                    mPaint.setColor(mHueBarColors[x]);
                    mPaint.setStrokeWidth(1);
                } else // else display a slightly larger black line
                {
                    mPaint.setColor(Color.BLACK);
                    mPaint.setStrokeWidth(6);
                }
                canvas.drawLine(x + 10, 0, x + 10, 50, mPaint);
                // canvas.drawLine(0, x+10, 40, x+10, mPaint);
            }


            // Draw a 'button' with the currently selected color
            maincolorforbar = Color.rgb(
                    Color.red(getCurrentMainColor()),
                    Color.green(getCurrentMainColor()),
                    Color.blue(getCurrentMainColor()));

            mPaint.setStyle(Paint.Style.FILL);
            mPaint.setColor(maincolorforbar);
            canvas.drawRect(10, 150, canvas.getWidth(), 250, mPaint);

            // Set the text color according to the brightness of the color
            if (Color.red(maincolorforbar) + Color.green(maincolorforbar) + Color.blue(maincolorforbar) < 384)
                mPaint.setColor(Color.WHITE);
            else
                mPaint.setColor(Color.BLACK);
            canvas.drawText("Pick", 74, 245, mPaint);

            // Draw a 'button' with the default color
            mPaint.setStyle(Paint.Style.FILL);
            mPaint.setColor(mDefaultColor);
            canvas.drawRect(138, 316, 266, 356, mPaint);

            // Set the text color according to the brightness of the color
            if (Color.red(mDefaultColor) + Color.green(mDefaultColor)
                    + Color.blue(mDefaultColor) < 384)
                mPaint.setColor(Color.WHITE);
            else
                mPaint.setColor(Color.BLACK);
            canvas.drawText("Pick", 202, 340,
                    mPaint);
        }

        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

            setMeasuredDimension(366, 366);
        }

        @Override
        public boolean onTouchEvent(MotionEvent event) {
            /*if (event.getAction() != MotionEvent.ACTION_DOWN)
                return true;*/

            float x = event.getX();
            float y = event.getY();
            if (event.getAction() == MotionEvent.ACTION_MOVE ) {


                // If the touch event is located in the hue bar
                if (x > 10 && x < 266 && y > 0 && y < 40) {
                    // Update the main field colors
                    mCurrentHue = (255 - x) * 360 / 255;

                    invalidate();
                }


                // If the touch event is located in the left button, notify the
                // listener with the current color
                if (x > 10 && x < 138 && y > 316 && y < 356)
                    mListener.colorChanged("", maincolorforbar);

                // If the touch event is located in the right button, notify the
                // listener with the default color
                if (x > 138 && x < 266 && y > 316 && y < 356)
                    mListener.colorChanged("", mDefaultColor);

                return true;
            } else {


                // If the touch event is located in the hue bar
                if (x > 10 && x < 266 && y > 0 && y < 40) {
                    // Update the main field colors
                    mCurrentHue = (255 - x) * 360 / 255;

                    invalidate();
                }


                // If the touch event is located in the left button, notify the
                // listener with the current color
                if (x > 10 && x < 138 && y > 316 && y < 356)
                    mListener.colorChanged("", maincolorforbar);

                // If the touch event is located in the right button, notify the
                // listener with the default color
                if (x > 138 && x < 266 && y > 316 && y < 356)
                    mListener.colorChanged("", mDefaultColor);

                return true;
            }
        }
    }

    public ColorPicker(Context context, OnColorChangedListener listener,
                       String key, int initialColor, int defaultColor) {
        super(context);

        mListener = listener;
        mKey = key;
        mInitialColor = initialColor;
        mDefaultColor = defaultColor;
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        OnColorChangedListener l = new OnColorChangedListener() {
            public void colorChanged(String key, int color) {
                mListener.colorChanged(mKey, color);
                dismiss();
            }
        };

        setContentView(new ColorPickerView(getContext(), l, mInitialColor,
                mDefaultColor));
        setTitle("Pick a color");

    }
}

如何增加 Hue 条的大小？ 我可以将此对话框用作 Activity 吗？

Answer 1

你好，你可以试试这样的：

hueBarColors = new int[hueBarWidth];

     /*
     * We have 7 main colors, 6 intervals are then needed.
     */
    int nbPix = hueBarWidth / 6;

     /*
     * for each FF we define the Step needed to accomplish a shading effect.
     */
    float step = 255 / nbPix;

    int red = 0;
    int green = 0;
    int blue = 0;
    int index = 0;

    /*
     * Defines the color values going from Red FF 00 00 to Yellow FF FF 00
     */
    for (int i = 0; i < nbPix; i++){

        hueBarColors[index] = Color.rgb(255, green, 0);  
        index++;
        green += step;

    }

    /*
     * From Yelow FF FF 00 to Green 00 FF 00
     */     
    for (int i = 0; i < nbPix; i++){

        hueBarColors[index] = Color.rgb(255 - red, 255, 0);  
        index++;
        red += step;

    }

    /*
     *  From Green 00 FF 00 to  Cyan 00 FF FF       
     */
    for (int i = 0; i < nbPix; i++){

        hueBarColors[index] = Color.rgb(0, 255, blue);  
        index++;
        blue += step;

    }       

    /*
     * From Cyan 00 FF FF to Blue 00 00 FF      
     */
    green = 0;
    for (int i = 0; i < nbPix; i++){

        hueBarColors[index] = Color.rgb(0, 255 - green, 255);  
        index++;
        green += step;

    }

    /*
     * From Blue 00 00 FF to Magenta FF 00 FF       
     */
    red = 0;
    for (int i = 0; i < nbPix; i++){

        hueBarColors[index] = Color.rgb(red, 0, 255);  
        index++;
        red += step;

    }   

    /*
     * From Magenta FF 00 FF to Red FF 00 00        
     */
    blue = 0;
    for (int i = 0; i < nbPix; i++){

        hueBarColors[index] = Color.rgb(255, 0, 255 - blue);  
        index++;
        blue += step;

    }   

您也将使用新维度修改您的 onMeasure 调用。

Answer 2

嗨 Jawad 谢谢你的回答，但它只是改变了颜色。 我修改了代码，它工作了。 我修改后的代码：

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;

/**
 * Created by Nikhil on 9/10/2015.
 */
public class ColorPicker extends View {


    public ColorPicker(Context context) {
        super(context);
        init(null, 0);
    }

    public ColorPicker(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(attrs, 0);
    }


    public ColorPicker(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(attrs, defStyle);
    }

    private void init(AttributeSet attrs, int defStyle) {


        // Get the current hue from the current color and update the main
        // color field
        float[] hsv = new float[3];
        Color.colorToHSV(0, hsv);
        mCurrentHue = hsv[0];
            /*updateMainColors();*/


        // Initialize the colors of the hue slider bar
        int index = 0;
        for (float i = 0; i < 256; i += 256 / 42) // Red (#f00) to pink
        // (#f0f)
        {
            mHueBarColors[index] = Color.rgb(255, 0, (int) i);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42)  // Pink (#f0f) to blue
        // (#00f)
        {
            mHueBarColors[index] = Color.rgb(255 - (int) i, 0, 255);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42)  // Blue (#00f) to light
        // blue (#0ff)
        {
            mHueBarColors[index] = Color.rgb(0, (int) i, 255);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42)  // Light blue (#0ff) to
        // green (#0f0)
        {
            mHueBarColors[index] = Color.rgb(0, 255, 255 - (int) i);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42)  // Green (#0f0) to yellow
        // (#ff0)
        {
            mHueBarColors[index] = Color.rgb((int) i, 255, 0);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42) // Yellow (#ff0) to red
        // (#f00)
        {
            mHueBarColors[index] = Color.rgb(255, 255 - (int) i, 0);
            index++;
        }



        // Initializes the Paint that will draw the View
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setTextAlign(Paint.Align.CENTER);
        mPaint.setTextSize(50);
    }


    private Paint mPaint;
    private float mCurrentHue = 0;
    private int mDefaultColor;
    private final int[] mHueBarColors = new int[258];

    /*private OnColorChangedListener mListener;*/
    private int maincolorforbar;

    public ColorPicker(Context c, int color, int defaultColor) {
        super(c);


    }

    // Get the current selected color from the hue bar
    private int getCurrentMainColor() {

        int translatedHue = 255 - (int) (mCurrentHue * 255 / 360);
        int index = 0;
        for (float i = 0; i < 256; i += 256 / 42) {
            if (index == translatedHue)
                return Color.rgb(255, 0, (int) i);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42) {
            if (index == translatedHue)
                return Color.rgb(255 - (int) i, 0, 255);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42) {
            if (index == translatedHue)
                return Color.rgb(0, (int) i, 255);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 30) {
            if (index == translatedHue)
                return Color.rgb(0, 255, 255 - (int) i);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42) {
            if (index == translatedHue)
                return Color.rgb((int) i, 255, 0);
            index++;
        }
        for (float i = 0; i < 256; i += 256 / 42) {
            if (index == translatedHue)
                return Color.rgb(255, 255 - (int) i, 0);
            index++;
        }

        return Color.RED;
    }


    @Override
    protected void onDraw(Canvas canvas) {
        int translatedHue = 255 - (int) (mCurrentHue * 255 / 360);
        // Display all the colors of the hue bar with lines
        for (int x = 0; x < 765; x++) {
            // If this is not the current selected hue, display the actual
            // color
            if (translatedHue != x/3) {
                mPaint.setColor(mHueBarColors[x/3]);
                mPaint.setStrokeWidth(1);
            } else // else display a slightly larger black line
            {
                mPaint.setColor(Color.BLACK);
                mPaint.setStrokeWidth(6);
            }
            canvas.drawLine(x + 10, 0, x + 10, 100, mPaint);
            // canvas.drawLine(0, x+10, 40, x+10, mPaint);
        }


        // Draw a 'button' with the currently selected color
        maincolorforbar = Color.rgb(
                Color.red(getCurrentMainColor()),
                Color.green(getCurrentMainColor()),
                Color.blue(getCurrentMainColor()));

        mPaint.setStyle(Paint.Style.FILL);
        mPaint.setColor(maincolorforbar);
        canvas.drawRect(10, 150, canvas.getWidth(), 250, mPaint);

        // Set the text color according to the brightness of the color
        if (Color.red(maincolorforbar) + Color.green(maincolorforbar) + Color.blue(maincolorforbar) < 384)
            mPaint.setColor(Color.WHITE);
        else
            mPaint.setColor(Color.BLACK);
        canvas.drawText("Pick", 74, 245, mPaint);

        // Draw a 'button' with the default color
        mPaint.setStyle(Paint.Style.FILL);
        mPaint.setColor(mDefaultColor);
        canvas.drawRect(138, 316, 266, 356, mPaint);

        // Set the text color according to the brightness of the color
        if (Color.red(mDefaultColor) + Color.green(mDefaultColor)
                + Color.blue(mDefaultColor) < 384)
            mPaint.setColor(Color.WHITE);
        else
            mPaint.setColor(Color.BLACK);
        canvas.drawText("Pick", 202, 340,
                mPaint);
    }
    @Override
    public boolean onTouchEvent(MotionEvent event) {
            /*if (event.getAction() != MotionEvent.ACTION_DOWN)
                return true;*/

        float x = event.getX();
        float y = event.getY();
        if (event.getAction() == MotionEvent.ACTION_MOVE ) {


            // If the touch event is located in the hue bar
            if (x > 0 && x < 765 && y > 0 && y < 250) {
                // Update the main field colors
                mCurrentHue = (255 - x/3) * 360 / 255;

                invalidate();
            }


            // If the touch event is located in the left button, notify the
            // listener with the current color
            /*if (x > 10 && x < 138 && y > 316 && y < 356)
                mListener.colorChanged("", maincolorforbar);

            // If the touch event is located in the right button, notify the
            // listener with the default color
            if (x > 138 && x < 266 && y > 316 && y < 356)
                mListener.colorChanged("", mDefaultColor);*/

            return true;
        } else {


            // If the touch event is located in the hue bar
            if (x > 10 && x < 266 && y > 0 && y < 40) {
                // Update the main field colors
                mCurrentHue = (255 - x) * 360 / 255;

                invalidate();
            }


            // If the touch event is located in the left button, notify the
            // listener with the current color
           /* if (x > 10 && x < 138 && y > 316 && y < 356)
                mListener.colorChanged("", maincolorforbar);

            // If the touch event is located in the right button, notify the
            // listener with the default color
            if (x > 138 && x < 266 && y > 316 && y < 356)
                mListener.colorChanged("", mDefaultColor);*/

            return true;
        }
    }


    public Object getCurrentColor() {
        return maincolorforbar;
    }
}