XML
文件
< com.example.myapplication.MyViewxmlns: android = " http://schemas.android .com/apk/res/android " android : layout_width= " match_parent" android : layout_gravity= " center" android : layout_height= " 400dp" />
自定义View
代码
class MyView @JvmOverloads constructor ( context: Context, attrs: AttributeSet? = null , defStyleAttr: Int = 0
) : View ( context, attrs, defStyleAttr) { private var mStartColor = Color. REDprivate var mMiddleColor = Color. BLUEprivate var mEndColor = Color. GREENprivate var mDrawRect = RectF ( ) private var mLinearGradient: LinearGradient? = null private var mDrawPaint = Paint ( ) override fun onSizeChanged ( w: Int, h: Int, oldw: Int, oldh: Int) { super . onSizeChanged ( w, h, oldw, oldh) mDrawRect = RectF ( 0f , 0f , w. toFloat ( ) , h. toFloat ( ) ) } override fun onDraw ( canvas: Canvas) { super . onDraw ( canvas) mLinearGradient? . let { mDrawPaint. shader = itcanvas. drawRect ( mDrawRect, mDrawPaint) } }
}
LinearGradient
线性着色器参数详解
LinearGradient
线性着色器赋值给Paint
画笔,可以使用Canvas
画布和Paint
画笔绘制具有线性渐变的内容
两种构造函数
java">public LinearGradient ( float x0, float y0, float x1, float y1, @ColorInt int color0, @ColorInt int color1, @NonNull TileMode tile public LinearGradient ( float x0, float y0, float x1, float y1, @NonNull @ColorLong long [ ] colors, @Nullable float [ ] positions, @NonNull TileMode tile
起始点(x, y)
和结束点(x, y)
决定颜射映射方向和映射范围
如果着色器铺满整个绘制区域,区域有可能是Rect,Circle,Path
,最后一个参数颜色映射方式Shader.TileMode
会失效 水平方向
mLinearGradient = LinearGradient ( mDrawRect. left, mDrawRect. top, mDrawRect. right, mDrawRect. top, mStartColor, mEndColor, Shader. TileMode. MIRROR
)
mLinearGradient = LinearGradient ( mDrawRect. left, mDrawRect. top, mDrawRect. left, mDrawRect. bottom, mStartColor, mEndColor, Shader. TileMode. MIRROR
)
mLinearGradient = LinearGradient ( mDrawRect. left, mDrawRect. top, mDrawRect. right, mDrawRect. bottom, mStartColor, mEndColor, Shader. TileMode. MIRROR
)
颜色数组IntArray
和位置数组FloatArray
决定颜色的数量和位置
起始颜色mStartColor
和过渡颜色mMiddleColor
只作用于[0f, 0.1f]
这个区间 过渡颜色mMiddleColor
和结束颜色mEndColor
只作用于[0.9, 1f]
这个区间 过渡颜色mMiddleColor
只作用于[0.1f, 0.9f]
这个区间
mLinearGradient = LinearGradient ( mDrawRect. left, mDrawRect. top, mDrawRect. right, mDrawRect. top, intArrayOf ( mStartColor, mMiddleColor, mMiddleColor, mEndColor) , floatArrayOf ( 0f , 0.1f , 0.9f , 1f ) , Shader. TileMode. MIRROR
)
映射方式Shader.TileMode
决定着色器绘制区域之外的部分如何绘制
着色器绘制区域就是创建LinearGradient
的时候指定的 Shader.TileMode.CLAMP
作用:边缘填充,只有结束颜色填充绘制区域之外的部分
mLinearGradient = LinearGradient ( mDrawRect. left, mDrawRect. top, mDrawRect. right/ 2 , mDrawRect. top, mStartColor, mEndColor, Shader. TileMode. CLAMP
)
Shader.TileMode.REPEAT
作用:重复填充,开始颜色和结束颜色一起填充绘制区域之外的部分
mLinearGradient = LinearGradient ( mDrawRect. left, mDrawRect. top, mDrawRect. right/ 2 , mDrawRect. top, mStartColor, mEndColor, Shader. TileMode. REPEAT)
Shader.TileMode.MIRROR
作用:镜像填充,开始颜色和结束颜色一起填充绘制区域之外的部分
mLinearGradient = LinearGradient ( mDrawRect. left, mDrawRect. top, mDrawRect. right/ 2 , mDrawRect. top, mStartColor, mEndColor, Shader. TileMode. MIRROR
)