Paint 特效大全,看这一篇就够了!

之前写了一篇《超详细:常用的设计模式汇总》,很多人看了都说好,谢谢大家的鼓励,以后我会写更好的文章来帮助更多的人。

《Paint 特效大全,看这一篇就够了!》

国庆长假快结束了,感觉身体要被掏空了,有木有!国庆节不是应该休息的嘛,妈的,简直了,比上班还累。。。万万没想到,生活不只眼前的苟且,还有远方的苟且。。。(我想默默地说一句,握了棵草~)
但是不管怎么样,日子还是要过的,今天抽空,写一篇博客吧,好几天没写博客了,手有点欠。看到上面的图了吗,全是英文,我是在Android官网截下来的。今天我们的主题就是Paint,我把官网上比较重要的知识点都罗列在下面了,如果有疏漏,请告诉我,我会补全它。谢谢~

getXXX()

像这种获取某一属性的方法,我在这里就不讲了,因为我觉得没什么意思,如果你实在闲得无聊,你可以自己去官网看文档,我不拦你。当然,也不排除有些人故意跟我作对,说什么getXXX()也是蛮重要的,我就当没听见啊,抱歉了!!!

setColor、setARGB、setAlpha

这三个方法都是设置画笔的颜色的,都很简单,我总结一下:
setColor:设置rgb颜色
setAlpha:设置透明度
setAlpha:设置ARGB颜色
所以,setAlpha+setColor=setARGB,如果觉得我说得不对的,可以留言啊,我会改正的

setColorFilter(ColorFilter filter)

需要传一个ColorFilter类型的参数,ColorFilter是干嘛用的呢?我这里只能跟你简单解释一下,因为时间有限,后面好多方法排着队让我介绍呢。
ColorFilter,顾名思义,颜色过滤器,举个简单的例子吧,大家都用过美颜相机吧,美颜相机可以给一张照片设置很多的风格,一张普普通通的自拍照,经过美颜相机的特效处理,脸蛋可以变得紅噗噗的,大长腿,大白腿,太假了!!!
关于ColorFilter的原理和使用方法,我在这里就不废话了,说起来也好复杂的,我贴一个网址吧,写得还不错的,感兴趣的人可以去看看详解Paint的setColorFilter(ColorFilter filter)

setDither(boolean dither)

设置是否抖动,看效果图吧

《Paint 特效大全,看这一篇就够了!》

没有设置抖动

《Paint 特效大全,看这一篇就够了!》

设置抖动了

第二个是不是比第一个图柔和点,不同颜色的交界处没有那么明显,有个过渡效果,这就是防抖动的效果。 平常使用的话我们一般都会设置成抖动的

setAntiAlias(boolean aa)

设置是否抗锯齿。看效果图吧

《Paint 特效大全,看这一篇就够了!》

左边的是没有设置抗锯齿,右边的设置了抗锯齿,效果已经很明显了。一般我们在画线段的时候会设置这个属性,因为如果不设置这个属性,在线段的拐弯处会看到明显的锯齿。

setFilterBitmap(boolean filter)

如果该项设置为true,则图像在动画进行中会滤掉对Bitmap图像的优化操作,加快显示速度,本设置项依赖于dither和xfermode的设置。

setLetterSpacing(float letterSpacing)

设置行间距,默认是0

setLinearText (boolean linearText)

设置是否打开线性文本标识,这玩意对大多数人来说都很奇怪不知道这玩意什么意思。想要明白这东西你要先知道文本在Android中是如何进行存储和计算的。在Android中文本的绘制需要使用一个bitmap作为单个字符的缓存,既然是缓存必定要使用一定的空间,我们可以通过setLinearText (true)告诉Android我们不需要这样的文本缓存。

setStrokeWidth(int width)

设置画笔的粗细

setStyle(Style style)

设置画笔的样式
Paint.Style.STROKE 描边,只画图形的轮廓
Paint.Style.FILL 填充,从起点开始,一直到终点形成扇形的绘制区。Paint.Style.FILL_AND_STROKE 为扇形区再加上一个圈

《Paint 特效大全,看这一篇就够了!》

《Paint 特效大全,看这一篇就够了!》

Paste_Image.png

setTextAlign(Paint.Align align)

文本的对齐方式

setXfermode (Xfermode xfermode)
设置图像的混合方式,官方给出了一张图,我们一看便知

《Paint 特效大全,看这一篇就够了!》

这个方法很强大,可以处理很多种效果,比如我们想要把我们自己的头像显示到一个五角星上面去,我们可以先在canvas上画出我们的头像,然后选择DstIn这个模式,最后再把五角星画上去,然后我们就可以看到五角星上面有我们的头像了

setPathEffect(PathEffect effect)

设置路径效果,PathEffect有6个子类实现ComposePathEffect, CornerPathEffect, DashPathEffect, DiscretePathEffect, PathDashPathEffect, SumPathEffect
具体代码:

public class PaintCanvas extends View {
    private Paint mPaint;   
    // 路径对象
    private Path mPath;
    private PathEffect[] pathEffects = new PathEffect[7];
    private float mPhase=5;
    //省略构造方法
    private void init() {       
        mPaint = new Paint();
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeWidth(5);
        mPaint.setAntiAlias(true);
        initPath();       
    }
    private void initPath() {
        // 实例化路径
        mPath = new Path();
        // 定义路径的起点
        mPath.moveTo(10, 50);
        // 定义路径的各个点
        for (int i = 0; i <= 30;="" i++)="" {="" mpath.lineto(i="" *="" 35,="" (float)="" (math.random()="" 100));="" }="" 什么都不处理="" patheffects[0]="null;" 参数1:线段之间的圆滑程度="" patheffects[1]="new" cornerpatheffect(10);="" 参数1:间隔线条长度(length="">=2),如float[] {20, 10}的偶数参数20定义了我们第一条实线的长度,
        //而奇数参数10则表示第一条虚线的长度,后面不再有数据则重复第一个数以此往复循环;参数2:虚实线间距
        pathEffects[2] = new DashPathEffect(new float[]{20, 10}, mPhase);
        //参数1:值越小杂点越密集;参数2:杂点突出的大小,值越大突出的距离越大
        pathEffects[3] = new DiscretePathEffect(5.0f, 10.0f);
        Path path = new Path();
        path.addRect(0, 0, 8, 8, Path.Direction.CCW);
        //定义路径虚线的样式,参数1:path;参数2:实线的长度;参数3:虚实线间距
        pathEffects[4] = new PathDashPathEffect(path, 20, mPhase, PathDashPathEffect.Style.ROTATE);
        pathEffects[5] = new ComposePathEffect(pathEffects[2], pathEffects[4]);
        //ComposePathEffect和SumPathEffect都可以用来组合两种路径效果,具体区别(不知道如何描述)小伙伴们自己试试
        pathEffects[6] = new SumPathEffect(pathEffects[4], pathEffects[3]);
    }
    @Override
    protected void onDraw(Canvas canvas) {      
         /*
         * 绘制路径
         */
        for (int i = 0; i < pathEffects.length; i++) {
            mPaint.setPathEffect(pathEffects[i]);
            canvas.drawPath(mPath, mPaint);
            // 每绘制一条将画布向下平移250个像素
            canvas.translate(0, 250);
        }
    }
}
    

《Paint 特效大全,看这一篇就够了!》

各种path效果图展示

setShader(Shader shader)

设置着色器
BitmapShader(Bitmap bitmap, Shader.TileMode tileX, Shader.TileMode tileY)
第一个参数是Bitmap对象,该Bitmap决定了用什么图片对绘制的图形进行贴图。
第二个参数表示横向的填充方式,第三个参数表示纵向的填充方式
第二个参数和第三个参数都是Shader.TileMode类型的枚举值,有以下三个取值:CLAMP 、REPEAT 和 MIRROR。
CLAMP表示,当所画图形的尺寸大于Bitmap的尺寸的时候,会用Bitmap四边的颜色填充剩余空间。
REPEAT表示,当我们绘制的图形尺寸大于Bitmap尺寸时,会用Bitmap重复平铺整个绘制的区域。
MIRROR,与REPEAT类似,当绘制的图形尺寸大于Bitmap尺寸时,MIRROR也会用Bitmap重复平铺整个绘图区域,与REPEAT不同的是,两个相邻的Bitmap互为镜像。
看效果图

《Paint 特效大全,看这一篇就够了!》

CLAMP方式

《Paint 特效大全,看这一篇就够了!》

REPEAT方式

《Paint 特效大全,看这一篇就够了!》

MIRROR方式

LinearGradient
我们可以用LinearGradient创建线性渐变效果,其有两个构造函数:
LinearGradient(float x0, float y0, float x1, float y1, int color0, int color1, Shader.TileMode tile)
LinearGradient(float x0, float y0, float x1, float y1, int[] colors, float[] positions, Shader.TileMode tile)

我们重点说一下第一个构造函数,在此基础上理解第二个构造函数就很简单了。
LinearGradient是用来创建线性渐变效果的,它是沿着某条直线的方向渐变的,坐标(x0,y0)就是这条渐变直线的起点,坐标(x1,y1)就是这条渐变直线的终点。需要说明的是,坐标(x0,y0)和坐标(x1,y1)都是Canvas绘图坐标系中的坐标。color0和color1分别表示了渐变的起始颜色和终止颜色。与BitmapShader类似,LinearGradient也支持TileMode,有以下三个取值:CLAMP 、REPEAT 和 MIRROR。
看效果图

《Paint 特效大全,看这一篇就够了!》

CLAMP

《Paint 特效大全,看这一篇就够了!》

MIRROR

《Paint 特效大全,看这一篇就够了!》

REPEAT

RadialGradient
我们可以用RadialGradient创建从中心向四周发散的辐射渐变效果,其有两个构造函数:
RadialGradient(float centerX, float centerY, float radius, int centerColor, int edgeColor, Shader.TileMode tileMode)RadialGradient(float centerX, float centerY, float radius, int[] colors, float[] stops, Shader.TileMode tileMode)

这两个构造函数和LinearGradient的两个构造函数很类似,我们此处还是重点讲解第一个构造函数,在此基础上理解第二个构造函数就很简单了。
RadialGradient是用来创建从中心向四周发散的辐射渐变效果的,所以我们需要在其构造函数中传入一些圆的参数,坐标(centerX,centerY)是圆心,即起始的中心颜色的位置,radius确定了圆的半径,在圆的半径处的颜色是edgeColor,这样就确定了当位置从圆心移向圆的轮廓时,颜色逐渐从centerColor渐变到edgeColor。RadialGradient也支持TileMode参数,有以下三个取值:CLAMP 、REPEAT 和 MIRROR。
看效果图

《Paint 特效大全,看这一篇就够了!》

MIRROR

《Paint 特效大全,看这一篇就够了!》

CLAMP

《Paint 特效大全,看这一篇就够了!》

REPEAT

在RadialGradient的第二个构造函数中可以通过参数colors传入多个颜色值进去,这样就会用colors数组中指定的颜色值一起进行颜色线性插值。还可以指定stops数组,该数组中每一个stop对应colors数组中每个颜色在半径中的相对位置,stop取值范围为[0,1],0表示圆心位置,1表示圆周位置。如果stops数组为null,那么Android会自动为colors设置等间距的位置。

SweepGradient
SweepGradient可以用来创建360度颜色旋转渐变效果,具体来说颜色是围绕中心点360度顺时针旋转的,起点就是3点钟位置。
SweepGradient有两个构造函数:
SweepGradient(float cx, float cy, int color0, int color1)SweepGradient(float cx, float cy, int[] colors, float[] positions)

SweepGradient不支持TileMode参数,我们先讲解第一个构造函数。
坐标(cx,cy)决定了中心点的位置,会绕着该中心点进行360度旋转。color0表示的是起点的颜色位置,color1表示的是终点的颜色位置。

《Paint 特效大全,看这一篇就够了!》

ComposeShader
ComposeShader,顾名思义,就是混合Shader的意思,它可以将两个Shader按照一定的Xfermode组合起来。

《Paint 特效大全,看这一篇就够了!》

看到没有,我通过ComposeShader画出了一个很有个性的爱心,紅噗噗的,中间有条白杠子,需要源码的可以留言,我给你源码

今天就先说到这里吧,有点累了,需要休息休息。

写这篇文章的目的就是希望可以完善一下自己的知识,然后帮助更多像我一样菜的人。收藏起来吧,以后需要用到的时候可以点开来直接看。

觉得我写的好的人可以点个赞,收藏下哈,就当鼓励鼓励我这个菜鸟了。
另外,本人的微信公众号开播啦,有兴趣的可以扫下面的二维码,添加个关注啥的,意思意思,再见啦,以后我会更新的。
微信公众号:代码也是人

《Paint 特效大全,看这一篇就够了!》

微信公众号—代码也是人

    原文作者:Android
    原文地址: https://juejin.im/entry/57f3a66367f35600584bbfbf
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞