Android 仿淘宝物流信息TimeLineView，阿里资深Android开发带你入门Framework

/**

• 时间轴的节点的半径

*/

private int timelineRadius;

/**

• 时间轴节点之间的距离

*/

private int timelineRadiusDistance;

/**

• 时间轴的宽度

*/

private int timelineWidth;

/**

• 时间轴的高度

*/

private float timeLineViewHeight;

public TimeLineView(Context context) {

this(context, null);

}

public TimeLineView(Context context, AttributeSet attrs) {

this(context, attrs, 0);

}

public TimeLineView(Context context, AttributeSet attrs, int defStyle) {

super(context, attrs, defStyle);

init(context, attrs, defStyle);

}

/**

• 初始化

• @param context

• @param attrs

• @param defStyle

*/

private void init(Context context, AttributeSet attrs, int defStyle) {

final TypedArray a = getContext().obtainStyledAttributes(attrs,

R.styleable.TimeLineView, defStyle, 0);

timelineRadiusDistance = (int) a.getDimension(

R.styleable.TimeLineView_timelineRadiusDistance,

convertDIP2PX(context, 20));

timelineHeadRadius = a.getDimension(

R.styleable.TimeLineView_timelineHeadRadius,

convertDIP2PX(context, 6));

timelineRadius = (int) a.getDimension(

R.styleable.TimeLineView_timelineRadius,

convertDIP2PX(context, 5));

timelineHeadColor = a.getColor(

R.styleable.TimeLineView_timelineHeadColor,

Color.parseColor("#25ae5f")); // 中心深色

timelineHeadColorEdge = a.getColor(

R.styleable.TimeLineView_timelineHeadColorEdge,

Color.parseColor("#b9e5cc")); // 边缘浅色

timelineOtherColor = a.getColor(

R.styleable.TimeLineView_timelineOtherColor,

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;

}

最后

**一个零基础的新人，我认为坚持是最最重要的。**我的很多朋友都找我来学习过，我也很用心的教他们，可是不到一个月就坚持不下来了。我认为他们坚持不下来有两点主要原因：

他们打算入行不是因为兴趣，而是因为所谓的IT行业工资高，或者说完全对未来没有任何规划。

刚开始学的时候确实很枯燥，这确实对你是个考验，所以说坚持下来也很不容易，但是如果你有兴趣就不会认为这是累，不会认为这很枯燥，总之还是贵在坚持。

技术提升遇到瓶颈了？缺高级Android进阶视频学习提升自己吗？还有大量大厂面试题为你面试做准备！

点击:Android 学习，面试文档，视频收集大整理

来获取学习资料提升自己去挑战一下BAT面试难关吧

对于很多Android工程师而言，想要提升技能，往往是自己摸索成长，不成体系的学习效果低效漫长且无助。整理的这些知识图谱希望对Android开发的朋友们有所参考以及少走弯路，本文的重点是你有没有收获与成长，其余的都不重要，希望读者们能谨记这一点。

不论遇到什么困难，都不应该成为我们放弃的理由！

如果有什么疑问的可以直接私我，我尽自己最大力量帮助你！

8D%E4%BC%9A%E8%BF%99%E4%BA%9B%EF%BC%9F%E5%A6%82%E4%BD%95%E9%9D%A2%E8%AF%95%E6%8B%BF%E9%AB%98%E8%96%AA%EF%BC%81.md)

来获取学习资料提升自己去挑战一下BAT面试难关吧

[外链图片转存中…(img-vSBtpYpN-1644027447973)]

对于很多Android工程师而言，想要提升技能，往往是自己摸索成长，不成体系的学习效果低效漫长且无助。整理的这些知识图谱希望对Android开发的朋友们有所参考以及少走弯路，本文的重点是你有没有收获与成长，其余的都不重要，希望读者们能谨记这一点。

不论遇到什么困难，都不应该成为我们放弃的理由！

如果有什么疑问的可以直接私我，我尽自己最大力量帮助你！

最后祝各位新人都能坚持下来，学有所成。