Android 仿淘宝物流信息TimeLineView

Color.parseColor(“#cccccc”));

timelineCount = a.getInteger(R.styleable.TimeLineView_timelineCount, 0);

timelineWidth = (int) a.getDimension(

R.styleable.TimeLineView_timelineWidth,

convertDIP2PX(context, 1));

marginTop = (int) a.getDimension(

R.styleable.TimeLineView_timelineMarginTop,

convertDIP2PX(context, 50));

a.recycle();

mPaint = new Paint();

mPaint.setAntiAlias(true);

}

@Override

protected void onDraw(Canvas canvas) {

// 默认设置时间轴的位置位于view的中间

viewWidth = getMeasuredWidth() / 2;

// 设置第一个节点的颜色

mPaint.setColor(timelineHeadColor);

/**

• 根据时间轴的节点数目，画对应的节点和轴

*/

for (int j = 1; j <= timelineCount; j++) {

/**

• 当j==1，画第一个节点的时候，有点特殊，我们需要在节点的外面再换一个圆环

*/

if (j == 1) {

// 画笔设置为空心

canvas.drawCircle(viewWidth, timelineHeadRadius + marginTop,

timelineRadius, mPaint);

mPaint.setStyle(Paint.Style.STROKE);

mPaint.setStrokeWidth(5.0f);

// 画第一个节点外围的圆环

mPaint.setColor(timelineHeadColorEdge);

canvas.drawCircle(viewWidth, timelineHeadRadius + marginTop,

timelineHeadRadius, mPaint);

// 设置画笔颜色，画其他时间节点的颜色

mPaint.setColor(timelineOtherColor);

// 画笔设置为实心

mPaint.setStyle(Paint.Style.FILL);

/**

• 画第一个节点下面的轴

*/

canvas.drawRect(new Rect(viewWidth - timelineWidth / 2,

(int) (2 * timelineHeadRadius + marginTop) + 5,

viewWidth + timelineWidth / 2, (int) (2

• timelineHeadRadius + timelineRadiusDistance

• marginTop + 5)), mPaint);

continue;

}

/**

• 画时间轴的节点,即画圆形 圆心的x都是一样的,view的中间

• 圆心的y的计算是根据节点的位置来计算的,例如:第一个节点的y是根据第一个节点距离上面的距离加上第一个节点的半径

• :timelineHeadRadius + marginTop

• 其余的节点就是在一个节点的y的基础上,加上两倍半径和节点之间的轴的长度＊节点数:(2 * timelineRadius +

• timelineRadiusDistance) * (j - 1) + timelineHeadRadius -

• timelineRadius + marginTop

*/

canvas.drawCircle(viewWidth,

(2 * timelineRadius + timelineRadiusDistance) * (j - 1) + 2

• timelineHeadRadius - timelineRadius + marginTop,

timelineRadius, mPaint);

/**

• 画其余的轴 left:每个轴距离左边距离都是一样的　　　时间轴的中心位置-1/2的时间轴的宽度 viewWidth -

• timelineWidth / 2 top: (int) (j * (2 * timelineRadius +

• timelineRadiusDistance) - timelineRadiusDistance + 2 *

• (timelineHeadRadius-timelineRadius)+ marginTop)

• right:每个轴距离右边距离都是一样的　　　时间轴的中心位置+1/2的时间轴的宽度 viewWidth +

• timelineWidth / 2 bottom: (int) (j * (2 * timelineRadius +

• timelineRadiusDistance) + 2 *

• (timelineHeadRadius-timelineRadius)+ marginTop)

*/

canvas.drawRect(

new Rect(

viewWidth - timelineWidth / 2,

(int) (j

• (2 * timelineRadius + timelineRadiusDistance)

• timelineRadiusDistance + 2

• (timelineHeadRadius - timelineRadius) + marginTop),

viewWidth + timelineWidth / 2,

(int) (j

• (2 * timelineRadius + timelineRadiusDistance)

• 2 * (timelineHeadRadius - timelineRadius) + marginTop)),

mPaint);

}

}

public float getTimelineHeadRadius() {

return timelineHeadRadius;

}

public void setTimelineHeadRadius(float timelineHeadRadius) {

this.timelineHeadRadius = timelineHeadRadius;

invalidate();

}

public int getTimelineHeadColor() {

return timelineHeadColor;

}

public void setTimelineHeadColor(int timelineHeadColor) {

this.timelineHeadColor = timelineHeadColor;

invalidate();

}

public int getTimelineOtherColor() {

return timelineOtherColor;

}

public void setTimelineOtherColor(int timelineOtherColor) {

this.timelineOtherColor = timelineOtherColor;

invalidate();

}

public int getTimelineCount() {

return timelineCount;

}

public void setTimelineCount(int timelineCount) {

this.timelineCount = timelineCount;

invalidate();

}

public int getMarginTop() {

return marginTop;

}

public void setMarginTop(int marginTop) {

this.marginTop = marginTop;

invalidate();

}

public int getTimelineRadius() {

return timelineRadius;

}

public void setTimelineRadius(int timelineRadius) {

this.timelineRadius = timelineRadius;

invalidate();

}

public int getTimelineRadiusDistance() {

return timelineRadiusDistance;

}

public void setTimelineRadiusDistance(int timelineRadiusDistance) {

this.timelineRadiusDistance = timelineRadiusDistance;

invalidate();

}

public int getTimelineWidth() {

return timelineWidth;

}

public void setTimelineWidth(int timelineWidth) {

this.timelineWidth = timelineWidth;

}

public float getTimeLineViewHeight() {

this.timeLineViewHeight = getMarginTop() + getTimelineCount()

• (2 * getTimelineRadius() + getTimelineRadiusDistance());

return timeLineViewHeight;

}

public void setTimeLineViewHeight(float timeLineViewHeight) {

this.timeLineViewHeight = timeLineViewHeight;

invalidate();

}

public int getViewWidth() {

return viewWidth;

}

如果你进阶的路上缺乏方向，可以加入我们的圈子和安卓开发者们一起学习交流！

• Android进阶学习全套手册

  

• Android对标阿里P7学习视频

  

• BATJ大厂Android高频面试题

  

最后，借用我最喜欢的乔布斯语录，作为本文的结尾：

人这一辈子没法做太多的事情，所以每一件都要做得精彩绝伦。
你的时间有限，所以不要为别人而活。不要被教条所限，不要活在别人的观念里。不要让别人的意见左右自己内心的声音。
最重要的是，勇敢的去追随自己的心灵和直觉，只有自己的心灵和直觉才知道你自己的真实想法，其他一切都是次要。

ndroid进阶学习全套手册

[外链图片转存中…(img-nmrwee9l-1725883541252)]

• Android对标阿里P7学习视频

  [外链图片转存中…(img-hfiKAoil-1725883541252)]

• BATJ大厂Android高频面试题

  [外链图片转存中…(img-CaBlD6th-1725883541253)]

最后，借用我最喜欢的乔布斯语录，作为本文的结尾：

人这一辈子没法做太多的事情，所以每一件都要做得精彩绝伦。
你的时间有限，所以不要为别人而活。不要被教条所限，不要活在别人的观念里。不要让别人的意见左右自己内心的声音。
最重要的是，勇敢的去追随自己的心灵和直觉，只有自己的心灵和直觉才知道你自己的真实想法，其他一切都是次要。