这篇文章主要介绍如何使用MPAndroidChart库实现K线面板的相关功能，我们会着重介绍以下几个方面：
1.绘制K线图和展示股票数据
2.处理用户手势操作
3.拉伸和压缩K线图
最终的效果图：
图1
源码下载地址：https://github.com/Lonely7th/TsAndroidClient
绘制K线图和展示股票数据
绘制K线图需要用到真实的股票数据，网上有很多免费的接口可以使用，我们也可以自己编写一个股票数据接口 Python实现股票数据接口
1.将MPAndroidChart集成到项目中
在project根目录的build.gradle添加中央库地址：
allprojects {
repositories {
maven { url "https://jitpack.io" }
}
}
在项目build.gradle中添加相关依赖:
dependencies {
compile 'com.github.PhilJay:MPAndroidChart:v2.2.4'
}
2.在布局文件中添加CandleStickChart
<com.github.mikephil.charting.charts.CandleStickChart
android:id="@+id/candler_chart"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/top_line"
android:layout_above="@+id/rl_bottom_view"/>
mChart = findViewById(R.id.candler_chart);
3.基本参数设置
设置提示文字
mChart.setNoDataTextDescription("加载中...");//如果没有数据的时候，会显示这个
设置背景颜色
mChart.setDrawGridBackground(false);//是否显示表格颜色
mChart.setBackgroundColor(Color.BLACK);//设置背景
mChart.setGridBackgroundColor(Color.BLACK);//设置表格背景色
设置坐标轴，坐标轴分为x轴、左y轴和右y轴，可以分别设置，这里我们取消x轴和右y轴，只设置左y轴的属性。
//设置x轴
XAxis xAxis = mChart.getXAxis();
xAxis.setEnabled(false);
//设置y轴(左边)
YAxis leftAxis = mChart.getAxisLeft();
leftAxis.setEnabled(true);
leftAxis.setLabelCount(5, false);
leftAxis.setDrawGridLines(true);//绘制网格线
leftAxis.setDrawAxisLine(false);
leftAxis.setGridColor(ContextCompat.getColor(MainActivity.this, R.color.gray_overlay));//设置网格线的颜色
leftAxis.setTextColor(Color.WHITE);//坐标轴文字颜色
leftAxis.setValueFormatter(new MyYAxisValueFormatter());//坐标轴文字格式
//设置y轴(右边)
YAxis rightAxis = mChart.getAxisRight();
rightAxis.setEnabled(false);
设置高亮
mChart.setHighlightPerDragEnabled(false);//直接拖动屏幕时不显示高亮
mChart.setHighlightPerTapEnabled(false);//点击屏幕时不显示高亮
设置监听（在第二个章节中我们会详细介绍如何使用这些监听实现各种手势操作，这里不再赘述）
mChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {
@Override
public void onValueSelected(Entry e, int dataSetIndex, Highlight h) {
if (isLongPressed) {
}
}
@Override
public void onNothingSelected() {
}
});
mChart.setOnChartGestureListener(new OnChartGestureListener() {
@Override
public void onChartGestureStart(MotionEvent me, ChartTouchListener.ChartGesture lastPerformedGesture) {
}
@Override
public void onChartGestureEnd(MotionEvent me, ChartTouchListener.ChartGesture lastPerformedGesture) {
}
@Override
public void onChartLongPressed(MotionEvent me) {
}
@Override
public void onChartDoubleTapped(MotionEvent me) {
}
@Override
public void onChartSingleTapped(MotionEvent me) {
}
@Override
public void onChartFling(MotionEvent me1, MotionEvent me2, float velocityX, float velocityY) {
}
@Override
public void onChartScale(MotionEvent me, float scaleX, float scaleY) {
}
@Override
public void onChartTranslate(MotionEvent me, float dX, float dY) {
}
});
4.获取数据/添加数据
这里我们通过 http://47.95.243.173/tkdata?code=000001接口获取数据，接口的实现过程请点击 Python实现股票数据接口
OkGo.get(HttpApi.BASE_URL).tag(this)
.params("code", tkCode)
.execute(new StringCallback() {
@Override
public void onSuccess(String s, Call call, Response response) {
try {
Log.d(TAG, s);
JSONObject result = new JSONObject(s);
if (result.getInt("code") == 200) {
loadError = false;
if (tkData != null) {
tkData.clear();
}
String data = result.getString("data");
JSONArray array = new JSONArray(data);
for (int i = 0; i < array.length(); i++) {
JSONObject item = (JSONObject) array.opt(array.length() - 1 - i);
//解析基础数据
TkDetailsBean bean = new TkDetailsBean(
item.getString("cur_min_price"), item.getString("cur_close_price"),
item.getString("cur_timer"), item.getString("cur_price_range"),
item.getString("cur_max_price"), item.getString("cur_total_money"),
item.getString("cur_total_volume"), item.getString("cur_open_price")
);
tkData.add(bean);
}
}
} catch (JSONException e) {
e.printStackTrace();
}
}
@Override
public void onError(Call call, Response response, Exception e) {
super.onError(call, response, e);
if (reLoad) {
loadStickData(tkCode, false);//首次加载失败时再次加载
} else {
loadError = true;
SharedPreferencesUtils.setCurrentTkCode(tkCode);
ToastUtils.makeToast(MainActivity.this, "加载失败，请检查网络");
}
}
获取到数据后我们创建一个CandleDataSet对象，CandleDataSet需要传入一个List<CandleEntry>类型的参数，这个参数就是待展示的股票数据
CandleEntry ce = new CandleEntry(i-start_index, shadowH, shadowL, open, close);
yVals.add(ce);
candleDataSet = new CandleDataSet(yVals, "");
candleDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
candleDataSet.setShadowColor(Color.DKGRAY);//影线颜色
candleDataSet.setShadowColorSameAsCandle(true);//影线颜色与实体一致
candleDataSet.setShadowWidth(0.7f);//影线candleDataSet.setDecreasingColor(ContextCompat.getColor(MainActivity.this, R.color.blue_overlay));//下跌的颜色
candleDataSet.setDecreasingPaintStyle(Paint.Style.FILL);//红涨，实体
candleDataSet.setIncreasingColor(Color.RED);//上涨的颜色
candleDataSet.setIncreasingPaintStyle(Paint.Style.STROKE);//绿跌，空心
candleDataSet.setNeutralColor(Color.RED);//当天价格不涨不跌（一字线）颜色
candleDataSet.setHighlightLineWidth(0.5f);//选中蜡烛时的线宽 candleDataSet.setDrawValues(false);//在图表中的元素上面是否显示数值
candleDataSet.setHighLightColor(ContextCompat.getColor(MainActivity.this, R.color.y_page_bg));//高亮的颜色
CandleData candleData = new CandleData(xVals, candleDataSet);
最后我们将candleDataSet绑定到CandleStickChart
mChart.setData(candleData);
到此为止，我们已经使用MPAndroidChart完成了一个静态的K线面板，下个章节我们将介绍如何为K线面板添加手势操作
网友评论