起初在项目中有用到虚线,美工切的虚线图片在界面上展示的效果不怎么样。所以我想想就用自定义view来解决,写完了之后同事看到了说有最简单的实现,我听完后我就觉得自己多想了。
虚线最简单的实现--用shape,在里面写如下代码:
<stroke
android:dashGap="3dp" 表示之间隔开的距离
android:dashWidth="4dp" 表示'-'这样一个横线的宽度
android:width="1px" 描边的宽度
android:color="@color/dash_color" />
然后把其设置成view的背景就可以了。
关于虚线不显示的问题,参考android用shape画虚线,怎么也不显示
接下来就说到文章的主题了:
对于虚线,可以是横向,也可以是纵向,还有小格子的长度和宽度,还有间距,这些都可以自定义属性。对于自定义view,最重要的是onMeasure()方法和ondraw()方法。看代码:
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int width = resolveSize(getSuggestedMinimumWidth(), widthMeasureSpec);
int height = resolveSize(getSuggestedMinimumHeight(), heightMeasureSpec);
setMeasuredDimension(width != 0 ? width : (int) elementWidth,
height != 0 ? height : (int) elementHeight);
dashWidth = getMeasuredWidth();
dashHeight = getMeasuredHeight();
//由于使用canvas.drawLines()方法,所以要计算出point数组
if(orientation == 0){
eachWidth = elementWidth + elementSpace;
elementNums = (int) (dashWidth % eachWidth != 0 ? dashWidth / eachWidth + 1 : dashWidth / eachWidth);
points = new float[elementNums * 4];
float halfHeight = elementHeight / 2;
points[0] = 0;
for(int i = 1; i < points.length; i++){
if(i % 2 == 0)
if(i % 4 == 0)
points[i] = points[i - 4] + eachWidth;
else
points[i] += points[i - 2] + elementWidth;
else
points[i] = halfHeight;
}
}else{
eachHeight = elementHeight + elementSpace;
elementNums = (int) (dashHeight % eachHeight != 0 ? dashHeight / eachHeight + 1 : dashHeight / eachHeight);
points = new float[elementNums * 4];
float halfWidth = elementWidth / 2;
points[0] = halfWidth;
points[1] = 0;
for(int i = 2; i < points.length; i++){
if(i % 2 == 1)
if(i % 4 == 1)
points[i] = points[i - 4] + eachHeight;
else
points[i] += points[i - 2] + elementHeight;
else
points[i] = halfWidth;
}
}
}
@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if(orientation == 0){
paint.setStrokeWidth(elementHeight);
paint.setColor(elementColor);
paint.setAntiAlias(true);
canvas.drawLines(points,0,elementNums * 4,paint);
}else{
paint.setStrokeWidth(elementWidth);
paint.setColor(elementColor);
paint.setAntiAlias(true);
canvas.drawLines(points,0,elementNums * 4,paint);
}
}
项目源码