Android实现水平带刻度的进度条
本文实例为大家分享了Android实现水平带刻度进度条的具体代码，供大家参考，具体内容如下
效果
1、attrsl.xml
<!-- 带刻度的 进度条 --> <declare-styleable name="HorizontalProgressSeekBar"> <attr name="progressColor" /> <attr name="max" /> <attr name="progressContentIcon" format="reference" /> <attr name="progressGoalIcon" format="reference" /> <attr name="progressGoalIconWidthHeight" format="dimension" /> <attr name="progressContentIconHeight" format="dimension" /> <attr name="progressContentIconWidth" format="dimension" /> <attr name="progressDistance" format="dimension" /> </declare-styleable>
2、HorizontalProgressSeekBar.class
public class HorizontalProgressSeekBar extends View {
private int viewWidth;
private int viewHeight;
private Paint strokePain;
private List<Integer> goalTimes;
private int maxData = 80;
private Bitmap progressGoalBitmap;
private Bitmap progressContentBitmap;
private float proceedTime;
private int PROGRESS_COLOR = Color.parseColor("#FE78A6");
private float goalProportion;
private Paint backgroundPaint;
private int distance = 10;
private int distancePxMax;
private int distancePxMin;
private int distancePx;
private RectF rectF;
private List<Integer> bitmapType;
private Bitmap bitmapHomeCornerKick;
private Bitmap bitmapHomeTeamRedCard;
private Bitmap bitmapHomeTeamScored;
private Bitmap bitmapVisitingCornerKick;
private Bitmap bitmapVisitingTeamScored;
private List<BollProgressDataBean> homeTeamIncidentList;
private List<BollProgressDataBean> visitingTeamIncidentList;
private BollProgressDataBean homeTeamIncidentListBean;
private BollProgressDataBean visitingTeamIncidentListBean;
private RectF rectFStrokePain;
private int bitmapHomeCornerKickWidth;
private int bitmapHomeTeamScoredWidth;
/**
* 绘制进球 时刻上主队
*
* @param canvas
*/
private float incidentTimeNumber;
public HorizontalProgressSeekBar(Context context) {
this(context, null);
}
public HorizontalProgressSeekBar(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public HorizontalProgressSeekBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.HorizontalProgressSeekBar);
try {
PROGRESS_COLOR = a.getColor(R.styleable.HorizontalProgressSeekBar_progressColor, PROGRESS_COLOR);
maxData = a.getInt(R.styleable.HorizontalProgressSeekBar_max, maxData);
int progressContentIconWidth = (int) a.getDimension(R.styleable.HorizontalProgressSeekBar_progressContentIconWidth, dipToPx(22));
int progressContentIconHeight = (int) a.getDimension(R.styleable.HorizontalProgressSeekBar_progressContentIconHeight, dipToPx(25));
progressContentBitmap = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(getContext().getResources(),
a.getResourceId(R.styleable.HorizontalProgressSeekBar_progressContentIcon, R.mipmap.rest)), progressContentIconWidth, progressContentIconHeight, true);
int progressGoalIconWidthHeight = (int) a.getDimension(R.styleable.HorizontalProgressSeekBar_progressGoalIconWidthHeight, dipToPx(22));
progressGoalBitmap = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(getContext().getResources(),
a.getResourceId(R.styleable.HorizontalProgressSeekBar_progressGoalIcon, R.drawable.share)), progressGoalIconWidthHeight, progressGoalIconWidthHeight, true);
bitmapHomeCornerKick = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(getContext().getResources(),
R.mipmap.home_corner_kick_xiao), progressGoalIconWidthHeight, progressGoalIconWidthHeight, true);
bitmapHomeTeamRedCard = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(getContext().getResources(),
R.mipmap.home_team_red_card_xiao), progressGoalIconWidthHeight, progressGoalIconWidthHeight, true);
bitmapHomeTeamScored = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(getContext().getResources(),
R.mipmap.home_team_scored_xiao), progressGoalIconWidthHeight, progressGoalIconWidthHeight, true);
bitmapVisitingCornerKick = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(getContext().getResources(),
R.mipmap.visiting_corner_kick_xiao), progressGoalIconWidthHeight, progressGoalIconWidthHeight, true);
bitmapVisitingTeamScored = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(getContext().getResources(),
R.mipmap.visiting_team_scored_xiao), progressGoalIconWidthHeight, progressGoalIconWidthHeight, true);
distancePx = a.getDimensionPixelOffset(R.styleable.HorizontalProgressSeekBar_progressDistance,dipToPx(distance));
if (bitmapHomeCornerKick != null){
bitmapHomeCornerKickWidth = bitmapHomeCornerKick.getWidth();
}
if (bitmapHomeTeamScored != null){
bitmapHomeTeamScoredWidth = bitmapHomeTeamScored.getWidth();
}
} finally {
a.recycle();
}
distancePxMax = dipToPx(distance + 2);
distancePxMin = dipToPx(distance - 2);
strokePain = new Paint();
backgroundPaint = new Paint();
}
/**
* 设置进球时间状态
*
* @param goalTimes
*/
public void setGoalTime(int max, float proceedTime, List<Integer> goalTimes) {
this.maxData = max;
this.proceedTime = proceedTime;
this.goalTimes = goalTimes;
invalidateView();
}
/**
* 设置进球时间状态
* max 计算90由于中间遮挡效果，所以传递按照100
* homeTeamIncidentList 主队时间和事件
* visitingTeamIncidentList 客队时间和事件
*/
public void setGoalTimeBitmap(int max, float proceedTime, List<BollProgressDataBean> homeTeamIncidentList, List<BollProgressDataBean> visitingTeamIncidentList) {
this.maxData = max;
this.proceedTime = proceedTime;
this.homeTeamIncidentList = homeTeamIncidentList;
this.visitingTeamIncidentList = visitingTeamIncidentList;
invalidateView();
}
public void setBitmapType(List<Integer> bitmapType) {
this.bitmapType = bitmapType;
invalidateView();
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
viewWidth = w;
viewHeight = h;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
drawProgress(canvas);
drawBorder(canvas);
drawMeasureBorder(canvas);
drawImage(canvas);
drawGoalTime(canvas);
drawGoalTimeButton(canvas);
}
/**
* 绘制空心 长方形
*
* @param canvas
*/
private void drawBorder(Canvas canvas) {
strokePain.reset();
strokePain.setStyle(Paint.Style.STROKE);
strokePain.setAntiAlias(true);
strokePain.setStrokeWidth(2);
strokePain.setColor(Color.parseColor("#151515"));
rectFStrokePain = new RectF(distancePx, viewHeight * 0.35f, viewWidth - distancePx, viewHeight * 0.65f);
canvas.drawRect(rectFStrokePain, strokePain);
}
private void drawProgress(Canvas canvas) {
strokePain.reset();
strokePain.setStyle(Paint.Style.FILL);
strokePain.setAntiAlias(true);
strokePain.setStrokeWidth(2);
strokePain.setColor(Color.parseColor("#258940"));
if (proceedTime <= 45) {
rectF = new RectF(distancePx, viewHeight * 0.35f, ((float) viewWidth - 2 * distancePx) * (proceedTime / maxData) + distancePx, viewHeight * 0.65f);
} else {
if (proceedTime >= 90) {
rectF = new RectF(distancePx, viewHeight * 0.35f, ((float) viewWidth - 2 * distancePx) * ((proceedTime + distance) / maxData) + distancePx, viewHeight * 0.65f);
} else {
rectF = new RectF(distancePx, viewHeight * 0.35f, ((float) viewWidth - 2 * distancePx) * ((proceedTime + distance) / maxData) + distancePx, viewHeight * 0.65f);
}
}
canvas.drawRect(rectF, strokePain);
}
/**
* 绘制刻度
*
* @param canvas
*/
private void drawMeasureBorder(Canvas canvas) {
strokePain.setStyle(Paint.Style.STROKE);
float eachWidth = (viewWidth - 2 * distancePx) / 20;
strokePain.setStrokeWidth(2);
int drawNoNumber = 20 / 2;
strokePain.setColor(Color.parseColor("#FF424242"));
for (int i = 1; i <= 19; i++) {
//长短线条
if (drawNoNumber != i && i != 9 && i != 11) {
if (i % 2 == 0) {
canvas.drawLine(eachWidth * i + distancePx, viewHeight * 0.66f, eachWidth * i + distancePx, viewHeight * 0.45f, strokePain);
} else {
canvas.drawLine(eachWidth * i + distancePx, viewHeight * 0.66f, eachWidth * i + distancePx, viewHeight * 0.55f, strokePain);
}
}
}
}
/**
* 绘制H 图片
*
* @param canvas
*/
private void drawImage(Canvas canvas) {
if (progressContentBitmap != null) {
canvas.drawBitmap(progressContentBitmap, (int) (viewWidth / 2.0 - progressContentBitmap.getWidth() / 2.0 ), (int) (viewHeight / 2.0 - (progressContentBitmap.getHeight()) / 2.0f), strokePain);
}
}
private void drawGoalTime(Canvas canvas) {
//主队比赛中的事件 14角球 2红牌 1进球
if (homeTeamIncidentList != null && homeTeamIncidentList.size() > 0) {
for (int i = 0; i < homeTeamIncidentList.size(); i++) {
homeTeamIncidentListBean = homeTeamIncidentList.get(i);
String incidentTime = homeTeamIncidentListBean.getIncidentTime();
String incidentType = homeTeamIncidentListBean.getIncidentType();
if (incidentTime != null) {
try {
incidentTimeNumber = Float.parseFloat(incidentTime);
} catch (Exception e) {
}
}
if (incidentTimeNumber == 0) {
if (incidentType != null) {
if ("14".equals(incidentType)) {
homeIncidentZero(canvas, bitmapHomeCornerKick, incidentTimeNumber, 0.15f, incidentType);
} else if ("2".equals(incidentType)) {
homeIncidentZero(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.25f, incidentType);
} else if ("1".equals(incidentType)) {
homeIncidentZero(canvas, bitmapHomeTeamScored, incidentTimeNumber, 0.25f, incidentType);
}
}
} else if (incidentTimeNumber <= 45 && incidentTimeNumber > 0) {
if (incidentType != null) {
if ("14".equals(incidentType)) {
homeTeamIncident(canvas, bitmapHomeCornerKick, incidentTimeNumber, 0.15f, incidentType);
} else if ("2".equals(incidentType)) {
homeTeamIncident(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.25f, incidentType);
} else if ("1".equals(incidentType)) {
homeTeamIncident(canvas, bitmapHomeTeamScored, incidentTimeNumber, 0.25f, incidentType);
}
}
} else if (incidentTimeNumber > 45 && incidentTimeNumber < 90) {
if (incidentType != null) {
if ("14".equals(incidentType)) {
homeIncident(canvas, bitmapHomeCornerKick, incidentTimeNumber, 0.15f, incidentType);
} else if ("2".equals(incidentType)) {
homeIncident(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.25f, incidentType);
} else if ("1".equals(incidentType)) {
homeIncident(canvas, bitmapHomeTeamScored, incidentTimeNumber, 0.25f, incidentType);
}
}
} else if (incidentTimeNumber >= 90) {
if (incidentType != null) {
incidentTimeNumber=90;
if ("14".equals(incidentType)) {
homeIncidentNinety(canvas, bitmapHomeCornerKick, incidentTimeNumber, 0.15f, incidentType);
} else if ("2".equals(incidentType)) {
homeIncidentNinety(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.25f, incidentType);
} else if ("1".equals(incidentType)) {
homeIncidentNinety(canvas, bitmapHomeTeamScored, incidentTimeNumber, 0.25f, incidentType);
}
}
}
}
}
}
/**
* 绘制进球 时刻下客队
*
* @param canvas
*/
private void drawGoalTimeButton(Canvas canvas) {
if (visitingTeamIncidentList != null && visitingTeamIncidentList.size() > 0) {
for (int i = 0; i < visitingTeamIncidentList.size(); i++) {
visitingTeamIncidentListBean = visitingTeamIncidentList.get(i);
String incidentTime = visitingTeamIncidentListBean.getIncidentTime();
String incidentType = visitingTeamIncidentListBean.getIncidentType();
if (incidentTime != null) {
try {
incidentTimeNumber = Float.parseFloat(incidentTime);
} catch (Exception e) {
}
}
if (incidentTimeNumber == 0) {
if (incidentType != null) {
if ("14".equals(incidentType)) {
homeIncidentZero(canvas, bitmapVisitingCornerKick, incidentTimeNumber, 0.56f, incidentType);
} else if ("2".equals(incidentType)) {
homeIncidentZero(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.45f, incidentType);
} else if ("1".equals(incidentType)) {
homeIncidentZero(canvas, bitmapVisitingTeamScored, incidentTimeNumber, 0.45f, incidentType);
}
}
} else if (incidentTimeNumber <= 45 && incidentTimeNumber > 0) {
if (incidentType != null) {
if ("14".equals(incidentType)) {
homeTeamIncident(canvas, bitmapVisitingCornerKick, incidentTimeNumber, 0.56f, incidentType);
} else if ("2".equals(incidentType)) {
homeTeamIncident(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.45f, incidentType);
} else if ("1".equals(incidentType)) {
homeTeamIncident(canvas, bitmapVisitingTeamScored, incidentTimeNumber, 0.45f, incidentType);
}
}
} else if (incidentTimeNumber > 45 && incidentTimeNumber < 90) {
if (incidentType != null) {
if ("14".equals(incidentType)) {
homeIncident(canvas, bitmapVisitingCornerKick, incidentTimeNumber, 0.56f, incidentType);
} else if ("2".equals(incidentType)) {
homeIncident(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.45f, incidentType);
} else if ("1".equals(incidentType)) {
homeIncident(canvas, bitmapVisitingTeamScored, incidentTimeNumber, 0.45f, incidentType);
}
}
} else if (incidentTimeNumber >= 90) {
if (incidentType != null) {
incidentTimeNumber=90;
if ("14".equals(incidentType)) {
homeIncidentNinety(canvas, bitmapVisitingCornerKick, incidentTimeNumber, 0.56f, incidentType);
} else if ("2".equals(incidentType)) {
homeIncidentNinety(canvas, bitmapHomeTeamRedCard, incidentTimeNumber, 0.45f, incidentType);
} else if ("1".equals(incidentType)) {
homeIncidentNinety(canvas, bitmapVisitingTeamScored, incidentTimeNumber, 0.45f, incidentType);
}
}
}
}
}
}
private void homeIncidentZero(Canvas canvas, Bitmap bitmapHomeCornerKick, float incidentTimeNumber, float v, String incidentType) {
if ("14".equals(incidentType)) {
canvas.drawBitmap(bitmapHomeCornerKick, (int) ((viewWidth - 2 * distancePx) * incidentTimeNumber / maxData - bitmapHomeCornerKickWidth / 2 + distancePxMax), viewHeight * v, strokePain);
} else {
canvas.drawBitmap(bitmapHomeCornerKick, (int) ((viewWidth - 2 * distancePx) * incidentTimeNumber / maxData - bitmapHomeCornerKickWidth / 2 + distancePx), viewHeight * v, strokePain);
}
}
private void homeIncidentNinety(Canvas canvas, Bitmap bitmapHomeTeamScored, float incidentTimeNumber, float v, String incidentType) {
if ("14".equals(incidentType)) {
canvas.drawBitmap(bitmapHomeTeamScored, (int) ((viewWidth) * (incidentTimeNumber + 10) / maxData - bitmapHomeTeamScoredWidth / 2) - distancePxMin, viewHeight * v, strokePain);
} else {
canvas.drawBitmap(bitmapHomeTeamScored, (int) ((viewWidth) * (incidentTimeNumber + 10) / maxData - bitmapHomeTeamScoredWidth / 2) - distancePx, viewHeight * v, strokePain);
}
}
private void homeIncident(Canvas canvas, Bitmap bitmapHomeTeamScored, float incidentTimeNumber, float v, String incidentType) {
if ("14".equals(incidentType)) {
canvas.drawBitmap(bitmapHomeTeamScored, (int) ((viewWidth - 2 * distancePx) * (incidentTimeNumber + 10) / maxData - bitmapHomeTeamScoredWidth / 2) + distancePxMax, viewHeight * v, strokePain);
} else {
canvas.drawBitmap(bitmapHomeTeamScored, (int) ((viewWidth - 2 * distancePx) * (incidentTimeNumber + 10) / maxData - bitmapHomeTeamScoredWidth / 2) + distancePx, viewHeight * v, strokePain);
}
}
private void homeTeamIncident(Canvas canvas, Bitmap bitmapHomeCornerKick, float incidentTimeNumber, float v, String incidentType) {
if ("14".equals(incidentType)) {
canvas.drawBitmap(bitmapHomeCornerKick, (int) ((viewWidth - 2 * distancePx) * (incidentTimeNumber) / maxData - bitmapHomeCornerKickWidth / 2) + distancePxMax, viewHeight * v, strokePain);
} else {
canvas.drawBitmap(bitmapHomeCornerKick, (int) ((viewWidth - 2 * distancePx) * (incidentTimeNumber) / maxData - bitmapHomeCornerKickWidth / 2) + distancePx, viewHeight * v, strokePain);
}
}
private void invalidateView() {
if (Looper.getMainLooper() == Looper.myLooper()) {
invalidate();
} else {
postInvalidate();
}
}
private int dipToPx(float dip) {
float density = getResources().getDisplayMetrics().density;
return (int) (dip * density + 0.5f * (dip >= 0 ? 1 : -1));
}
}
BollProgressDataBean.class
public class BollProgressDataBean {
private String incidentType; //主队比赛中的事件 0 角球 1红牌 2进球
private String incidentTime; //主队比赛中发生事件的时间
public String getIncidentType() {
return incidentType;
}
public void setIncidentType(String incidentType) {
this.incidentType = incidentType;
}
public String getIncidentTime() {
return incidentTime;
}
public void setIncidentTime(String incidentTime) {
this.incidentTime = incidentTime;
}
}
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
赞 (0)
相关推荐
-
Android 动态改变SeekBar进度条颜色与滑块颜色的实例代码
遇到个动态改变SeekBar进度条颜色与滑块颜色的需求,有的是根据不同进度改变成不同颜色. 对于这个怎么做呢?大家都知道设置下progressDrawable与thumb即可,但是这样设置好就是确定的了,要动态更改需要在代码里实现. 用shape进度条与滑块 SeekBar设置 代码里动态设置setProgressDrawable与setThumb 画图形,大家都比较熟悉,background是背景图,secondaryProgress第二进度条,progress进度条: <layer-list
-
Android中自定义进度条详解
Android原生控件只有横向进度条一种,而且没法变换样式,比如原生rom的样子 很丑是吧,当伟大的产品设计要求更换前背景,甚至纵向,甚至圆弧状的,咋办,比如: ok,我们开始吧: 一)变换前背景 先来看看progressbar的属性: 复制代码 代码如下: <ProgressBar android:id="@+id/progressBar" style="?android:attr/progressBarStyleHor
-
android自定义进度条渐变色View的实例代码
最近在公司,项目不是很忙了,偶尔看见一个兄台在CSDN求助,帮忙要一个自定义的渐变色进度条,我当时看了一下进度条,感觉挺漂亮的,就尝试的去自定义view实现了一个,废话不说,先上图吧! 这个自定义的view,完全脱离了android自带的ProgressView,并且没使用一张图片,这样就能更好的降低程序代码上的耦合性! 下面我贴出代码 ,大概讲解一下实现思路吧! 复制代码 代码如下: package com.spring.progressview; import android.conten
-
Android中实现Webview顶部带进度条的方法
写这篇文章,做份备忘,简单滴展示一个带进度条的Webview示例,进度条位于Webview上面. 示例图如下: 主Activity代码: 复制代码 代码如下: package com.droidyue.demo.webviewprogressbar; import android.app.Activity; import android.os.Bundle; import android.view.Menu; import android.view.View; import android.vi
-
实例详解Android自定义ProgressDialog进度条对话框的实现
Android SDK已经提供有进度条组件ProgressDialog组件,但用的时候我们会发现可能风格与我们应用的整体风格不太搭配,而且ProgressDialog的可定制行也不太强,这时就需要我们自定义实现一个ProgressDialog. 通过看源码我们发现,ProgressDialog继承自Alertdialog,有一个ProgressBar和两个TextView组成的,通过对ProgressDialog的源码进行改进就可以实现一个自定义的ProgressDialog. 1.效果: 首先
-
Android 七种进度条的样式
当一个应用在后台执行时,前台界面就不会有什么信息,这时用户根本不知道程序是否在执行.执行进度如何.应用程序是否遇到错误终止等,这时需要使用进度条来提示用户后台程序执行的进度.Android系统提供了两大类进度条样式,长形进度条(progress-BarStyleHorizontal) 和圆形进度条(progressBarStyleLarge).进度条用处很多,比如,应用程序装载资源和网络连接时,可以提示用户稍等,这一类进度条只是代表应用程序中某一部分的执行情况,而整个应用程序执行情况呢,则可以通
-
Android文件下载进度条的实现代码
main.xml: 复制代码 代码如下: <?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_paren
-
Android编程之ProgressBar圆形进度条颜色设置方法
本文实例讲述了Android ProgressBar圆形进度条颜色设置方法.分享给大家供大家参考,具体如下: 你是不是还在为设置进度条的颜色而烦恼呢--别着急,且看如下如何解决. ProgressBar分圆形进度条和水平进度条 我这里就分享下如何设置圆形进度条的颜色吧,希望对大家会有帮助. 源码如下: 布局文件代码: <ProgressBar android:id="@+id/progressbar" android:layout_width="wrap_content
-
android ListView和ProgressBar(进度条控件)的使用方法
ListView控件的使用:ListView控件里面装的是一行一行的数据,一行中可能有多列,选中一行,则该行的几列都被选中,同时可以触发一个事件,这种控件在平时还是用得很多的.使用ListView时主要是要设置一个适配器,适配器主要是用来放置一些数据.使用起来稍微有些复杂,这里用的是android自带的SimpleAdapter,形式如下:android.widget.SimpleAdapter.SimpleAdapter(Context context, List<? extends Map<
-
android中实现OkHttp下载文件并带进度条
OkHttp是比较火的网络框架,它支持同步与异步请求,支持缓存,可以拦截,更方便下载大文件与上传文件的操作.下面我们用OkHttp来下载文件并带进度条! 相关资料: 官网地址:http://square.github.io/okhttp/ github源码地址:https://github.com/square/okhttp 一.服务器端简单搭建 可以参考搭建本地Tomcat服务器及相关配置这篇文章. 新建项目OkHttpServer,在WebContent目录下新建downloadfile目录