免费网站源码,高端移动网站建设,广告设计公司售后服务承诺书,单页网站 营销这个进度条可以反映真实进度#xff0c;并且完成百分比的文字时随着进度增加而移动的#xff0c;所在位置也恰好是真实完成的百分比位置#xff0c;效果如下#xff1a;思路如下#xff1a;第一部分是左侧的蓝色直线#xff0c;代表已经完成的进度#xff1b;第二部分是…这个进度条可以反映真实进度并且完成百分比的文字时随着进度增加而移动的所在位置也恰好是真实完成的百分比位置效果如下思路如下第一部分是左侧的蓝色直线代表已经完成的进度第二部分是右侧灰色的直线代表未完成的进度第三部分是红色的百分比的数字百分比文本显示当前确切的完成进度。最关键的部分就是要确定百分比文本的确切位置这里用了paint的getTextBounds方法得到文本的宽高然后再精确确定它的位置。view代码如下public class NumberProgressView extends View {/*** 进度条画笔的宽度(dp)*/private int paintProgressWidth 3;/*** 文字百分比的字体大小(sp)*/private int paintTextSize 20;/*** 左侧已完成进度条的颜色*/private int paintLeftColor 0xff67aae4;/*** 右侧未完成进度条的颜色*/private int paintRightColor 0xffaaaaaa;/*** 百分比文字的颜色*/private int paintTextColor 0xffff0077;/*** Contxt*/private Context context;/*** 主线程传过来进程 0 - 100*/private int progress;/*** 得到自定义视图的宽度*/private int viewWidth;/*** 得到自定义视图的Y轴中心点*/private int viewCenterY;/*** 画左边已完成进度条的画笔*/private Paint paintleft new Paint();/*** 画右边未完成进度条的画笔*/private Paint paintRight new Paint();/*** 画中间的百分比文字的画笔*/private Paint paintText new Paint();/*** 要画的文字的宽度*/private int textWidth;/*** 画文字时底部的坐标*/private float textBottomY;/*** 包裹文字的矩形*/private Rect rect new Rect();/*** 文字总共移动的长度(即从0%到100%文字左侧移动的长度)*/private int totalMovedLength;public NumberProgressView(Context context, AttributeSet attrs) {super(context, attrs);this.context context;// 构造器中初始化数据initData();}/*** 初始化数据*/private void initData() {//设置进度条画笔的宽度int paintProgressWidthPx Utils.dip2px(context, paintProgressWidth);//设置百分比文字的尺寸int paintTextSizePx Utils.sp2px(context, paintTextSize);// 已完成进度条画笔的属性paintleft.setColor(paintLeftColor);paintleft.setStrokeWidth(paintProgressWidthPx);paintleft.setAntiAlias(true);paintleft.setStyle(Style.FILL);// 未完成进度条画笔的属性paintRight.setColor(paintRightColor);paintRight.setStrokeWidth(paintProgressWidthPx);paintRight.setAntiAlias(true);paintRight.setStyle(Style.FILL);// 百分比文字画笔的属性paintText.setColor(paintTextColor);paintText.setTextSize(paintTextSizePx);paintText.setAntiAlias(true);paintText.setTypeface(Typeface.DEFAULT_BOLD);}Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);getWidthAndHeight();}/*** 得到视图等的高度宽度尺寸数据*/private void getWidthAndHeight() {//得到包围文字的矩形的宽高paintText.getTextBounds(000%, 0, 000%.length(), rect);textWidth rect.width();textBottomY viewCenterY rect.height() / 2;//得到自定义视图的高度int viewHeight getMeasuredHeight();viewWidth getMeasuredWidth();viewCenterY viewHeight / 2;totalMovedLength viewWidth - textWidth;}Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);//得到float型进度float progressFloat progress / 100.0f;//当前文字移动的长度float currentMovedLentgh totalMovedLength * progressFloat;//画左侧已经完成的进度条长度为从Veiw左端到文字的左侧canvas.drawLine(0, viewCenterY, currentMovedLentgh, viewCenterY, paintleft);//画右侧未完成的进度条这个进度条的长度不是严格按照百分比来缩放的因为文字的长度会变化所以它的长度缩放比例也会变化if (progress 10) {canvas.drawLine(currentMovedLentgh textWidth * 0.5f, viewCenterY, viewWidth, viewCenterY, paintRight);} else if (progress 100) {canvas.drawLine(currentMovedLentgh textWidth * 0.75f, viewCenterY, viewWidth, viewCenterY, paintRight);} else {canvas.drawLine(currentMovedLentgh textWidth, viewCenterY, viewWidth, viewCenterY, paintRight);}//画文字(注意文字要最后画因为文字和进度条可能会有重合部分所以要最后画文字用文字盖住重合的部分)canvas.drawText(progress %, currentMovedLentgh, textBottomY, paintText);}/*** param progress 外部传进来的当前进度*/public void setProgress(int progress) {this.progress progress;invalidate();}}调用者activity的代码设置进度条的进度public class NumberProgressBarActivity extends Activity {protected static final int WHAT_INCREASE 1;private NumberProgressView np_numberProgressBar;private int progress;private Handler handler new Handler() {public void handleMessage(android.os.Message msg) {progress;np_numberProgressBar.setProgress(progress);handler.sendEmptyMessageDelayed(WHAT_INCREASE, getRadomNumber(50, 200));if (progress 100) {handler.removeMessages(WHAT_INCREASE);}}};Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_number_progress_bar);np_numberProgressBar (NumberProgressView) findViewById(R.id.np_numberProgressBar);Button btn_numberProgressBar (Button) findViewById(R.id.btn_numberProgressBar);btn_numberProgressBar.setOnClickListener(new OnClickListener() {Overridepublic void onClick(View v) {increase();}});}private void increase() {progress 0;np_numberProgressBar.setProgress(0);handler.removeMessages(WHAT_INCREASE);handler.sendEmptyMessage(WHAT_INCREASE);}/*** 得到两个整数之间的一个随机数** param start 较小的数* param end 较大的数* return*/public int getRadomNumber(int start, int end) {return (int) (start Math.random() * (end - start));}}工具方法/*** 将dip或dp值转换为px值保证尺寸大小不变*/public static int dip2px(Context context, float dipValue) {final float scale context.getResources().getDisplayMetrics().density;return (int) (dipValue * scale 0.5f);}/*** 将sp值转换为px值保证文字大小不变*/public static int sp2px(Context context, float spValue) {final float fontScale context.getResources().getDisplayMetrics().scaledDensity;return (int) (spValue * fontScale 0.5f);}布局android:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:orientationverticalandroid:idid/np_numberProgressBarandroid:layout_widthwrap_contentandroid:layout_height100dpandroid:layout_margin20dpandroid:background#33890075/android:idid/btn_numberProgressBarandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:text开始/以上就是本文的全部内容希望对大家的学习有所帮助也希望大家多多支持脚本之家。
