牛X素材推荐之TriangleRectangleLabelView

转载请注明出处:王亟亟的大牛之路

Git上看到一个比较给力的自定义展示标签的View,分享给大家TriangleRectangleLabelView。然后根据原作者的代码我会对其中运用的一些技术点加以解释,在此在此谢谢原作者的开源精神

先贴一下运行效果:

包结构

整体实现还是很轻量级的,只有一个实现的class和attrs来处理初始化。

TriangleRectangleLabelView(作者已详细标注)

{String TAG = TriangleRectangleLabelView.class.getSimpleName();DEFAULT_BG_COLOR = 0xff41c7cd;DEFAULT_CIRCLE_COLOR = 0xffffffff;DEFAULT_LINE_COLOR = 0xfffb9ece;DEFAULT_HEIGHT = DEFAULT_WIDTH = DEFAULT_ROUND_RECT_RADIUS = DEFAULT_ROUND_RECT_WIDTH = 8;//pxprivate Paint mBgPaint;private Paint mCirclePaint;private Paint mLinePaint;mRoundRectRadius = DEFAULT_ROUND_RECT_RADIUS;mCircleRadius = mCircleSpaceRectangle = mSpaceHeight = mLineWidth = mBgColor = DEFAULT_BG_COLOR;mLineColor = DEFAULT_LINE_COLOR;mCircleColor = DEFAULT_CIRCLE_COLOR;isShowLine = isShowCircle = isDrawRoundRect = isLeft = isFirstPadding = true;LINE_MODE {START, MIDDLE, END}public TriangleRectangleLabelView(Context context) {this(context, null);}public TriangleRectangleLabelView(Context context, AttributeSet attrs) {this(context, attrs, 0);}public TriangleRectangleLabelView(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initAttrs(attrs);init();}(AttributeSet attrs) {if (attrs != null) {TypedArray a = getContext().obtainStyledAttributes(attrs, R.styleable.TriangleRectangleLabelView);mBgColor = a.getColor(R.styleable.TriangleRectangleLabelView_trlvBgColor, mBgColor);mLineColor = a.getColor(R.styleable.TriangleRectangleLabelView_trlvLineColor, mLineColor);mCircleColor = a.getColor(R.styleable.TriangleRectangleLabelView_trlvCircleColor, mCircleColor);isLeft = a.getBoolean(R.styleable.TriangleRectangleLabelView_trlvIsLeft, isLeft);isShowLine = a.getBoolean(R.styleable.TriangleRectangleLabelView_trlvIsShowLine, isShowLine);isShowCircle = a.getBoolean(R.styleable.TriangleRectangleLabelView_trlvIsShowCircle, isShowCircle);isDrawRoundRect = a.getBoolean(R.styleable.TriangleRectangleLabelView_trlvIsDrawRoundRect, isDrawRoundRect);mCircleRadius = a.getDimensionPixelSize(R.styleable.TriangleRectangleLabelView_trlvCircleRadius, mCircleRadius);mCircleSpaceRectangle = a.getDimensionPixelSize(R.styleable.TriangleRectangleLabelView_trlvCircleSpaceRectangle, mCircleSpaceRectangle);mLineWidth = a.getDimensionPixelSize(R.styleable.TriangleRectangleLabelView_trlvLineWidth, mLineWidth);mRoundRectWidth = a.getDimensionPixelSize(R.styleable.TriangleRectangleLabelView_trlvRoundRectWidth, mRoundRectWidth);mRoundRectRadius = a.getDimensionPixelSize(R.styleable.TriangleRectangleLabelView_trlvRoundRectRadius, mRoundRectRadius);DisplayMetrics dm = getResources().getDisplayMetrics();int minHeight = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, DEFAULT_HEIGHT, dm);int minWidth = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, DEFAULT_WIDTH, dm);setMinHeight(minHeight);setMinWidth(minWidth);a.recycle();}}() {mBgPaint = new Paint(Paint.ANTI_ALIAS_FLAG);mBgPaint.setStrokeWidth(4);mBgPaint.setStyle(Paint.Style.FILL);mBgPaint.setColor(mBgColor);mBgPaint.setAntiAlias(true);mCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG);mCirclePaint.setStrokeWidth(1);mCirclePaint.setStyle(Paint.Style.FILL);mCirclePaint.setColor(mCircleColor);mCirclePaint.setAntiAlias(true);mLinePaint = new Paint(Paint.ANTI_ALIAS_FLAG);mLinePaint.setStrokeWidth(mLineWidth);mLinePaint.setStyle(Paint.Style.FILL);mLinePaint.setColor(mLineColor);mLinePaint.setAntiAlias(true);}/*** 设置圆角矩形宽度** @param roundRectWidth px*/(int roundRectWidth) {this.mRoundRectWidth = roundRectWidth;postInvalidate();}/*** 设置圆角矩形圆角半径** @param roundRectRadius px*/(int roundRectRadius) {this.mRoundRectRadius = roundRectRadius;postInvalidate();}(int color) {mBgColor = color;mBgPaint.setColor(mBgColor);postInvalidate();}(int color) {mLineColor = color;mLinePaint.setColor(getContext().getResources().getColor(mLineColor));postInvalidate();}/*** 设置竖直线模式** @param lineMode LINE_MODE: START, MIDDLE, END*/(LINE_MODE lineMode) {this.mLineMode = lineMode;postInvalidate();}/*** 是否箭头朝向左** @param isLeft true:left false:right*/(boolean isLeft) {this.isLeft = isLeft;postInvalidate();}/*** 设置 View 上下间距** @param spaceHeight px*/(int spaceHeight) {this.mSpaceHeight = spaceHeight;isFirstPadding = true;postInvalidate();}/*** 设置原点与标签的间隔** @param circleSpaceRectangle px*/(int circleSpaceRectangle) {this.mCircleSpaceRectangle = circleSpaceRectangle;isFirstPadding = true;postInvalidate();}/*** 设置原点半径** @param circleRadius px*/(int circleRadius) {this.mCircleRadius = circleRadius;isFirstPadding = true;postInvalidate();}/*** 设置分割线宽度** @param lineWidth px*/(int lineWidth) {this.mLineWidth = lineWidth;mLinePaint.setStrokeWidth(mLineWidth);postInvalidate();}(boolean isShowLine) {this.isShowLine = isShowLine;postInvalidate();}(boolean isShowCircle) {this.isShowCircle = isShowCircle;postInvalidate();}(boolean isDrawRoundRect) {this.isDrawRoundRect = isDrawRoundRect;postInvalidate();}(Canvas canvas) {drawBackground(canvas);super.onDraw(canvas);}(Canvas canvas) {int height = getHeight();int width = getWidth();Log.d(TAG, “height = ” + height);Log.d(TAG, “width = ” + width);Log.d(TAG, “isFirstPadding = ” + isFirstPadding);//——————-Set Text Padding Begin—————————-//if (isFirstPadding) {int paddingLeft = mCircleRadius * 2 + mCircleSpaceRectangle + (height – mSpaceHeight) / 2 + 2;setPadding(isLeft ? paddingLeft : mRoundRectWidth, mSpaceHeight + 4, isLeft ? mRoundRectWidth + 4 : paddingLeft, mSpaceHeight + 4);setGravity(Gravity.CENTER_VERTICAL);isFirstPadding = false;}startLineX = isShowLine ? (isLeft ? mCircleRadius : width – mCircleRadius) : 0;if (isShowLine) {if (mLineMode == LINE_MODE.START) {canvas.drawLine(startLineX, height / 2, startLineX, height, mLinePaint);} else if (mLineMode == LINE_MODE.MIDDLE) {canvas.drawLine(startLineX, height, startLineX, 0, mLinePaint);} else if (mLineMode == LINE_MODE.END) {canvas.drawLine(startLineX, height / 2, startLineX, 0, mLinePaint);}}startCircleX = isShowCircle ? (isLeft ? mCircleRadius : width – mCircleRadius) : 0;if (isShowCircle) {canvas.drawCircle(startCircleX, height / 2, mCircleRadius, mCirclePaint);}roundLeft = isDrawRoundRect ? (isLeft ? width – mRoundRectWidth : 0) : 0;int roundRight = isDrawRoundRect ? (isLeft ? width : mRoundRectWidth) : 0;if (isDrawRoundRect) {//draw RoundRectRectF rect = new RectF();rect.left = roundLeft;rect.top = mSpaceHeight;rect.right = roundRight;rect.bottom = height – mSpaceHeight;canvas.drawRoundRect(rect, mRoundRectRadius, mRoundRectRadius, mBgPaint);}(isLeft) {//draw Triangle And Rectangleint startX = mCircleSpaceRectangle + 2 * mCircleRadius;Point a = new Point(startX, height / 2);Point b = new Point(startX + (height – mSpaceHeight) / 2, height – mSpaceHeight);Point c = new Point(width – (isDrawRoundRect ? mRoundRectWidth / 2 : 0), height – mSpaceHeight);Point d = new Point(width – (isDrawRoundRect ? mRoundRectWidth / 2 : 0), mSpaceHeight);Point e = new Point(startX + (height – mSpaceHeight) / 2, mSpaceHeight);Point f = new Point(startX, height / 2);Path path = new Path();path.moveTo(a.x, a.y);path.lineTo(b.x, b.y);path.lineTo(c.x, c.y);path.lineTo(d.x, d.y);path.lineTo(e.x, e.y);path.lineTo(f.x, f.y);canvas.drawPath(path, mBgPaint);} else {//draw Triangle And Rectangleint startX = width – (mCircleSpaceRectangle + 2 * mCircleRadius);Point a = new Point(startX, height / 2);Point b = new Point(startX – (height – mSpaceHeight) / 2, height – mSpaceHeight);Point c = new Point((isDrawRoundRect ? mRoundRectWidth / 2 : 0), height – mSpaceHeight);Point d = new Point((isDrawRoundRect ? mRoundRectWidth / 2 : 0), mSpaceHeight);Point e = new Point(startX – (height – mSpaceHeight) / 2, mSpaceHeight);Point f = new Point(startX, height / 2);Path path = new Path();path.moveTo(a.x, a.y);path.lineTo(b.x, b.y);path.lineTo(c.x, c.y);path.lineTo(d.x, d.y);path.lineTo(e.x, e.y);path.lineTo(f.x, f.y);canvas.drawPath(path, mBgPaint);}//——————-Draw Triangle And Rectangle End—————————-//}}

分析:

往往教导我们大家要好好学习天天向上,

牛X素材推荐之TriangleRectangleLabelView

相关文章:

你感兴趣的文章:

标签云: