项目介绍
在审核某些问题的时候会出现加载进度展示的view。给用户一个感官上的效果，增强了APP与用户之间的交互体验。自定义审核过渡页纯粹就只是一个自定义view，支持展示文字以及展示图片和进度加载的更换。也方便了大家的使用吧。
效果展示：
result.gif
功能实现
1.自定义属性
2.在view中绘制对应view
- 绘制进度条
private void drawProgress(Canvas canvas) {
if (isShowIcon) {
//创建指定大小的bitmap对象
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), circleBitmap);
canvas.drawBitmap(bitmap, null, new RectF(width / 2 - circleBitmapWidth / 2,
(int) (circlePadding + circleMargin), (int) width / 2 + circleBitmapWidth / 2,
(int) (circlePadding + circleMargin) + circleBitmapHeight), bitmapPaint);
bitmap.recycle();
bitmap = null;
}
//创建指定大小的circle元
canvas.drawCircle(width / 2, circlePadding + circleBitmapHeight / 2 + circleMargin, circleBitmapHeight / 2 + circlePadding, circleBgPaint);
canvas.drawArc(width / 2 - circleBitmapWidth / 2 - circlePadding,
circleMargin,
width / 2 + circleBitmapWidth / 2 + circlePadding
, circleBitmapHeight + circlePadding + circlePadding + circleMargin,
circleStartAngle,
circleEndAngle, false, circlePaint);
}
private int hintHeight = 0;
private void drawHint(Canvas canvas) {
String hints = TextUtils.isEmpty(hint) ? "正在努力评估中，请耐心等待..." : hint;
float textWidth = hintPaint.measureText(hints);
// 文本baseline在y轴方向的位置
float baseLineY = Math.abs(hintPaint.ascent() + hintPaint.descent()) / 2;
if (hintIsShow) {
canvas.drawText(hints, width / 2 - textWidth / 2, (circlePadding + circleMargin) * 2 + circleBitmapHeight + baseLineY, hintPaint);
hintHeight = (int) (hintPaint.density - hintPaint.ascent());
} else {
hintHeight = 0;
}
}
- 绘制下方文字
private void drawBottom(Canvas cavas) {
//剩下的距离，根据titles的标致均分
remainingHeight = (int) (height - (circleMargin + circlePadding + lineMargin) * 2 - circleBitmapHeight - hintHeight - lineHeight);
int y = (int) ((circleMargin + circlePadding + lineMargin) * 2 + circleBitmapHeight + hintHeight + lineHeight);
int everyItem = remainingHeight / titles.size();
//配置当前的一些常见属性
//去左上角的点
Point iconPoint = new Point(dp2px(mContext, 40), y + everyItem * 3 / 11);
Point titlePoint = new Point(iconPoint.x+dp2px(mContext, 40), iconPoint.y);
Point contentPoint = new Point(iconPoint.x+dp2px(mContext, 41), iconPoint.y + dp2px(mContext, 30));
bottomBitmap(cavas, iconPoint, step);
titleCenter(titles, titlePaint, cavas, titlePoint, Paint.Align.CENTER, step);
contentCenter(contentSelect, contentUnSelect, contentPaint, cavas, contentPoint, Paint.Align.CENTER, step);
;
}
private void bottomBitmap(Canvas canvas, Point point, int step) {
Bitmap bitmapUnSelect = BitmapFactory.decodeResource(getResources(), bottomUnSelectIcon);
Bitmap bitmapSelect = BitmapFactory.decodeResource(getResources(), bottomSelectIcon);
for (int i = 0; i < titles.size(); i++) {
float yAxis = remainingHeight / titles.size();
if (i <= step) {
canvas.drawBitmap(bitmapSelect, null, new Rect(point.x,
point.y + (int) yAxis * i,
point.x + (int) bottomIconWidth,
point.y + (int) bottomIconHeight + (int) yAxis * i)
, bitmapPaint);
} else {
canvas.drawBitmap(bitmapUnSelect, null, new RectF(point.x,
point.y + (int) yAxis * i,
point.x + bottomIconWidth,
point.y + bottomIconHeight + (int) yAxis * i)
, bitmapPaint);
}
}
for (int i = 1; i < titles.size(); i++) {
if (i <= step) {
connectLinePaint.setColor(chooseColor);
} else {
connectLinePaint.setColor(defaultColor);
}
float yAxis = remainingHeight / titles.size();
canvas.drawLine(point.x + bottomIconWidth / 2, bottomIconHeight + point.y + yAxis * (i - 1)
, point.x + bottomIconWidth / 2, point.y + yAxis * i, connectLinePaint);
}
bitmapSelect.recycle();
bitmapSelect = null;
bitmapUnSelect.recycle();
bitmapUnSelect = null;
}
//绘制标题
private void titleCenter(List strings, Paint paint, Canvas canvas, Point point, Paint.Align aligin, int step) {
Paint.FontMetrics fontMetrics = paint.getFontMetrics();
float ascent = fontMetrics.ascent;
float descent = fontMetrics.descent;
float stringHeight = descent - ascent;
int length = strings.size();
for (int i = 0; i < length; i++) {
if (i <= step) {
titlePaint.setColor(chooseColor);
} else {
titlePaint.setColor(defaultColor);
}
float yAxis = remainingHeight / length;
canvas.drawText(strings.get(i) + "", point.x, point.y + yAxis * i + stringHeight, paint);
}
}
//绘制内容
private void contentCenter(List select, List unselect, Paint paint, Canvas canvas, Point point, Paint.Align aligin, int step) {
Paint.FontMetrics fontMetrics = paint.getFontMetrics();
float ascent = fontMetrics.ascent;
float descent = fontMetrics.descent;
float stringHeight = descent - ascent;
for (int i = 0; i < titles.size(); i++) {
float yAxis = remainingHeight / titles.size();
if (i <= step) {
contentPaint.setColor(chooseColor);
canvas.drawText(select.get(i) + "", point.x, point.y + yAxis * i + stringHeight, paint);
} else {
contentPaint.setColor(defaultColor);
canvas.drawText(unselect.get(i) + "", point.x, point.y + yAxis * i + stringHeight, paint);
}
}
}
- 设置回调方法
public interface onViewCompleteFinshListener {
void complete();
}
public void setCompleteFinshListener(onViewCompleteFinshListener completeFinshListener) {
this.completeFinshListener = completeFinshListener;
}
public class MainActivity extends AppCompatActivity implements SmartLoadingView.onViewCompleteFinshListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
SmartLoadingView loadingView = findViewById(R.id.smartView);
loadingView.setCompleteFinshListener(this);
}
@Override
public void complete() {
Toast.makeText(this, "进度已经加载完毕，该执行对应的跳转方法了", Toast.LENGTH_LONG).show();
startActivity(new Intent(this, NextActivity.class));
this.finish();
}
}
3.在xml文件中调用
实现思路
功能很简单，都是一些基本的canvas方法调用，实现这个算是对基础知识的一个回顾吧。