一步一步教你写股票走势图——K线图一（概述）

最新推荐文章于 2024-04-12 02:40:10 发布

置顶 A-Jiang

最新推荐文章于 2024-04-12 02:40:10 发布

阅读量3w

点赞数 6

文章标签：股票 mpandroid chart k线分时

本文链接：https://blog.csdn.net/qqyanjiang/article/details/51675225

版权

demo更新地址https://github.com/AndroidJiang/StockChart

股票分时图部分已经开发完毕，受到了广大开发者的好评！界面、功能都挺完美，解决了好一些MP开发者的问题，博主甚是欣悦，更有动力去开源K线图。这里说一下，如果有问题直接留言或者发邮件，github上个人信息有邮件，我看到基本都会回复，博主不加qq的，体谅O(∩_∩)O。

分析

好了，废话不多说，我们分析下K线图吧，首先我们看下自选股K线图的效果吧

这里写图片描述

效果还是很赞的，经过分时图的研究后，博主越来越确信自选股用的应该也是MP的库，效果太相似了，不过人家优化做的好，自定义的效果也很赞，不愧是腾讯程序员啊！赞~

我们简单剖析下K线界面，由上下两部分组成，和分时图一样，下面都是柱状图，区别是K线可以滚动，而上面就比较复杂了，由折线图和蜡烛图组合而成，好在MP库现在支持组合图了，那么我们干嘛不动手开始码代码呢？

核心代码

初始表

 private void initChart() {
        barChart.setDrawBorders(true);
        barChart.setBorderWidth(1);
        barChart.setBorderColor(getResources().getColor(R.color.minute_grayLine));
        barChart.setDescription("");
        barChart.setDragEnabled(true);
        barChart.setScaleYEnabled(false);
        barChart.setAutoScaleMinMaxEnabled(true);
        Legend barChartLegend = barChart.getLegend();
        barChartLegend.setEnabled(false);
        //bar x y轴
        xAxisBar = barChart.getXAxis();
        xAxisBar.setDrawLabels(true);
        xAxisBar.setDrawGridLines(false);
        xAxisBar.setDrawAxisLine(false);
        xAxisBar.setTextColor(getResources().getColor(R.color.minute_zhoutv));
        xAxisBar.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxisBar.setGridColor(getResources().getColor(R.color.minute_grayLine));

        axisLeftBar = barChart.getAxisLeft();
        axisLeftBar.setAxisMinValue(0);
        axisLeftBar.setDrawGridLines(false);
        axisLeftBar.setDrawAxisLine(false);
        axisLeftBar.setTextColor(getResources().getColor(R.color.minute_zhoutv));
        axisLeftBar.setDrawLabels(true);
        axisLeftBar.setShowOnlyMinMax(true);
        axisRightBar = barChart.getAxisRight();
        axisRightBar.setDrawLabels(false);
        axisRightBar.setDrawGridLines(false);
        axisRightBar.setDrawAxisLine(false);

        /****************************************************************/
        combinedchart.setDrawBorders(true);
        combinedchart.setBorderWidth(1);
        combinedchart.setBorderColor(getResources().getColor(R.color.minute_grayLine));
        combinedchart.setDescription("");
        combinedchart.setDragEnabled(true);
        combinedchart.setScaleYEnabled(false);
        combinedchart.setAutoScaleMinMaxEnabled(true);
        Legend combinedchartLegend = combinedchart.getLegend();
        combinedchartLegend.setEnabled(false);
        //bar x y轴
        xAxisK = combinedchart.getXAxis();
        xAxisK.setDrawLabels(true);
        xAxisK.setDrawGridLines(false);
        xAxisK.setDrawAxisLine(false);
        xAxisK.setTextColor(getResources().getColor(R.color.minute_zhoutv));
        xAxisK.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxisK.setGridColor(getResources().getColor(R.color.minute_grayLine));

        axisLeftK = combinedchart.getAxisLeft();
        axisLeftK.setDrawGridLines(true);
        axisLeftK.setDrawAxisLine(false);
        axisLeftK.setDrawLabels(true);
        axisLeftK.setTextColor(getResources().getColor(R.color.minute_zhoutv));
        axisLeftK.setGridColor(getResources().getColor(R.color.minute_grayLine));
        axisLeftK.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);
        axisRightK = combinedchart.getAxisRight();
        axisRightK.setDrawLabels(false);
        axisRightK.setDrawGridLines(true);
        axisRightK.setDrawAxisLine(false);
        axisRightK.setGridColor(getResources().getColor(R.color.minute_grayLine));
    }

数据

 private void setData(MinuteHelper mData) {
        kLineDatas = mData.getKLineDatas();
        axisLeftBar.setAxisMaxValue(mData.getVolmax());
        String unit = MyUtils.getVolUnit(mData.getVolmax());
        int u = 1;
        if (unit.equals("万手")) {
            u = 4;
        } else if (unit.equals("亿手")) {
            u = 8;
        }
        axisLeftBar.setValueFormatter(new VolFormatter((int) Math.pow(10, u)));
        axisRightBar.setAxisMaxValue(mData.getVolmax());


        ArrayList<String> xVals = new ArrayList<String>();
        ArrayList<BarEntry> barEntries = new ArrayList<BarEntry>();
        ArrayList<CandleEntry> candleEntries = new ArrayList<CandleEntry>();
        for (int i = 0, j = 0; i < mData.getKLineDatas().size(); i++, j++) {
            xVals.add(mData.getKLineDatas().get(i).date + "");
            barEntries.add(new BarEntry(mData.getKLineDatas().get(i).vol, i));
            candleEntries.add(new CandleEntry(i, mData.getKLineDatas().get(i).high, mData.getKLineDatas().get(i).low, mData.getKLineDatas().get(i).open, mData.getKLineDatas().get(i).close));
        }
        barDataSet = new BarDataSet(barEntries, "成交量");
        barDataSet.setBarSpacePercent(50); //bar空隙
        barDataSet.setHighLightColor(Color.WHITE);
        barDataSet.setHighLightAlpha(255);
        barDataSet.setDrawValues(false);
        barDataSet.setHighlightEnabled(true);
        barDataSet.setColor(Color.RED);
        BarData barData = new BarData(xVals, barDataSet);
        barChart.setData(barData);
        barChart.setVisibleXRange(30, 100);


        CandleDataSet candleDataSet = new CandleDataSet(candleEntries, "KLine");
        candleDataSet.setDrawHorizontalHighlightIndicator(false);
        candleDataSet.setValueTextSize(10f);
        candleDataSet.setDrawValues(false);
        candleDataSet.setColor(Color.RED);
        candleDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
        CandleData candleData = new CandleData(xVals, candleDataSet);


        CombinedData combinedData=new CombinedData(xVals);
        combinedData.setData(candleData);
        combinedchart.setData(combinedData);
        combinedchart.setVisibleXRange(30, 100);
        barChart.invalidate();
        combinedchart.invalidate();
    }

离线数据已经放在Constant中，方便用户的测试，代码已经搞完，我们到目前为止没有加任何特效，单纯的使用了MP库，小伙伴们肯定迫不及待要看效果了，没问题，请看：

这里写图片描述

这个效果跟人家的差了猴子一跟头的距离啊！下面说下存在哪些需要优化的地方，这些地方将会在接下来的文章中得意优化。

初始化表时K线左边y轴不显示labels和gridlines
表之间联动
高亮问题
柱状图y轴labels显示
三条均线图
表数据滑动加载更多

暂时已经发现了那么多问题，看来K线开发要比分时图复杂啊！不急，只要大家能star我的项目，相信以上的问题都会解决掉的，有了大家的star，博主才会更有动力去解决以上的一些问题！谢谢大家的关注，本篇结束，请期待下一篇的发布吧！

补充：
如果发现图表初始化不对齐，需要手动移动后才对齐的话，则采用handler延迟刷新图表即可，y轴没有图标，也可采用如上方法，详见demo。

demo更新地址https://github.com/AndroidJiang/StockChart

A-Jiang

关注

6
点赞
踩
67

收藏

觉得还不错? 一键收藏
42
评论
一步一步教你写股票走势图——K线图一（概述）

股票分时图部分已经开发完毕，受到了广大开发者的好评！界面、功能都挺完美，解决了好一些MP开发者的问题，博主甚是欣悦，更有动力去开源K线图。这里说一下，如果有问题直接留言或者发邮件，github上个人信息有邮件，我看到基本都会回复，博主不加qq的，体谅O(∩_∩)O。分析好了，废话不多说，我们分析下K线图吧，首先我们看下自选股K线图的效果吧效果还是很赞的，经过分时图的研究后，博主越来越确信自选股用的应
复制链接

扫一扫