Android java 绘制折线图 纵轴名称为温湿度 横轴名称为时间间隔 坐标轴颜色为#ebf0fc你需要绘制两根折线 每根折线有7个折点 两根线颜色分别为#fd835e#7b79da你需要将折线曲线化使其在视觉上有圆润的感觉
以下是一个简单的绘制折线图的示例代码:
public class LineChartView extends View {
private static final int PADDING = 100;
private static final int AXIS_COLOR = Color.parseColor("#ebf0fc");
private static final int LINE_COLOR_1 = Color.parseColor("#fd835e");
private static final int LINE_COLOR_2 = Color.parseColor("#7b79da");
private static final float LINE_WIDTH = 5f;
private static final float CIRCLE_RADIUS = 10f;
private float[] data1 = {20.5f, 22.3f, 21.8f, 23.5f, 24.1f, 23.0f, 22.2f};
private float[] data2 = {40.2f, 42.1f, 41.5f, 43.8f, 44.5f, 43.2f, 42.6f};
private String[] xLabels = {"1h", "2h", "3h", "4h", "5h", "6h", "7h"};
private Paint axisPaint;
private Paint linePaint1;
private Paint linePaint2;
private Paint circlePaint1;
private Paint circlePaint2;
private Path path1;
private Path path2;
public LineChartView(Context context) {
super(context);
init();
}
public LineChartView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public LineChartView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
axisPaint = new Paint();
axisPaint.setColor(AXIS_COLOR);
axisPaint.setStrokeWidth(LINE_WIDTH);
axisPaint.setStyle(Paint.Style.STROKE);
linePaint1 = new Paint();
linePaint1.setColor(LINE_COLOR_1);
linePaint1.setStrokeWidth(LINE_WIDTH);
linePaint1.setStyle(Paint.Style.STROKE);
linePaint2 = new Paint();
linePaint2.setColor(LINE_COLOR_2);
linePaint2.setStrokeWidth(LINE_WIDTH);
linePaint2.setStyle(Paint.Style.STROKE);
circlePaint1 = new Paint();
circlePaint1.setColor(LINE_COLOR_1);
circlePaint1.setStyle(Paint.Style.FILL);
circlePaint2 = new Paint();
circlePaint2.setColor(LINE_COLOR_2);
circlePaint2.setStyle(Paint.Style.FILL);
path1 = new Path();
path2 = new Path();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
int width = getWidth();
int height = getHeight();
// 绘制坐标轴
canvas.drawLine(PADDING, height - PADDING, width - PADDING, height - PADDING, axisPaint);
canvas.drawLine(PADDING, PADDING, PADDING, height - PADDING, axisPaint);
// 绘制横轴标签
float xStep = (width - PADDING * 2) / (xLabels.length - 1);
for (int i = 0; i < xLabels.length; i++) {
float x = PADDING + i * xStep;
canvas.drawText(xLabels[i], x, height - PADDING / 2, axisPaint);
}
// 绘制纵轴标签
canvas.rotate(-90, PADDING / 2, height / 2);
canvas.drawText("温度", PADDING / 2, height / 2, axisPaint);
canvas.rotate(90, PADDING / 2, height / 2);
canvas.drawText("湿度", width - PADDING / 2, height / 2, axisPaint);
// 绘制折线1
path1.reset();
float yStep1 = (height - PADDING * 2) / (data1.length - 1);
for (int i = 0; i < data1.length; i++) {
float x = PADDING + i * xStep;
float y = height - PADDING - data1[i] * yStep1;
if (i == 0) {
path1.moveTo(x, y);
} else {
path1.lineTo(x, y);
}
canvas.drawCircle(x, y, CIRCLE_RADIUS, circlePaint1);
}
canvas.drawPath(path1, linePaint1);
// 绘制折线2
path2.reset();
float yStep2 = (height - PADDING * 2) / (data2.length - 1);
for (int i = 0; i < data2.length; i++) {
float x = PADDING + i * xStep;
float y = height - PADDING - data2[i] * yStep2;
if (i == 0) {
path2.moveTo(x, y);
} else {
path2.lineTo(x, y);
}
canvas.drawCircle(x, y, CIRCLE_RADIUS, circlePaint2);
}
canvas.drawPath(path2, linePaint2);
}
}
使用方法:在布局文件中添加LineChartView,或者在代码中创建LineChartView并添加到布局中。
<com.example.linechart.LineChartView
android:layout_width="match_parent"
android:layout_height="300dp" />
``
原文地址: https://www.cveoy.top/t/topic/g84Z 著作权归作者所有。请勿转载和采集!