Android 自定义控件之折线图

世面上有很多图表类的控件但有很多坑,于是就自己动手写。 在这个控件中最难的不是知识点而是对坐标的把控。这个控件很多属性都可以开放出来的。同学可以根据自己的情况进行修改,另外也写了很详细的注释帮助同学们进行理解。

下载地址请点击点击
点击

一、实现原理

本控件有三个实体类:
1、CrossAxisScale 用于自定义横向刻度
2、VerticalAxisScale 用于定义纵向刻度
3、FoldLinePoint 用于定义每个折线点
若横向刻度为空则FoldLinePoint的scaleTip用于定义刻度值。
首先根据CrossAxisScale来画纵轴的刻度
再用VerticalAxisScale或FoldLinePoint来画横轴的刻度
最后FoldLinePoint把所有的点连接起来

二、使用方法

1、添加横向刻度(若不定义则使用折线点刻度)
2、添加纵向刻度
3、添加折线点
4、调用initData()方法将这些添加进去
5、设置Listener
注:刻度的宽度、颜色属性等需要在layout里面进行设置 如下:

android:id="@+id/fl_content"
android:layout_width="match_parent"
android:layout_height="300dp"
android:paddingRight="15dp"
android:paddingTop="15dp"
app:axisScaleWidth="5dp"
app:axisWidth="1dp"
app:crossAxisColor="#F88D3D"
app:foldLineCircleColor="@android:color/white"
app:foldLineCircleRadius="1dp"
app:foldLineColor="#3396C574"
app:foldLineOuterColor="#8CBA68"
app:isDrawFoldLineCircle="true"
app:isFillMode="true"
app:verticalAxisColor="#F88D3D" />
  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在 Android 应用中实现天气折线图,可以使用第三方库如 MPAndroidChart。以下是一个简单的示例代码: 1. 添加依赖 在 app 的 build.gradle 文件中添加以下依赖: ```groovy implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0' ``` 2. 在布局文件中添加 LineChart 控件 ```xml <com.github.mikephil.charting.charts.LineChart android:id="@+id/chart" android:layout_width="match_parent" android:layout_height="match_parent" /> ``` 3. 初始化 LineChart 控件 ```java LineChart chart = findViewById(R.id.chart); // 设置折线图的属性 chart.getDescription().setEnabled(false); chart.setTouchEnabled(false); chart.setDragEnabled(false); chart.setScaleEnabled(false); chart.setDrawGridBackground(false); chart.setHighlightPerDragEnabled(false); chart.setPinchZoom(false); chart.getLegend().setEnabled(false); chart.setNoDataText("No data available"); // 设置 x 轴和 y 轴的属性 XAxis xAxis = chart.getXAxis(); xAxis.setDrawGridLines(false); xAxis.setPosition(XAxis.XAxisPosition.BOTTOM); xAxis.setDrawAxisLine(false); xAxis.setGranularity(1f); xAxis.setValueFormatter(new ValueFormatter() { @Override public String getFormattedValue(float value) { // 设置 x 轴的标签 return "Day " + ((int) value + 1); } }); YAxis leftAxis = chart.getAxisLeft(); leftAxis.setDrawGridLines(false); leftAxis.setDrawAxisLine(false); leftAxis.setDrawLabels(false); YAxis rightAxis = chart.getAxisRight(); rightAxis.setDrawGridLines(false); rightAxis.setDrawAxisLine(false); rightAxis.setDrawLabels(false); ``` 4. 设置折线图数据 ```java List<Entry> entries = new ArrayList<>(); // 添加折线图数据 entries.add(new Entry(0, 25)); entries.add(new Entry(1, 26)); entries.add(new Entry(2, 23)); entries.add(new Entry(3, 24)); entries.add(new Entry(4, 28)); entries.add(new Entry(5, 30)); entries.add(new Entry(6, 29)); LineDataSet dataSet = new LineDataSet(entries, "Temperature"); dataSet.setDrawIcons(false); dataSet.setColor(Color.RED); dataSet.setLineWidth(2f); dataSet.setCircleColor(Color.RED); dataSet.setCircleRadius(3f); dataSet.setDrawCircleHole(false); dataSet.setDrawValues(false); LineData lineData = new LineData(dataSet); chart.setData(lineData); chart.invalidate(); ``` 以上代码将在 LineChart 控件中绘制一条红色的折线,表示温度。可以根据需要自定义折线图的样式和数据。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值