一 、项目要用个曲线图，于是就使用了 MPChartAndroid

1.使用方式很简单

1.添加依赖

dependencies { compile ‘com.github.PhilJay:MPAndroidChart:v3.0.2’ }

2.项目的build.gradle添加

allprojects { repositories { maven { url "https://jitpack.io" } } }

3.界面的xml布局直接使用

<com.github.mikephil.charting.charts.LineChart android:id="@+id/chart1" android:layout_width="match_parent" android:layout_height="90dp" android:layout_alignParentBottom="true" android:layout_marginBottom="12dp" />

4.代码封装的非常完美，想要什么属性调用API进行设置就行了，github下载的事列代码没有中文注释，我就进行各种试。

mLineChart.setLogEnabled(true);//打印日志 //取消描述文字 mLineChart.getDescription().setEnabled(false); mLineChart.setNoDataText("没有数据");//没有数据时显示的文字 mLineChart.setNoDataTextColor(Color.WHITE);//没有数据时显示文字的颜色 mLineChart.setDrawGridBackground(false);//chart 绘图区后面的背景矩形将绘制 mLineChart.setDrawBorders(false);//是否禁止绘制图表边框的线 mLineChart.setBorderColor(Color.WHITE); //设置 chart 边框线的颜色。 mLineChart.setBorderWidth(3f); //设置 chart 边界线的宽度，单位 dp。 mLineChart.setTouchEnabled(true); //能否点击 mLineChart.setDragEnabled(false); //能否拖拽 mLineChart.setScaleEnabled(false); //能否缩放 mLineChart.animateX(1000);//绘制动画 从左到右 mLineChart.setDoubleTapToZoomEnabled(false);//设置是否可以通过双击屏幕放大图表。默认是true mLineChart.setHighlightPerDragEnabled(false);//能否拖拽高亮线(数据点与坐标的提示线)，默认是true mLineChart.setDragDecelerationEnabled(false);//拖拽滚动时，手放开是否会持续滚动，默认是true（false是拖到哪是哪，true拖拽之后还会有缓冲） MyMarkerView mv = new MyMarkerView(mActivity, R.layout.custom_marker_view); mv.setChartView(mLineChart); // For bounds control mLineChart.setMarker(mv); //设置 marker ,点击后显示的功能 ，布局可以自定义 XAxis xAxis = mLineChart.getXAxis(); //获取x轴线 xAxis.setDrawAxisLine(true);//是否绘制轴线 xAxis.setDrawGridLines(false);//设置x轴上每个点对应的线 xAxis.setDrawLabels(true);//绘制标签 指x轴上的对应数值 xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);//设置x轴的显示位置 xAxis.setTextSize(12f);//设置文字大小 xAxis.setAxisMinimum(0f);//设置x轴的最小值 //` xAxis.setAxisMaximum(31f);//设置最大值 // xAxis.setLabelCount(10); //设置X轴的显示个数 xAxis.setAvoidFirstLastClipping(false);//图表将避免第一个和最后一个标签条目被减掉在图表或屏幕的边缘 xAxis.setAxisLineColor(Color.WHITE);//设置x轴线颜色 xAxis.setAxisLineWidth(0.5f);//设置x轴线宽度 YAxis leftAxis = mLineChart.getAxisLeft(); YAxis axisRight = mLineChart.getAxisRight(); leftAxis.enableGridDashedLine(10f, 10f, 0f); //设置Y轴网格线条的虚线，参1 实线长度，参2 虚线长度 ，参3 周期 leftAxis.setGranularity(20f); // 网格线条间距 axisRight.setEnabled(false); //设置是否使用 Y轴右边的 leftAxis.setEnabled(true); //设置是否使用 Y轴左边的 leftAxis.setGridColor(Color.parseColor("#7189a9")); //网格线条的颜色 leftAxis.setDrawLabels(true); //是否显示Y轴刻度 leftAxis.setStartAtZero(true); //设置Y轴数值 从零开始 leftAxis.setDrawGridLines(true); //是否使用 Y轴网格线条 leftAxis.setTextSize(12f); //设置Y轴刻度字体 leftAxis.setTextColor(Color.WHITE); //设置字体颜色 leftAxis.setAxisLineColor(Color.WHITE); //设置Y轴颜色 leftAxis.setAxisLineWidth(0.5f); leftAxis.setDrawAxisLine(true);//是否绘制轴线 leftAxis.setMinWidth(0f); leftAxis.setMaxWidth(200f); leftAxis.setDrawGridLines(false);//设置x轴上每个点对应的线 Legend l = mLineChart.getLegend();//图例 l.setEnabled(false); //是否使用 图例

5.LineChart 设置完成，接下来是数据的设置

private void setLineChartDate() { mValues = new ArrayList<>(); mValues.add(new Entry(0, 10)); mValues.add(new Entry(1, 15)); mValues.add(new Entry(2, 25)); mValues.add(new Entry(3, 19)); mValues.add(new Entry(4, 25)); mValues.add(new Entry(5, 16)); mValues.add(new Entry(6, 40)); mValues.add(new Entry(7, 27)); if (mValues.size() == 0) return; LineDataSet set1; //判断图表中原来是否有数据 if (mLineChart.getData() != null && mLineChart.getData().getDataSetCount() > 0) { //获取数据1 set1 = (LineDataSet) mLineChart.getData().getDataSetByIndex(0); set1.setValues(mValues); //刷新数据 mLineChart.getData().notifyDataChanged(); mLineChart.notifyDataSetChanged(); } else { //设置数据1 参数1：数据源 参数2：图例名称 set1 = new LineDataSet(mValues, "测试数据1"); set1.setMode(LineDataSet.Mode.CUBIC_BEZIER); set1.setColor(Color.WHITE); set1.setCircleColor(Color.parseColor("#AAFFFFFF")); set1.setHighLightColor(Color.WHITE);//设置点击交点后显示交高亮线的颜色 set1.setHighlightEnabled(true);//是否使用点击高亮线 set1.setDrawCircles(true); set1.setValueTextColor(Color.WHITE); set1.setLineWidth(1f);//设置线宽 set1.setCircleRadius(2f);//设置焦点圆心的大小 set1.setHighlightLineWidth(0.5f);//设置点击交点后显示高亮线宽 set1.enableDashedHighlightLine(10f, 5f, 0f);//点击后的高亮线的显示样式 set1.setValueTextSize(12f);//设置显示值的文字大小 set1.setDrawFilled(true);//设置使用 范围背景填充 set1.setDrawValues(false); //格式化显示数据 final DecimalFormat mFormat = new DecimalFormat("###,###,##0"); set1.setValueFormatter(new IValueFormatter() { @Override public String getFormattedValue(float value, Entry entry, int dataSetIndex, ViewPortHandler viewPortHandler) { return mFormat.format(value); } }); if (Utils.getSDKInt() >= 18) { // fill drawable only supported on api level 18 and above Drawable drawable = ContextCompat.getDrawable(mActivity, R.color.translucence); set1.setFillDrawable(drawable);//设置范围背景填充 } else { set1.setFillColor(R.color.translucence); } ArrayList<ILineDataSet> dataSets = new ArrayList<>(); dataSets.add(set1); // add the datasets //创建LineData对象 属于LineChart折线图的数据集合 LineData data = new LineData(dataSets); // 添加到图表中 mLineChart.setData(data); //绘制图表 mLineChart.invalidate(); } }

效果展示

新的需求，X轴和Y轴需要自定义，经过研究可以这样设置

1.设置数据传入X轴要显示的标签

mValues = new ArrayList<>(); mValues.add(new Entry(0, 10,"08-1")); mValues.add(new Entry(1, 15,"")); mValues.add(new Entry(2, 25,"")); mValues.add(new Entry(3, 19,"")); mValues.add(new Entry(4, 25,"08-10")); mValues.add(new Entry(5, 16,"")); mValues.add(new Entry(6, 40,"")); mValues.add(new Entry(7, 24,"")); mValues.add(new Entry(8, 27,"08-21"));

1.设置X轴和Y轴适配器

xAxis.setValueFormatter((value, axis) -> mValues.get((int) value).getData()+""); leftAxis.setValueFormatter(new IAxisValueFormatter() { @Override public String getFormattedValue(float value, AxisBase axis) { return "￥"+ value; }

1.点击提示的marker适配器

public void refreshContent(Entry e, Highlight highlight) { if (e instanceof CandleEntry) { CandleEntry ce = (CandleEntry) e; tvContent.setText("￥" + Utils.formatNumber(ce.getHigh(), 0, true)); } else { tvContent.setText("￥" + Utils.formatNumber(e.getY(), 0, true)); } super.refreshContent(e, highlight); }

效果如下

希望能对你有所帮助~