Android中制作进度框和环形进度条的简单实例分享_Android

进度框

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View; 

import java.util.Random; 

public class ObliqueProgressbar extends View { 

  private Paint mPaint;
  private float mProgress; 

  public ObliqueProgressbar(Context context) {
    this(context, null);
  } 

  public ObliqueProgressbar(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
  } 

  public ObliqueProgressbar(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr); 

    mPaint = new Paint();
    mPaint.setAntiAlias(true);
  } 

  @Override
  protected void onDraw(Canvas canvas) {
    super.onDraw(canvas); 

    if (mProgress == 0) return; 

    //碎片雨
    mPaint.setColor(Color.parseColor("#a96ecb"));
    mPaint.setStrokeWidth(3);
    Random random = new Random();
    int sx, sy;
    for (int i = 0; i < 200; i++) {
      sx = random.nextInt(getWidth() + 10);
      sy = random.nextInt(getHeight() + 10);
//      canvas.drawLine(sx, sy, sx+random.nextInt(5), sy+random.nextInt(5), mPaint);
      canvas.drawCircle(sx, sy, random.nextInt(5) + 1, mPaint);
    } 

    //进度
    mPaint.setColor(Color.parseColor("#6AFFFFFF"));
    mPaint.setStrokeWidth(15);
    float x = mProgress * getWidth();
    for (int i = 0; i < x; i += 30) {
      canvas.drawLine(i - 30, -10, i + 30, getHeight() + 10, mPaint);
    } 

  } 

  public void setProgress(float progress) {
    this.mProgress = progress;
    invalidate();
  }
} 

环形进度条

先来看一下效果:

下面直接上代码了:

ckage com.stone.circleprogressbar.view; 

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.view.View; 

import com.stone.circleprogressbar.R; 

public class CircleProgressbar extends View { 

 private float mProgress;
 private int mBarColor;
 private int mTextColor;
 private float mTextSize; 

 public CircleProgressbar(Context context) {
  this(context, null);
 } 

 public CircleProgressbar(Context context, AttributeSet attrs) {
  this(context, attrs, 0);
 } 

 public CircleProgressbar(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr); 

  TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.CircleProgressbar);
  mBarColor = array.getColor(R.styleable.CircleProgressbar_barColor, Color.GRAY);
  mTextColor = array.getColor(R.styleable.CircleProgressbar_textColor, Color.GRAY);
  mProgress = array.getFloat(R.styleable.CircleProgressbar_progress, 0);
 } 

 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  super.onMeasure(widthMeasureSpec, heightMeasureSpec);
 } 

 public void setProgress(float count) {
  mProgress = count;
  invalidate();
 } 

 @Override
 protected void onDraw(Canvas canvas) {
  int w = getWidth();
  int h = getHeight();
  int strokeWidth = 20;
  int radius = w / 2 - strokeWidth / 2;//大圆 半径
  Bitmap barBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
  Paint paint = new Paint();
  paint.setAntiAlias(true); //抗锯齿
  paint.setStrokeWidth(strokeWidth); //描边宽
  paint.setDither(true); //防抖动 

  /* 外边框 */
  Canvas circleCanvas = new Canvas(barBitmap);
  RectF rect = new RectF(0, 0, w, h);
  paint.setColor(Color.argb(0x11, 0xcc, 0xcc, 0xcc));
//  circleCanvas.drawRect(rect, paint); //没啥用 只是看外边框的 

  /* 内圆 */
  paint.setColor(Color.CYAN);
  paint.setShader(new LinearGradient(0, 0, w, h, Color.RED, Color.GREEN, Shader.TileMode.CLAMP));
  circleCanvas.drawCircle(w / 2, h / 2, radius - strokeWidth / 2, paint);
  paint.setShader(null); 

  /* 外圆 */
  paint.setColor(mBarColor);
  paint.setStyle(Paint.Style.STROKE);
  circleCanvas.drawCircle(w / 2, h / 2, radius, paint); 

  /* 圆弧 */
  paint.setShader(new LinearGradient(0, 0, w, h,
    new int[]{Color.GREEN, Color.MAGENTA, Color.CYAN, Color.RED},
    new float[]{0.2f, 0.5f, 0.7f, 1.0f}, Shader.TileMode.CLAMP));
  float cur = mProgress * 360 * 0.01f;
  circleCanvas.drawArc(new RectF(strokeWidth / 2, strokeWidth / 2, w - strokeWidth / 2, h - strokeWidth / 2),
    360 - 45, cur, false, paint);
  paint.setShader(null); 

  /* 文本 */
  paint.setColor(mTextColor);
  if (mTextSize == 0) {
   calcTextSize(paint, w, strokeWidth);
  } else {
   paint.setTextSize(mTextSize);
  }
  paint.setTextAlign(Paint.Align.LEFT);//default
  String percent = mProgress + "%";
  paint.setStyle(Paint.Style.FILL);
  circleCanvas.drawText(percent, w / 2 - paint.measureText(percent) / 2, h / 2 + paint.getTextSize() / 2, paint); 

  canvas.drawBitmap(barBitmap, 0, 0, paint);
 } 

 /**
  * 计算并设置最适合的textSize
  *
  * @param paint
  * @param max 最大宽度
  * @param offset 偏移
  */
 private void calcTextSize(Paint paint, int max, int offset) {
  float width = paint.measureText("99.99%");
  while (width < max * 3 / 5) {
   paint.setTextSize(paint.getTextSize() + 5);
   width = paint.measureText("92.88%") + offset / 2;
  }
  mTextSize = paint.getTextSize();
 } 

} 

设置进度刷新显示  调用  setProgress()即可。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索java
, android
, 进度条
, 环形进度条
进度框
android 环形进度条、ios 环形进度条、css3环形进度条、环形进度条、svg环形百分比进度条,以便于您获取更多的相关知识。

时间: 2024-11-22 22:37:25

Android中制作进度框和环形进度条的简单实例分享_Android的相关文章

Android中制作进度框和环形进度条的简单实例分享

进度框 import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import android.view.View; import java.util.Random; public class ObliqueProgressbar ext

Android应用中制作选中后图标变大浮动效果的代码分享_Android

 最近在玩3g体育门户客户端的时候,看到这样个效果: 轻触赛事图标,会有一个图标变大浮出的效果.,蛮有意思的.于是就把仿照它做了一个.   这个是原图:               实际上是给图标的触摸事件中添加了一个缩放的动画,代码如下. package com.test; import android.app.Activity; import android.os.Bundle; import android.view.MotionEvent; import android.view.Vie

Android应用中拍照后获取照片路径并上传的实例分享_Android

Activity 中的代码,我只贴出重要的事件部分代码 public void doPhoto(View view) { destoryBimap(); String state = Environment.getExternalStorageState(); if (state.equals(Environment.MEDIA_MOUNTED)) { Intent intent = new Intent("android.media.action.IMAGE_CAPTURE"); s

Android控件之SlidingDrawer(滑动式抽屉)详解与实例分享_Android

SlidingDrawer效果想必大家也见到过,它就是1.5模拟器上进入应用程序列表的效果.下面是截图 一.简介  SlidingDrawer隐藏屏外的内容,并允许用户通过handle以显示隐藏内容.它可以垂直或水平滑动,它有俩个View组成,其一 是可以拖动的handle,其二是隐藏内容的View.它里面的控件必须设置布局,在布局文件中必须指定handle和content.例如下面 复制代码 代码如下: <SlidingDrawer android:layout_width="fill_

Android中RecyclerView上拉下拉,分割线,多条目的实例代码

//activity的xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity

js中 计算两个日期间的工作日的简单实例_javascript技巧

实例如下: //起始日期,/pattern/是正则表达式的界定符,pattern是要匹配的内容,只用于第一个符号的匹配,g为全局匹配标志 var beginDate = new Date("2013-01-01".replace(/-/g, "/")); //结束日期 var endDate = new Date("2013-01-31".replace(/-/g, "/")); //日期差值,即包含周六日.以天为单位的工时,

通过jquery-ui中的sortable来实现拖拽排序的简单实例_jquery

1.引入文件 <script src="{sh::PUB}js/jquery-1.10.1.min.js"></script> <link rel="stylesheet" href="Public/css/jquery-ui.min.css"> <script src="{sh::PUB}js/jquery-ui.min.js"></script> 2.给元素附上s

Android 复制文本内容到系统剪贴板的最简单实例(分享)

这个例子很简单,直接上截图和代码. 布局文件activity_copy.xml代码如下: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layou

Android应用中炫酷的横向和环形进度条的实例分享_Android

一.概述最近需要用进度条,秉着不重复造轮子的原则,上github上搜索了一番,看了几个觉得比较好看的ProgressBar,比如:daimajia的等.简单看了下代码,基本都是继承自View,彻彻底底的自定义了一个进度条.盯着那绚丽滚动条,忽然觉得,为什么要通过View去写一个滚动条,系统已经提供了ProgressBar以及属于它的特性,我们没必要重新去构建一个,但是系统的又比较丑,不同版本变现还不一定一样.那么得出我们的目标:改变系统ProgressBar的样子. 对没错,我们没有必要去从0打