how can i change the color of my paint brush on button click from the color palette android

Question

I am working on a basic paint app which has a color palette. Whenever i select a color the brush color should change. Currently the issue with my program is that on changing the color, my existing drawing color also changes to the present color. Thus, I cannot make a drawing with different colors. I finally get an image with the last color selected. I have given my code below.

Drawing.java

public class Drawing extends Activity {
Paint fgPaintSel;
public  int height,width,i=0,counter=0;
boolean flag=true;
String image;
Button bClear,bErase,bSave,b1,b2,b3,b4,b5,b6,b7,b8,b9,b10;
//int check=0;
Canvas c;
TextView tvAlpha;
LinearLayout draw;
//private DrawingManager mDrawingManager=null;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.drawing);

    LinearLayout ll = (LinearLayout)findViewById(R.id.draw);
    final DrawPanel drawingPanel = new DrawPanel(getApplicationContext());
    ll.addView(drawingPanel);

    bClear=(Button) findViewById(R.id.bCLear1);
    bErase=(Button) findViewById(R.id.bErase);
    bSave=(Button) findViewById(R.id.bSave);
    b1=(Button) findViewById(R.id.b1);  
    b2=(Button) findViewById(R.id.b2);
    b3=(Button) findViewById(R.id.b3);
    b4=(Button) findViewById(R.id.b4);
    b5=(Button) findViewById(R.id.b5);
    b6=(Button) findViewById(R.id.b6);
    b7=(Button) findViewById(R.id.b7);
    b8=(Button) findViewById(R.id.b8);
    b9=(Button) findViewById(R.id.b9);
    b10=(Button) findViewById(R.id.b10);

b1.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            drawingPanel.paint.setColor(Color.BLACK);
        }
    });

 b2.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub

        drawingPanel.paint.setColor(Color.rgb(51,181,229));
        }
    });

 b3.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            drawingPanel.paint.setColor(Color.rgb(153,51,204));
        }
    });

 b4.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            drawingPanel.paint.setColor(Color.rgb(204, 255, 0 ));
        }
    });

 b5.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            drawingPanel.paint.setColor(Color.rgb(255, 68, 68 ));
        }
    });

 b6.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            drawingPanel.paint.setColor(Color.rgb(204, 0, 0));
        }
    });

 b7.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            drawingPanel.paint.setColor(Color.rgb(153, 204, 0));
        }
    });

 b8.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub

            drawingPanel.paint.setColor(Color.rgb(253, 238, 0));
        }
    });

 b9.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            drawingPanel.paint.setColor(Color.rgb(255, 145, 175 ));
        }
    });

 b10.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub
            drawingPanel.paint.setColor(Color.rgb( 139, 0, 139));
        }
    });


    bErase.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {
            // TODO Auto-generated method stub

            drawingPanel.paint.setColor(Color.WHITE);
        }
    });


}


public class DrawPanel extends View { 

public DrawPanel(Context context) {
  super(context);
  points = new ArrayList();
  strokes = new ArrayList();
  paint = createPaint(Color.BLACK, 8);

 }

 @Override
 public void onDraw(Canvas c){
  super.onDraw(c);


  this.setBackgroundColor(Color.WHITE);
   for(Object obj: strokes){
   drawStroke((ArrayList)obj, c);
  }

  drawStroke(points, c);


   //c.drawLine((width/2),height,(width/2),0,fgPaintSel);
 }

 @Override
 public boolean onTouchEvent(MotionEvent event){
  if(event.getActionMasked() == MotionEvent.ACTION_MOVE){
   points.add(new Point((int)event.getX(), (int)event.getY()));
   invalidate();
  }

  if(event.getActionMasked() == MotionEvent.ACTION_UP){
   this.strokes.add(points);
   points = new ArrayList();
   }

  return true;
 }

 private void drawStroke(ArrayList stroke, Canvas c){

    /**/

  if (stroke.size() > 0) {
   Point p0 = (Point)stroke.get(0);
   for (int i = 1; i < stroke.size(); i++) {
    Point p1 = (Point)stroke.get(i);
    c.drawLine(p0.x, p0.y, p1.x, p1.y, paint);
   p0 = p1;
   }
  }
 }

 private Paint createPaint(int color, float width){
  Paint temp = new Paint();
  temp.setStyle(Paint.Style.STROKE);
  temp.setAntiAlias(true);
  temp.setColor(color);
  temp.setStrokeWidth(width);
  temp.setStrokeCap(Cap.ROUND);

  return temp;
 }

 private Paint paint;
 private ArrayList points;
 private ArrayList strokes;
}


}

drawing.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" 
    android:id="@+id/drawPanel1">"

    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="30sp"
        android:orientation="horizontal"
        android:weightSum="100">

    <Button
        android:id="@+id/b1"
        android:layout_width="fill_parent"
        android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#000000" />

    <Button
        android:id="@+id/b2"
        android:layout_width="fill_parent"
        android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#33B5E5" />

    <Button
        android:id="@+id/b3"
         android:layout_width="fill_parent"
       android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#9933CC"  />

    <Button
        android:id="@+id/b4"
        android:layout_width="fill_parent"
       android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#CCFF00"  />

    <Button
        android:id="@+id/b5"
         android:layout_width="fill_parent"
        android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#FF4444" />

    <Button
        android:id="@+id/b6"
         android:layout_width="fill_parent"
        android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#CC0000"  />

    <Button
        android:id="@+id/b7"
        android:layout_width="fill_parent"
      android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#99CC00"  />

    <Button
        android:id="@+id/b8"
        android:layout_width="fill_parent"
        android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#FDEE00"  />

    <Button
        android:id="@+id/b9"
        android:layout_width="fill_parent"
        android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#FF91AF"  />

    <Button
        android:id="@+id/b10"
         android:layout_width="fill_parent"
       android:layout_height="30sp"
        android:layout_weight="10"
        android:background="#8B008B"  />
</LinearLayout>
<LinearLayout
     android:layout_width="fill_parent"
        android:layout_height="35sp"
        android:orientation="horizontal"
        android:weightSum="100" 
        >

     <Button
        android:id="@+id/bErase"
         android:layout_width="fill_parent"
       android:layout_height="30sp"
        android:layout_weight="33"
        android:text="ERASE" 
        android:layout_gravity="center"
        android:gravity="center"
        android:textSize="10sp" />

      <Button
        android:id="@+id/bCLear1"
         android:layout_width="fill_parent"
       android:layout_height="30sp"
        android:layout_weight="33"
        android:text="CLEAR" 
        android:layout_gravity="center"
        android:gravity="center" 
        android:textSize="10sp" />

       <Button
        android:id="@+id/bSave"
         android:layout_width="fill_parent"
       android:layout_height="30sp"
        android:layout_weight="33"
        android:text="SAVE" 
        android:layout_gravity="center"
        android:gravity="center" 
        android:textSize="10sp"
        android:layout_marginRight="10sp" />

</LinearLayout>
<LinearLayout android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal"
        android:id="@+id/draw"></LinearLayout>
</LinearLayout>

Answer 1

1. don't hard code button list, consider GridView(or custom ViewGroup) + Adapter + View.setTag
2. use a Bitmap for storaging painted, don't repaint everything while onDraw, if you want to support 'revert' action, save color with strokes

here:

public void onDraw(Canvas c) {
    super.onDraw(c);

    this.setBackgroundColor(Color.WHITE);
    for(Object obj: strokes){
        drawStroke((ArrayList)obj, c);
    }

    drawStroke(points, c);

    //c.drawLine((width/2),height,(width/2),0,fgPaintSel);
}

you draw everything again by drawStroke

consider use Bitmap class, and draw on it in onTouchEvent if you won't support revert.

or create something like:

class DrawStep {
    public int color;
    public int width;
    public ArrayList points;
}

and save List<DrawStep> instead of ArrayList strokes