Android自定义view实现动态柱状图

Android自定义view实现动态柱状图,第1张

概述先看一下动态柱状图效果。主要功能是可以自定义指定的字体,柱状图颜色,动态效果。

先看一下动态柱状图效果。

主要功能是可以自定义指定的字体,柱状图颜色,动态效果。

在自定义view

public class Histogram extends VIEw { int MAX = 100;//矩形显示的最大值 int corner = 0; //矩形的角度。 设置为0 则没有角度。 double data = 0.0;//显示的数 double tempData = 0; //初始数据 int textpadding = 50; //字体与矩形图的距离  Paint mPaint; int mcolor;  Context mContext; //构造函数 public Histogram(Context context) {  super(context);  mContext = context; } public Histogram(Context context,@Nullable AttributeSet attrs) {  super(context,attrs);  mContext = context;  initPaint(); } public Histogram(Context context,@Nullable AttributeSet attrs,int defStyleAttr) {  super(context,attrs,defStyleAttr);  mContext = context;  initPaint(); } //画笔方法 private voID initPaint() {  mPaint = new Paint();  mPaint.setAntiAlias(true);  mcolor = mContext.getResources().getcolor(R.color.gary);  mPaint.setcolor(mcolor); } @OverrIDe public voID draw(Canvas canvas) {  super.draw(canvas);  if (data == 0.0) {   mPaint.setTextSize(getWIDth() / 2);   RectF oval3 = new RectF(0,getHeight() - DensityUtils.pxTodip(mContext,20),getWIDth(),getHeight());// 设置个新的长方形   canvas.drawRoundRect(oval3,DensityUtils.pxTodip(mContext,corner),mPaint);   canvas.drawText("0",getWIDth() * 0.5f - mPaint.measureText("0") * 0.5f,20) - 2 * DensityUtils.pxTodip(mContext,textpadding),mPaint);   return;  }  //防止数值很大的的时候,动画时间过长  int step = (int) (data / 100 + 1.0);  if (tempData < data - step) {   tempData = tempData + step;  } else {   tempData = data;  }  //画圆角矩形  String S = tempData + ""; //如果数字后面需要加% 则在""中添加%  //设置显示的字体  Typeface typeface = Typeface.createFromAsset(getContext().getAssets(),"digital-7.ttf");  mPaint.setTypeface(typeface);//  //一个字和两,三个字的字号相同  if (S.length() < 4) {   mPaint.setTextSize(getWIDth()/2 );  } else {   mPaint.setTextSize(50); //可以通过getWIDth()/2 改变字体大小 也可以通过设置数字来改变自己想要的字体大小 当超出矩形图宽度时不能显示全部  }//  float textH = mPaint.ascent() + mPaint.descent();  float MaxH = getHeight() - textH - 2 * DensityUtils.pxTodip(mContext,textpadding);//  //圆角矩形的实际高度  float realH = (float) (MaxH / MAX * tempData);  RectF oval3 = new RectF(0,getHeight() - realH,getHeight());// 设置个新的长方形  canvas.drawRoundRect(oval3,mPaint);  //写数字  canvas.drawText(S,getWIDth() * 0.5f - mPaint.measureText(S) * 0.5f,getHeight() - realH - 2 * DensityUtils.pxTodip(mContext,mPaint);  if (tempData != data) {   postInvalIDate();  } } public voID setData(double data,int MAX) {  this.data = data;  this.MAX = MAX;  postInvalIDate(); } public int getmcolor() {  return mcolor; } public voID setmcolor(int mcolor) {  this.mcolor = mcolor; }}

布局

<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID" androID:ID="@+ID/activity_main" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:layout_weight="1" > <VIEw  androID:layout_wIDth="0dp"  androID:layout_height="match_parent"  androID:layout_weight="0.2"/> <com.mIEasy.myhistogramvIEw.Histogram  androID:ID="@+ID/column_one"  androID:layout_wIDth="0dp"  androID:layout_height="300dp"  androID:layout_weight="0.8"/> <VIEw  androID:layout_wIDth="0dp"  androID:layout_height="match_parent"  androID:layout_weight="2.4"/> <com.mIEasy.myhistogramvIEw.Histogram  androID:ID="@+ID/column_two"  androID:layout_wIDth="0dp"  androID:layout_height="300dp"  androID:layout_weight="1"/> <VIEw  androID:layout_wIDth="0dp"  androID:layout_height="match_parent"  androID:layout_weight="2.4"/> <com.mIEasy.myhistogramvIEw.Histogram  androID:ID="@+ID/column_three"  androID:layout_wIDth="0dp"  androID:layout_height="300dp"  androID:layout_weight="1"/> <VIEw  androID:layout_wIDth="0dp"  androID:layout_height="match_parent"  androID:layout_weight="0.2"/></linearLayout>

MainActivity调用initAllVIEws()方法

 private voID initAllVIEws() {  column_one = (Histogram) findVIEwByID(R.ID.column_one);  column_two = (Histogram) findVIEwByID(R.ID.column_two);  column_three = (Histogram) findVIEwByID(R.ID.column_three);  column_one.setData( 20.22,100);  column_two.setData(30.2,100);  column_three.setData(40,100);  column_one.mPaint.setcolor(getResources().getcolor(R.color.colorAccent)); //改变柱状图的颜色 }

参考文章:100行Android代码轻松实现带动画柱状图

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的Android自定义view实现动态柱状图全部内容,希望文章能够帮你解决Android自定义view实现动态柱状图所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1144955.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-31
下一篇2022-05-31

发表评论

登录后才能评论

评论列表(0条)

    保存