android 绘制多层画布,在android中用画布绘制四分之一规格?
Henry..6你可以谷歌找到一堆GagueViews.我想你已经做到了.这看起来很简单.所以你可以编写自己的自定义View.您可以使用drawArc绘制3种不同颜色的圆弧.您可以使用drawLine绘制测量点(只需记住设置Paint.setStrokeCap(Cap.Round)).至于针,你可以使用drawPath.通过一些努力和正确的坐标,您应该能够自己编写一个漂亮的GaugeView.如果
Henry..
6
你可以谷歌找到一堆GagueViews.我想你已经做到了.
这看起来很简单.所以你可以编写自己的自定义View.您可以使用drawArc绘制3种不同颜色的圆弧.您可以使用drawLine绘制测量点(只需记住设置Paint.setStrokeCap(Cap.Round)).至于针,你可以使用drawPath.通过一些努力和正确的坐标,您应该能够自己编写一个漂亮的GaugeView.
如果您发现编写自己的看法很难,你可以参考一些GaugeView在GitHub.你会得到一个很好的起点.
更新:我写了一个简单的GaugeView基于你问题的图像.计算以像素为单位,您可能希望将它们相乘DisplayMetrics.density,以便它们处于独立像素中.此外,您可能希望通过xml在此处公开大多数值,因此您可以在布局中控制它们.这可能是一个很好的起点.
public class GaugeView extends View {
private Paint arcPaint;
public GaugeView(Context context) {
super(context);
initialize();
}
public GaugeView(Context context, AttributeSet attrs) {
super(context, attrs);
initialize();
}
public GaugeView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initialize();
}
private void initialize() {
arcPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
arcPaint.setStyle(Paint.Style.STROKE);
arcPaint.setStrokeWidth(15f);
}
@Override
protected void onDraw(Canvas canvas) {
int width = canvas.getWidth();
int height = canvas.getHeight();
int arcCenterX = width - 10;
int arcCenterY = height - 10;
final RectF arcBounds = new RectF(arcCenterX - 100, arcCenterY - 100, arcCenterX + 100, arcCenterY + 100);
// Draw the arc
canvas.drawArc(arcBounds, 180f, 20f, false, arcPaint);
arcPaint.setColor(Color.DKGRAY);
canvas.drawArc(arcBounds, 200f, 40f, false, arcPaint);
arcPaint.setColor(Color.GRAY);
canvas.drawArc(arcBounds, 2400f, 30f, false, arcPaint);
// Draw the pointers
final int totalNoOfPointers = 20;
final int pointerMaxHeight = 25;
final int pointerMinHeight = 15;
int startX = arcCenterX - 120;
int startY = arcCenterY;
arcPaint.setStrokeWidth(5f);
arcPaint.setStrokeCap(Paint.Cap.ROUND);
int pointerHeight;
for (int i = 0; i <= totalNoOfPointers; i++) {
if(i%5 == 0){
pointerHeight = pointerMaxHeight;
}else{
pointerHeight = pointerMinHeight;
}
canvas.drawLine(startX, startY, startX - pointerHeight, startY, arcPaint);
canvas.rotate(90f/totalNoOfPointers, arcCenterX, arcCenterY);
}
}
}
最终渲染的图像如下所示:
更多推荐
所有评论(0)