How to change to parameter in custom view at run time?

Question

I am working on a draw board app. I have completed the draw function by a custom view like this:

public class DrawView extends View implements OnTouchListener {

    private Paint bmPaint = new Paint();
    private Paint drawPaint = new Paint();
    private Path path = new Path();
    private Canvas cv = null;
    private Bitmap bm = null;
    private Drawable d;
    private boolean firstTimeThru = true;

    public DrawView(Context context) {
        super(context);
        init(context);
    }

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

    public void init(Context ctx) {
        setFocusable(true);
        setFocusableInTouchMode(true);
        this.setOnTouchListener(this);
    }

    @Override
    public void onDraw(Canvas canvas) {
        // Set everything up the first time anything gets drawn:
        if (firstTimeThru) {
            firstTimeThru = false;
            //d = getResources().getDrawable(R.drawable.zone0_over);
            d = new ColorDrawable(Color.TRANSPARENT);

            // Just quickly fill the view with a red mask:          
            canvas.drawColor(Color.TRANSPARENT);

            // Create a new bitmap and canvas and fill it with a red mask:
            bm = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(),Config.ARGB_8888);           
            cv = new Canvas();
            cv.setBitmap(bm);
            d.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
            d.draw(cv);

            // Specify that painting will be with fat strokes:
            drawPaint.setStyle(Paint.Style.STROKE);
            drawPaint.setColor(Color.RED);
            drawPaint.setStrokeWidth(canvas.getWidth() / 200); // default 15

            // Specify that painting will clear the pixels instead of paining new ones:
            drawPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.ADD));
        }

        cv.drawPath(path, drawPaint);
        canvas.drawBitmap(bm, 0, 0, bmPaint);

        super.onDraw(canvas);
    }

    public boolean onTouch(View view, MotionEvent event) {
        float xPos = event.getX();
        float yPos = event.getY();

        switch (event.getAction()) {
            // Set the starting position of a new line:
            case MotionEvent.ACTION_DOWN:
                path.moveTo(xPos, yPos);
                invalidate();
            return true;

            // Draw a line to the ending position:
            case MotionEvent.ACTION_MOVE:
                path.lineTo(xPos, yPos);
                invalidate();
            break;

            case MotionEvent.ACTION_UP:
            break;

            default:
            return false;
        }

        return true;
    }   

}

And the xml like this:

<ImageView
    android:id="@+id/change_color_btn"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<com.myapp.tool.DrawView
    android:id="@+id/draw"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

Notice that I have set the line size and the line color inside the onDraw function, it is currently red color, however, I would like to press a button and change the color to yellow, how can I set the parameter in run time?

Thanks

Answer 1

Add a member variable and setter function to the DrawView class:

private int mLineColor = Color.RED;
public void setLineColor(int color)
{
    mLineColor = color;
    drawPaint.setColor(mLineColor);
}

Change your onDraw to use it:

drawPaint.setColor(mLineColor);

Then you can set it from the Activity that uses your custom class, inside the Button onClick() handler:

DrawView drawview = (DrawView)findViewById(R.id.draw);
drawView.setLineColor(Color.YELLOW);
drawView.invalidate(); // trigger a redraw

Do likewise for the stroke width.

Answer 2

Add a button to your layout for switching the color and add a clicklistener to it. Then you can change the color of your path. Do you want that the current path switches the color or only the new one?

Answer 3

take a field value in the custom view like mColor, and create setter and getter for the field value, then set the color after creating the custom view also like this:

private int mColor;

public int getmColor() {
    return mColor;
}

public void setmColor(int mColor) {
    this.mColor = mColor;
    this.invalidate();
}