MPAndroidChartAndroid进阶之路Android开发经验谈

MPAndroidChart中k线图自定义x轴标签。

2019-10-24  本文已影响0人  想要去远方的人

本文链接:https://www.jianshu.com/p/65fcc31b1f5f

首先上效果图,避免大家走错地方了。

效果图

前言

由于该库获取X轴顶部和底部只能显示相同的数据,不能改变数据和加图标,而需求又需要加其他数据和图标变化显示,X轴上下都需要显示数据和图标。该库没有提供,搜了一些资料都没有,所以就自己动手,记录一下。


1.在XAxisRenderer这个类中找到了renderAxisLabels(Canvas c) 绘制X轴的方法

找到了在哪里绘制的这就好办了,然后顺腾摸瓜找到绘制每一个数据的方法

发现在红圈标注的地方设置了Paint

找到了这些我们就可以动手试着去改了,上代码

自定义了它的XAxisRenderer

,

下面付带完整MyXAxisRenderer的代码



public class MyXAxisRenderer extends XAxisRenderer {

    public MyXAxisRenderer(ViewPortHandler viewPortHandler, XAxis xAxis, Transformer trans) {

        super(viewPortHandler, xAxis, trans);

    }

//    renderAxisLabels

    @Override

    public void renderAxisLabels(Canvas c) {

        super.renderAxisLabels(c);

        if (isDrawTop) {

            float yoffset = mXAxis.getYOffset() + ScreenTool.dip2px(10);

            MPPointF pointF = MPPointF.getInstance(0, 0);

            drawOtherLabel(c, mViewPortHandler.contentTop() - yoffset, pointF);

        }

}

    //画其他的x  轴数字

    private void drawOtherLabel(Canvas c, float pos, MPPointF anchor) {

        final float labelRotationAngleDegrees = mXAxis.getLabelRotationAngle();

        boolean centeringEnabled = mXAxis.isCenterAxisLabelsEnabled();

        float[] positions = new float[mXAxis.mEntryCount* 2];

        for (int i= 0; i< positions.length; i+= 2) {

            // only fill x values

            if (centeringEnabled) {

                positions[i] = mXAxis.mCenteredEntries[i/ 2];

            } else {

                positions[i] = mXAxis.mEntries[i/ 2];

            }

}

        mTrans.pointValuesToPixel(positions);

        for (int i= 0; i< positions.length; i+= 2) {

            float x= positions[i];

            if (mViewPortHandler.isInBoundsX(x)) {

                String val = mXAxis.getValueFormatter().getFormattedValue(mXAxis.mEntries[i/ 2], mXAxis);

                if (mAxis.mEntries[i/ 2] < lineData.size()) {

                    if ((int) mXAxis.mEntries[i/ 2] != 0) {

                        String label= lineData.get((int) mXAxis.mEntries[i/ 2]).getWendu();

                        if (label== null || label.equals("")) {

                            label= "";

                        } else {

                            label+= "°C";

                        }

                        if (mXAxis.isAvoidFirstLastClippingEnabled()) {

                            // avoid clipping of the last

                            if (i== mXAxis.mEntryCount- 1 && mXAxis.mEntryCount> 1) {

                                float width = Utils.calcTextWidth(mAxisLabelPaint, label);

                                if (width > mViewPortHandler.offsetRight() * 2

                                        && x+ width > mViewPortHandler.getChartWidth())

                                    x-= width / 2;

                                // avoid clipping of the first

                            } else if (i== 0) {

                                float width = Utils.calcTextWidth(mAxisLabelPaint, label);

                                x+= width / 2;

                            }

}

                        mAxisLabelPaint.setColor(mXAxis.getTextColor());

                        int mBitWidth = ScreenTool.dip2px(20);

                        int mBitHeight = mBitWidth;

                        Paint mBitPaint = new Paint(Paint.ANTI_ALIAS_FLAG);

                        mBitPaint.setFilterBitmap(true);

                        mBitPaint.setDither(true);

                        if (weatherIcons.containsKey(lineData.get((int) mXAxis.mEntries[i/ 2]).getTianqi())) {

                            int res = weatherIcons.get(lineData.get((int) mXAxis.mEntries[i/ 2]).getTianqi());

                            Bitmap mBitmap = ((BitmapDrawable) MyApp.getInstance().getResources().getDrawable(res)).getBitmap();

                            Bitmap bi = Bitmap.createScaledBitmap(mBitmap, mBitWidth, mBitHeight, true);

                            float bitmapX= x- mBitWidth - ScreenTool.dip2px(3);

                            if (label.equals("")) {

                                bitmapX= x;

                            }

                            c.drawBitmap(bi, bitmapX, pos -ScreenTool.dip2px(5) , null);

                        }

                        String wendu = lineData.get((int) mXAxis.mEntries[i/ 2]).getWendu();

                        if (wendu != null && !wendu.equals("")) {

                            int temp = Integer.valueOf(wendu);

                            if (temp <= 18) {

                                mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.light_blue));

                            } else if (temp > 18 && temp < 22) {

                                mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.light_green));

                            } else if (temp >= 22 && temp < 25) {

                                mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.main_orange_color));

                            } else {

                                mAxisLabelPaint.setColor(MyApp.getInstance().getResources().getColor(R.color.light_red));

                            }

}

                        if (label!= null) {

                            drawLabel(c, label, x, pos, anchor, labelRotationAngleDegrees);

                        }

}

}

}

}

}

    public void setWeatherTemp(List<HistoryGradeInfo> lineData) {

        weatherIcons.put("晴", R.drawable.ic_weather_sunny);

        weatherIcons.put("阴", R.drawable.ic_weather_blue_yin_day);

        weatherIcons.put("雨", R.drawable.ic_weather_blue_rain_day);

        weatherIcons.put("雪", R.drawable.ic_weather_blue_snow_day);

        this.lineData= new ArrayList<>();

        HistoryGradeInfo hi = new HistoryGradeInfo();

        hi.setTianqi("");

        hi.setWendu("");

        this.lineData.add(hi);

        for (HistoryGradeInfo item : lineData) {

            this.lineData.add(item);

        }

}

    public void setDrawTop(boolean isDrawTop) {

        this.isDrawTop= isDrawTop;

    }

    private boolean isDrawTop= false;

    private List<HistoryGradeInfo> lineData;

    private HashMap<String, Integer> weatherIcons= new HashMap<>();

}


在LineChart中使用MyXAxisRenderer


public class MyLineChart extends LineChart {

    public MyLineChart(Context context) {

        super(context);

    }

    public MyLineChart(Context context, AttributeSet attrs) {

        super(context, attrs);

    }

    public MyLineChart(Context context, AttributeSet attrs, int defStyle) {

        super(context, attrs, defStyle);

    }

    @Override

    protected void init() {

        super.init();

        mXAxisRenderer= new MyXAxisRenderer(mViewPortHandler, mXAxis, mLeftAxisTransformer);

    }

  public MyXAxisRenderer getMyXAxisRenderer(){

        return (MyXAxisRenderer) mXAxisRenderer;

  }

}

在项目中引用自己修改过的MyLineChart

        获取lineChart对象开启绘制顶部数据和设置顶部的数据 和修改里面的颜色

参考  daio_odai 的帖子: https://blog.csdn.net/daio_odai/article/details/84106099 

     终于写完了,这是我第一次写文章,有的还不知道怎么使用,可能读起来会很吃力,有什么好的建议希望能提出来,我会尽快去提示自己表述和编辑这方面的能力,最后,希望这篇文章能帮到有需要的小伙伴。

  如有什么疑问大家可以加我qq:549813516 或邮箱私信我:im.wyu@qq.com

上一篇下一篇

猜你喜欢

热点阅读