Introduction to the
Paint can be viewed as a brush and can define properties such as color, line, pattern, fill, and so on
Common functions/methods
| methods | function | note |
|---|---|---|
| setColor() | Set the brush color | |
| setStrokeWidth() | Set the brush line width (in px) | When the canvas is scaled, the brush size will be scaled, but when you set setStrokeWidth(0), it won’t be scaled, it will always be 1px |
| setAntiAlias() | Set whether to enable antialiasing | |
| setAlpha() | Set the brush transparency | Parameter Value Range [0-255] |
| setARGB() | Set transparency & color | |
| setStyle() | Set brush stroke mode or fill mode or fill inside + stroke | FILL with FILL_AND_STROKE Paint.Style.STROKE: STROKE Paint.Style. FILL and STROKE: STROKE is half the size of the brush |
| setStrokeJoin() | Sets the transition style when the brush connects to the thread head | MITER: straight ROUND: slow connection BEVEL: oblique connection |
| setStrokeMiter() | The length of the bevel connection mode is limited | |
| setStrokeCap() | Set the brush style for dots (/ circles), and the brush style for lines when the nib leaves/touches the canvas | He put his BUTT into his ROUND and his SQUARE head |
| setPathEffect() | Set the drawing style | PathEffect pathEffect = new CornerPathEffect(20); // Radius values for rounded corners paint. SetPathEffect (pathEffect); // The corner buffer is rounded / / dotted line PathEffect dashPathEffect = new DashPathEffect(new float[]{100, 50}, 0); // The number of arrays must be an even number, which is used to set the length of the displayed and hidden arrays, and 0 is the offset paint.setPathEffect(dashPathEffect); // Set to a dashed line // Use path to draw dotted lines Path dashPath ; // Draw the shape PathEffect pathEffect = new PathDashPathEffect(dashPath, 40, 0, PathDashPathEffectStyle.TRANSLATE); // Parameter 1: custom Path, parameter 2: space interval, parameter 3: offset, parameter 4: corner buffer style (displacement: TRANSLATE, rotation: MORPH) paint.setPathEffect(pathEffect); // Set the dashed line for the custom shape // The line is randomly shifted Paint. SetPathEffect (new DiscretePathEffect (50, 10)); // Parameter 1: segment length, parameter 2: offset // Draw the line simultaneously PathEffect sumPathEffect = new SumPathEffect(dashPathEffect, discretePathEffect); paint.setPathEffect(sumPathEffect); // Merge the draw PathEffect dashPathEffect = new DashPathEffect(new float[]{20, 10}, 0); PathEffect discretePathEffect = new DiscretePathEffect(20, 5); PathEffect composePathEffect = new ComposePathEffect(dashPathEffect, discretePathEffect); paint.setPathEffect(composePathEffect ); When using PathEffect, you need to turn off hardware acceleration |
| setShader() | Setting brush Gradient | LinearGradient linearGradient = new LinearGradient(100,100,200,100, Color.RED,Color.BLUE,Shader.TileMode.MIRROR) ; // Set the gradient area properties paint.setShader(linearGradient); // Set the linear gradient Canvas. DrawLine (100100500100, paint); / / line Canvas. DrawRect (100200500500, paint); / / draw a rectangle That LinearGradient that LinearGradient = new that LinearGradient (100100500100, new int [] {Color. RED, the Color YELLOW, Color, BLUE}, new Float [] {0,0.5 f, 1}, Shader. TileMode. CLAMP); // Set the first 2 parameters of the gradient area property: starting coordinate, next2 parameter: end coordinate, next parameter: multiple colors, next parameter: color position ratio, nex gradient mode: paint.setShader(linearGradient); // Set the linear gradient Canvas. DrawLine (100100500100, paint); / / line // ComposeShader ComposeShader. // ComposeShader ComposeShader // Two colors SweepGradient SweepGradient = new SweepGradient (. 400400, Color. RED, the Color BLUE); // Set the starting and ending color of the center xy paint.setShader(sweepGradient); // Set the scan gradient Canvas. Methods like drawCircle (400400300, paint); // Center xy, radius r // Multiple colors SweepGradient = new sweepGradient (0, 400120 new int [] {Color. RED, the Color YELLOW, Color, GRAY, Color, BLUE}, null); // Set the center of the circle, color, position ratio, set to NULL to split evenly paint.setShader(sweepGradient); // Set the scan gradient Canvas. Methods like drawCircle (400120, 0300, paint); / / to draw // Two colors RadialGradient radialGradient = new RadialGradient (400400300, Color. RED, the Color BLUE, Shader. TileMode. CLAMP); // Set the gradient area properties paint.setShader(radialGradient); // Set the radial gradient Canvas. Methods like drawCircle (400400300, paint); // The center of the circle, xy, radius r // Multiple colors RadialGradient = new radialGradient (400120, 0300, new int [] {Color. RED, the Color YELLOW, Color, GRAY, Color, BLUE}, new Float [] {0,0.4 f, 0.8 f, 1}, Shader. TileMode. CLAMP); // Center xy, radius r, color array, color position scale, gradient mode paint.setShader(radialGradient); // Set the radial gradient Canvas. Methods like drawCircle (400120, 0300, paint); // Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.agns); // Obtain image resources and convert them into bitmap objects BitmapShader bitmapShader = new BitmapShader(bitmap,Shader.TileMode.REPEAT,Shader.TileMode.CLAMP); // Set the tiling mode for x,y paint.setShader(bitmapShader); Canvas. DrawRect (10,10,800,800, paint); Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); // Obtain image resources and convert them into bitmap objects Shader shader1 = new BitmapShader(bitmap,Shader.TileMode.REPEAT,Shader.TileMode.MIRROR); // Set the x,y direction format LinearGradient shader2 = new LinearGradient(// LinearGradient 0,0,500,0, Color. RED Color. BLUE, Shader. TileMode. MIRROR); // ComposeShader: Combine two shaders Shader shader = new ComposeShader(shader1, shader2, PorterDuff.Mode.XOR); //XOR represents clipping shader1 shader2 intersection paint.setShader(shader); Canvas. DrawRect (0, 0, getRight (), getBottom (), paint); |
* Color effect processing
| methods | function | note |
|---|---|---|
| setColorFilter() | Set the color filter | Bitmap bitmap =BitmapFactory.decodeResource(getResources(),R.mipmap.agns); // Obtain image resources and convert them into bitmap objects Canvas. DrawBitmap (bitmap, 200200, paint); ColorFilter lightingColorFilter = new LightingColorFilter(0x00ffff, 0x000000); // Remove the red ColorFilter lightingColorFilter = new LightingColorFilter(0xffffff, 0x008800); // Thicken the green paint.setColorFilter(lightingColorFilter); Canvas. DrawBitmap (bitmap, 200600, paint); |
| Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); // Get the image Canvas. DrawBitmap (bitmap, 200200, paint); ColorFilter colorFilter = new PorterDuffColorFilter(Color.GREEN, PorterDuff.Mode.XOR); // Remove the part combined with green paint.setColorFilter(colorFilter); Canvas. DrawBitmap (bitmap, 200600, paint); |
||
| Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); // Get the image resource Canvas. DrawBitmap (bitmap, 200200, paint); ColorFilter colorFilter = new PorterDuffColorFilter(Color.GREEN, PorterDuff.Mode.XOR); // paint.setColorFilter(colorFilter); Canvas. DrawBitmap (bitmap, 200600, paint); |
||
| Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); // Get the image resource Canvas. DrawBitmap (bitmap, 200200, paint); ColorMatrix colorFilter = new ColorMatrix(new float[]{ -1f, 0f, 0f, 0f, 255f, 0f, -1f, 0f, 0f, 255f, 0f, 0f, -1f, 0f, 255f, 0f, 0f, 0f, 1f, 0f }); paint.setColorFilter(new ColorMatrixColorFilter(colorFilter)); Canvas. DrawBitmap (bitmap, 200600, paint); |
||
| Bitmap bitmapone = BitmapFactory.decodeResource(getResources(),R.mipmap.ic_launcher_2); // Obtain image resources and convert them into bitmap objects Bitmap bitmapTwo = BitmapFactory.decodeResource(getResources(),R.mipmap.rect_2); // Obtain image resources and convert them into bitmap objects Xfermode xfermode = new PorterDuffXfermode(PorterDuff.Mode.DST_IN); // Take the intersection, the intersection style depends on the lower level, the color depends on the upper level int saved = canvas.saveLayer(null, null, Canvas.ALL_SAVE_FLAG); canvas.drawBitmap(bitmapTwo, 0, 0, paint); paint.setXfermode(xfermode); / / set Xfermode canvas.drawBitmap(bitmapone, 0, 0, paint); paint.setXfermode(null); // Clear Xfermode as soon as it is used up canvas.restoreToCount(saved); |
* Color optimization
Self – built Bitmap drawing, low bit depth can be opened, the effect is obvious.
mPaint.setDither(true);// Enable image jitter
mPaint.setFilterBitmap(true); // Turn on linear filtering
Copy the codeSet the Shadow effect – below the layer
mPaint.setShadowLayer(20.0.0, Color.RED);//
canvas.drawText("Words with shadows.".100.100,mPaint);// Shadow blur range, offset x,y, shadow color
mPaint.clearShadowLayer(); // Clear shadows
Copy the codeSet the montmorillonite layer
this.setLayerType(LAYER_TYPE_SOFTWARE, null);
Bitmap bitmapone = BitmapFactory.decodeResource(getResources(),R.mipmap.agns); // Obtain image resources and convert them into bitmap objects
BlurMaskFilter blurMaskFilterNORMAL = new BlurMaskFilter(50,BlurMaskFilter.Blur.NORMAL);
mPaint.setMaskFilter(blurMaskFilterNORMAL);
canvas.drawBitmap(bitmapone,50.200,mPaint);
/ / EmbossMaskFilter way
this.setLayerType(LAYER_TYPE_SOFTWARE, null);
// Direction is an array of three elements, specifying the direction of the light source; Ambient is the intensity of ambient light, ranging from 0 to 1. Specular is the coefficient of light shine; BlurRadius is the scope for applying light.
EmbossMaskFilter embossMaskFilter = new EmbossMaskFilter(new float[] {10.10.10}, 0.1 f.5.5);
mPaint.setMaskFilter(embossMaskFilter);
canvas.drawText("Test".100.700,mPaint);
Copy the code