Android实现折线走势图的方法

小编给大家分享一下Android实现折线走势图的方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

网站建设哪家好,找创新互联公司!专注于网页设计、网站建设、微信开发、小程序开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了蕉城免费建站欢迎大家使用!

具体内容如下

先来看看效果图

Android实现折线走势图的方法

可以根据球的数量动态的改变自己的球半径,以及线宽

Android实现折线走势图的方法

代码实现也是超级简单

//获取自定义属性
private void obtainStyledAttrs(AttributeSet attrs) {
  TypedArray typedArray = getContext().obtainStyledAttributes(attrs,R.styleable.High_LowChartView);
  mTextSize = (int)typedArray.getDimension(R.styleable.High_LowChartView_hl_chart_textsize,mTextSize);
  mTextColor = typedArray.getColor(R.styleable.High_LowChartView_hl_chart_textcolor,mTextColor);
  if (typedArray.getString(R.styleable.High_LowChartView_hl_hchart_text)!=null){
   mHighText = typedArray.getString(R.styleable.High_LowChartView_hl_hchart_text);
  }
  if(typedArray.getString(R.styleable.High_LowChartView_hl_hchart_text)!=null){
   mLowText = typedArray.getString(R.styleable.High_LowChartView_hl_hchart_text);
  }
  mHighPointColor = typedArray.getColor(R.styleable.High_LowChartView_hl_chart_high_pointcolor,mHighPointColor);
  mLowPointColor = typedArray.getColor(R.styleable.High_LowChartView_hl_chart_low_pointcolor,mLowPointColor);
  mMainLineColor = typedArray.getColor(R.styleable.High_LowChartView_hl_chart_mianlinecolor,mMainLineColor);
  mChartLineColor = typedArray.getColor(R.styleable.High_LowChartView_hl_chart_chartlinecolor,mChartLineColor);
  mChartDistance = (int) typedArray.getDimension(R.styleable.High_LowChartView_hl_chart_distance,mChartDistance);

  init();
  typedArray.recycle();
 }

//重写onMeasure
 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  super.onMeasure(widthMeasureSpec, heightMeasureSpec);
  int width = MeasureSpec.getSize(widthMeasureSpec);
  int height = measureHeight(heightMeasureSpec);
  setMeasuredDimension(width,height);

 }
//计算view需要的高度
 private int measureHeight(int heightMeasureSpec) {
  int result = 0;
  int mode = MeasureSpec.getMode(heightMeasureSpec);
  int size = MeasureSpec.getSize(heightMeasureSpec);
  if(mode == MeasureSpec.EXACTLY){//如果给了具体值则直接用
   result=size;
  }else {
  //否则高度等于字高与球直径的最大值
   textHeight = (mPaint.descent()-mPaint.ascent());
   float halfHeight = Math.max(textHeight, mPointMaxHeight) / 2;
   result = (int) (halfHeight+mChartDistance);
   //如果模式为AT_MOST即:测量高度不能超过父类给定的高度则取测量结果与size的最小值
   if(mode==MeasureSpec.AT_MOST){
    result = Math.min(result,size);
   }
  }
  return result;
 }

 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  if(!initMeasure()) return;
  canvas.save();
  //1先画两条主线
  mPaint.setColor(mMainLineColor);
  mPaint.setStrokeWidth(mainLineHeight);

  //high Line
  canvas.drawLine(textWidth+DEFAULT_OFFSETTING,mainLinePosition,w,mainLinePosition,mPaint);
  //low Line
  canvas.drawLine(textWidth+DEFAULT_OFFSETTING,mainLinePosition+mChartDistance,w,mainLinePosition+mChartDistance,mPaint);

  //2再画文字
  mPaint.setColor(mTextColor);
  mPaint.setTextAlign(Paint.Align.LEFT);
  Paint.FontMetricsInt fontMetrics = mPaint.getFontMetricsInt();
  RectF rt1=new RectF(0,mainLinePosition-textHeight/2,w,mainLinePosition+textHeight/2);
  int baseline = (int) ((rt1.bottom + rt1.top - fontMetrics.bottom - fontMetrics.top) / 2);
  canvas.drawText(mHighText,0,baseline,mPaint);
  canvas.drawText(mLowText,0,baseline+mChartDistance,mPaint);

  //3初始化小球圆心
  canvas.translate(textWidth+DEFAULT_OFFSETTING,0);

  for (int i=0;i=2){
   mPaint.setColor(mChartLineColor);
   mPaint.setStrokeWidth(chartLineWidth);
   for (int i=0;imPointNum){
   mainLineHeight=dp2px(3);
  }else if(10<=mPointNum&&20>mPointNum){
   mainLineHeight = dp2px(2);
  }else {
   mainLineHeight = dp2px(1);
  }

  //主线长度等于总宽度-(文字宽度+30px)
  textWidth=Math.max(mPaint.measureText(mHighText),mPaint.measureText(mLowText));
  mainLineWidth = (int) (w-(textWidth+DEFAULT_OFFSETTING));

  /*小球直径应该由主线长度与小球数量决定*/
  //理想直径
  float ideaDia = mainLineWidth / (mPointNum + (mPointNum + 1));
  //小球直径不能大于最大直径
  if(ideaDia>mPointMaxHeight){
//   Log.i("TTT","ideaDia>mPointMaxHeight");
   pointHeight = mPointMaxHeight;
   offsetX=(mainLineWidth-mPointNum*pointHeight)/(mPointNum+1);
   //(极端情况)如果小球直径小于线高,为小球直径+2px
  }else if(ideaDia<=mainLineHeight){
//   Log.i("TTT","ideaDia<=mPointMaxHeight");
   pointHeight = mainLineHeight+2;
   offsetX=(mainLineWidth-mPointNum*pointHeight)/(mPointNum+1);
  }else {
//   Log.i("TTT"," pointHeight=offsetX=ideaDia");
   pointHeight=offsetX=ideaDia;
  }
  //主线位置
  mainLinePosition = (h-mChartDistance)/2;
  //折线宽度
  chartLineWidth = mainLineHeight/2;
  return true;
 }

//刷新小球集合
 public void setPointList(List list){
  if (list==null&&list.size()==0) return;
  mList.clear();
  if (list.size()>150) {
   mList.addAll(list.subList(0,150));
  } else {
   mList.addAll(list);
  }
  invalidate();
 }

使用示例

好了这样折线图就绘制完成了,是不是很简单呢?

以上是“Android实现折线走势图的方法”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!


新闻标题:Android实现折线走势图的方法
本文链接:http://scyanting.com/article/gcicie.html