Notepad (9) for android projects ----- eraser, brush size, and paint color for the canvas Function

Source: Internet
Author: User

Notepad (9) for android projects ----- eraser, brush size, and paint color for the canvas Function

The above Section has implemented the painting, deletion, and restoration functions in the drawing board, as well as the eraser, setting the paint brush size and color is not implemented, this section will implement these functions one by one.

First look:

The first shows the function of setting the paint brush color, the second shows the color of setting the paint brush size, and the third shows the function of the eraser, this section sets the icon color to blue and adds the leftmost button (in fact, an item is added to the gridview ).

Next we will discuss the main idea of setting the size and color of a paint brush by using an eraser:

1. Eraser function:

Basic Principles:The eraser is a paint brush of the same color as the canvas in the screen touch. It is simple to implement the eraser function.

1) initialize the paint brush and set the color of the paint brush to white (in fact, set it to the canvas color ).

2) set the size of the paint brush to a proper size.

3) Use a variable to remember the color of the eraser and use it again after other operations.

2. Set the paint brush size:

1) initialize the paint brush.

2) set the paint brush size to the selected size.

3) Use a variable to remember the size of the current paint brush. It is used to keep the size of the previously set paint brush after other operations.

3. Set the paint brush color:

1) initialize the paint brush.

2) set the paint brush color to the selected color.

3) Use a variable to remember the color of the current paint brush. It is used to maintain the color of the previously set paint brush after other operations.

The main code is as follows:

 private Bitmap  mBitmap; private int currentColor = Color.RED;         private int currentSize = 5; private int currentStyle = 1;
// Set the Paint brush style public void setPaintStyle () {mPaint = new Paint (); mPaint. setAntiAlias (true); mPaint. setDither (true); mPaint. setStyle (Paint. style. STROKE); mPaint. setStrokeJoin (Paint. join. ROUND); mPaint. setStrokeCap (Paint. cap. ROUND); mPaint. setStrokeWidth (currentSize); if (currentStyle = 1) mPaint. setColor (currentColor); else {mPaint. setColor (Color. WHITE );}}
// Initialize the canvas public void initCanvas () {setPaintStyle (); mBitmapPaint = new Paint (Paint. DITHER_FLAG); // canvas size mBitmap = Bitmap. createBitmap (bitmapWidth, bitmapHeight, Bitmap. config. RGB_565); mCanvas = new Canvas (mBitmap); // All mCanvas objects are saved in mBitmap. drawColor (Color. WHITE); mPath = new Path (); mBitmapPaint = new Paint (Paint. DITHER_FLAG );}


Set the paint brush style:

// Set the paint brush style public void selectPaintStyle (int which) {if (which = 0) {currentStyle = 1; setPaintStyle () ;}// when an eraser is selected, set the color to white if (which = 1) {currentStyle = 2; setPaintStyle (); mPaint. setStrokeWidth (20 );}}


Set the paint brush size:

// Select the paint brush size public void selectPaintSize (int which) {int size = Integer. parseInt (this. getResources (). getStringArray (R. array. paintsize) [which]); currentSize = size; setPaintStyle ();}

Set the paint color:

// Set the paint brush color public void selectPaintColor (int which) {currentColor = paintColor [which]; setPaintStyle ();}


Of course, these methods are implemented in the Custom view, that is, PaintView. Next, you can call the custom View method by clicking the button at the bottom to implement the corresponding functions.

// Select the paint brush style case 0: showMoreDialog (view); break; // paint brush size case 1: showPaintSizeDialog (view); break; // paint color case 2: showPaintColorDialog (view); break;

// Public void showPaintColorDialog (View parent) {AlertDialog. builder alertDialogBuilder = new AlertDialog. builder (this, R. style. custom_dialog); alertDialogBuilder. setTitle ("select paint color:"); alertDialogBuilder. setSingleChoiceItems (R. array. paintcolor, select_paint_color_index, new DialogInterface. onClickListener () {@ Overridepublic void onClick (DialogInterface dialog, int which) {select_paint_color_index = which; paintView. selectPaintColor (which); dialog. dismiss () ;}}); alertDialogBuilder. setNegativeButton ("cancel", new DialogInterface. onClickListener () {@ Overridepublic void onClick (DialogInterface dialog, int which) {dialog. dismiss () ;}}); alertDialogBuilder. create (). show () ;}// the paint brush size dialog box public void showPaintSizeDialog (View parent) {AlertDialog. builder alertDialogBuilder = new AlertDialog. builder (this, R. style. custom_dialog); alertDialogBuilder. setTitle ("select the paint brush size:"); alertDialogBuilder. setSingleChoiceItems (R. array. paintsize, select_paint_size_index, new DialogInterface. onClickListener () {@ Overridepublic void onClick (DialogInterface dialog, int which) {select_paint_size_index = which; paintView. selectPaintSize (which); dialog. dismiss () ;}}); alertDialogBuilder. setNegativeButton ("cancel", new DialogInterface. onClickListener () {@ Overridepublic void onClick (DialogInterface dialog, int which) {dialog. dismiss () ;}}); alertDialogBuilder. create (). show () ;}// the public void showMoreDialog (View parent) {AlertDialog dialog box appears when you select a paint brush or eraser. builder alertDialogBuilder = new AlertDialog. builder (this, R. style. custom_dialog); alertDialogBuilder. setTitle ("select paint brush or eraser:"); alertDialogBuilder. setSingleChoiceItems (R. array. paintstyle, select_paint_style_index, new DialogInterface. onClickListener () {@ Overridepublic void onClick (DialogInterface dialog, int which) {select_paint_style_index = which; paintView. selectPaintStyle (which); dialog. dismiss () ;}}); alertDialogBuilder. setNegativeButton ("cancel", new DialogInterface. onClickListener () {@ Overridepublic void onClick (DialogInterface dialog, int which) {dialog. dismiss () ;}}); alertDialogBuilder. create (). show ();}

Arrays. xml is used as follows:

 
     
          
   
    @string/track_line
           
   
    @string/Eraser
       
      
          
   
    5
           
   
    10
           
   
    15
           
   
    20
           
   
    25
           
   
    30
       
       
          
   
    RED
           
   
    BLUE
           
   
    BLACK
           
   
    GREEN
           
   
    YELLOW
           
   
    CYAN
           
   
    LTGRAY
       
      
 

So far, all the functions of the canvas have been implemented.

In fact, another interesting feature is to set a pencil icon for the paint brush. The main principle is to load the pencil image in the ondraw method of the custom View, and set the image to move along with the path.

Add the following to the ondraw method in the Custom View:

// If (this. isMoving & currentColor! = Color. WHITE) {// set the paint brush icon Bitmap pen = BitmapFactory. decodeResource (this. getResources (), R. drawable. pen); canvas. drawBitmap (pen, this. mX, this. mY-pen. getHeight (), new Paint (Paint. DITHER_FLAG ));}








Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.