Android 自定义view实现进度条加载效果实例代码

这个其实很简单,思路是这样的,就是拿view的宽度,除以点的点的宽度+二个点 之间的间距,就可以算出大概能画出几个点出来,然后就通过canvas画出点,再然后就是每隔多少时间把上面移动的点不断的去改变它的坐标就可以,

效果如下:

分析图:

代码如下:

package com.example.dotloadview;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.os.Handler;
import android.util.AttributeSet;
import android.view.View;
/**
 * Created by zhouguizhi on 6/18/15.
 */
public class DotLoadProgressView extends View {
  private boolean isStart = false;
  private int dotIndex =0;//点下面的角标
  private int dotNumber = 0;
  private Paint mPaint;
  private int paddingTop = 50;
  private int paddingBottom = 50;
  private int paddingLeft = 30;
  private int paddingRight = 30;
  private Handler mHandler = new Handler();
  private long DELAY_TIME = 300;
  private Bitmap bitmap;
  private int itemDotSpace = 10;//二个点之间的距离
  private Bitmap moveBitmap ;
  private Runnable mRunnable = new Runnable() {
    @Override
    public void run() {
      if (dotNumber != 0){
        dotIndex = (dotIndex + 1) % dotNumber;
      }
      invalidate();
      mHandler.postDelayed(mRunnable, DELAY_TIME);
    }
  };
  public DotLoadProgressView(Context context, AttributeSet attrs) {
    super(context, attrs);
    moveBitmap = BitmapFactory.decodeResource(getResources(),R.drawable.active_dot);
    init();
  }
  private void init() {
    mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mPaint.setStyle(Paint.Style.FILL);
    mPaint.setDither(true);
    mPaint.setAntiAlias(true);
  }
  @Override
  protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    for(int i=0;i<dotNumber;i++){
      canvas.drawBitmap(bitmap,paddingLeft+i*itemDotSpace+bitmap.getWidth()*i,paddingTop,mPaint);
    }
    if(isStart){
      canvas.drawBitmap(moveBitmap,paddingLeft+dotIndex*itemDotSpace+moveBitmap.getWidth()*dotIndex,paddingTop,mPaint);
    }
  }
  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    int parentWidth = MeasureSpec.getSize(widthMeasureSpec);
    bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.inactive_dot);
    setMeasuredDimension(parentWidth,bitmap.getHeight()+paddingTop+paddingBottom);
    int widthWithoutPadding = parentWidth - paddingLeft - paddingRight;
    dotNumber = calculateDotsNumber(widthWithoutPadding);
  }
  private int calculateDotsNumber(int width) {
    int number = (width / (itemDotSpace + bitmap.getWidth()));
    return number;
  }
  public void startProgress() {
    isStart = true;
    dotIndex = -1;
    mHandler.removeCallbacks(mRunnable);
    mHandler.post(mRunnable);
  }
  public void stopProgress() {
    isStart = false;
    mHandler.removeCallbacks(mRunnable);
    invalidate();
  }
  @Override
  protected void onAttachedToWindow() {
    super.onAttachedToWindow();
    startProgress();
  }
  @Override
  protected void onDetachedFromWindow() {
    super.onDetachedFromWindow();
    stopProgress();
  }
}

布局代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="wrap_content">
  <com.example.dotloadview.DotLoadProgressView
    android:id="@+id/progress1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    />
</RelativeLayout>

二个点其实是图片,在网上别人项目中拿出来用的,如果感觉那个点图片大了的话,有二个办法,第一叫你们美工切小点,第二就是通过drawable.setBound()去限制他大小了,我在这其实是偷懒,没有那么做,当然这点你也可以通过shade去做,而不用图片的话
最终的效果图还是这样的:

总结

以上所述是小编给大家介绍的Android 自定义view实现进度条加载效果实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

时间: 2017-08-26

Android自定义View仿华为圆形加载进度条

View仿华为圆形加载进度条效果图 实现思路 可以看出该View可分为三个部分来实现 最外围的圆,该部分需要区分进度圆和底部的刻度圆,进度部分的刻度需要和底色刻度区分开来 中间显示的文字进度,需要让文字在View中居中显示 旋转的小圆点,小圆点需要模拟小球下落运动时的加速度效果,开始下落的时候慢,到最底部时最快,上来时速度再逐渐减慢 具体实现 先具体细分讲解,博客最后面给出全部源码 (1)首先为View创建自定义的xml属性 在工程的values目录下新建attrs.xml文件 <resourc

Android进度条控件progressbar使用方法详解

一.简介 二.方法 1)进度条ProgressBar使用方法 1.在layout布局文件中创建ProgressBar控件 <ProgressBar style="?android:attr/progressBarStyleHorizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:progress="30&

Android实现蜗牛进度条效果

友好的界面可以给用户留下深刻印象,为APP加分,今天实现的这个进度条,以蜗牛爬动的方式告诉用户当前进度,体验比较棒,这里分享一下. 这里创建一组帧动画作为进度条的标志,如下: <?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:onesho

Android自定义双向进度条的实现代码

想整个双向的进度条,就是可以选取播放范围的. 像这样: 然而官方控件里只有单向的.不要慌,我们自己画一个. 绘制一个进度条主要是三方面.1.样式,2.尺寸,3.操作监听. 完整代码来一遍: 注释基本上就把原理说明了一下. package util; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint;

Android自定义圆形进度条

今天小编来手写一个自定义圆形进度条:先看效果: 首先我们在attrs属性文件中增加几个自定义属性 <?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="CustomProgressBar"> <!-- 圆形进度条进度显示的颜色 --> <attr name="roundProgressC

Android编程实现对话框形式进度条功能示例

本文实例讲述了Android编程实现对话框形式进度条功能.分享给大家供大家参考,具体如下: MainActivity代码如下: package com.example.myapplication; import android.app.ProgressDialog; import android.content.DialogInterface; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; i

android 中win10 使用uwp控件实现进度条Marquez效果

本文将告诉大家,如何做一个带文字的进度条,这个进度条可以用在游戏,现在我做的挂机游戏就使用了他. 如何做上图的效果,实际需要的是两个控件,一个是显示文字 的 TextBlock 一个是进度条. 那么如何让 文字和左边的距离变化?使用 TranslateTransform 看起来 Marquez 的界面就是: <ProgressBar x:Name="Mcdon" Maximum="100" Minimum="0" Value="2

Android实现文件解压带进度条功能

解压的工具类 package com.example.videodemo.zip; public class ZipProgressUtil { /*** * 解压通用方法 * * @param zipFileString * 文件路径 * @param outPathString * 解压路径 * @param listener * 加压监听 */ public static void UnZipFile(final String zipFileString, final String out

android自定义进度条渐变色View的实例代码

最近在公司,项目不是很忙了,偶尔看见一个兄台在CSDN求助,帮忙要一个自定义的渐变色进度条,我当时看了一下进度条,感觉挺漂亮的,就尝试的去自定义view实现了一个,废话不说,先上图吧! 这个自定义的view,完全脱离了android自带的ProgressView,并且没使用一张图片,这样就能更好的降低程序代码上的耦合性! 下面我贴出代码  ,大概讲解一下实现思路吧! 复制代码 代码如下: package com.spring.progressview; import android.conten

Android自定义View实现环形进度条的思路与实例

前言 前段时间看到了豆瓣FM的音乐播放界面,有一个环形的进度条,非常的好看,于是想了想,为什么不自己做一个呢,于是就开始了自定义的过程 豆瓣FM的播放界面如下图: 功能分析 虽然功能比较简单,但是仍然需要仔细分析 1.图标外还有一圈圆圈,可以设置宽度 2.圆形进度条和进度条底部,可以设置宽度,颜色等 3.内部有一个圆形图片,可旋转 实现思路分析 1.可以设置宽度的圆圈 这个比较容易,直接在onDraw方法中使用canvas绘制即可,当然,在间距和半径的处理上需要仔细,控件本体其实还是一个长方形,

Android编程自定义进度条颜色的方法详解

本文实例讲述了Android编程自定义进度条颜色的方法.分享给大家供大家参考,具体如下: 先看效果图: 老是提些各种需求问题,我觉得系统默认的颜色挺好的,但是Pk不过,谁叫我们不是需求人员呢,改吧! 这个没法了只能看源码了,还好下载了源码, sources\base\core\res\res\ 下应有尽有,修改进度条颜色只能找progress ,因为是改变样式,首先找styles.xml 找到xml后,进去找到: <style name="Widget.ProgressBar"&

Android编程实现自定义进度条颜色的方法

本文实例讲述了Android编程实现自定义进度条颜色的方法.分享给大家供大家参考,具体如下: android 自定义进度条颜色 先看图 基于产品经理各种自定义需求,经过查阅了解,下面是自己对android自定义进度条的学习过程! 这个没法了只能看源码了,还好下载了源码, sources\base\core\res\res\  下应有尽有,修改进度条颜色只能找progress ,因为是改变样式,首先找styles.xml 找到xml后,进去找到 <style name="Widget.Pro

Android编程实现列表侧滑删除的方法详解

本文实例讲述了Android编程实现列表侧滑删除的方法.分享给大家供大家参考,具体如下: 前言:今天突然想起来了列表的滑动删除功能,一些下拉刷新的框架也会带这个侧滑删除的功能,比如一些listview的和recycleview的刷新框架都有这个功能,我今天写这个博客的目的是如何不依赖这些框架也是实现侧滑删除,如果自己已经使用的列表框架没有侧滑删除怎么给单独加入侧滑删除功能. 概括:我今天写的这个文章就是讲的是怎么单独给列表加入侧滑删除功能,不去为了侧滑删除而依赖一个列表框架,就是说如果需要的话可

Android编程使用Intent传递图片的方法详解

本文实例讲述了Android编程使用Intent传递图片的方法.分享给大家供大家参考,具体如下: 基本思路是先把bitmap转化为byte数组,用Intent传递数组,在将数组转化为bitmap bitmap转化为byte数组的方法: private byte[] Bitmap2Bytes(Bitmap bm){ ByteArrayOutputStream baos = new ByteArrayOutputStream(); bm.compress(Bitmap.CompressFormat.

Android编程简易实现XML解析的方法详解

本文实例讲述了Android编程简易实现XML解析的方法.分享给大家供大家参考,具体如下: 首先创建在Android工程中创建一个Assets文件夹 app/src/main/assets 在这里添加一个名为 data.xml的文件,然后编辑这个文件,加入如下XML格式内容 <?xml version="1.0" encoding="utf-8"?> <apps> <app> <id>1</id> <

Android编程实现震动与振铃的方法详解

本文实例讲述了Android编程实现震动与振铃的方法.分享给大家供大家参考,具体如下: 1.Android的震动实现--Vibrator类 (1)实现震动,首先要加上使用震动所需的权限 <uses-permission android:name="android.permission.VIBRATE" /> 注:更多关于Android权限控制说明可参考http://tools.jb51.net/table/AndroidManifest (2)需要用到的API boolea

Android编程之ProgressBar圆形进度条颜色设置方法

本文实例讲述了Android ProgressBar圆形进度条颜色设置方法.分享给大家供大家参考,具体如下: 你是不是还在为设置进度条的颜色而烦恼呢--别着急,且看如下如何解决. ProgressBar分圆形进度条和水平进度条 我这里就分享下如何设置圆形进度条的颜色吧,希望对大家会有帮助. 源码如下: 布局文件代码: <ProgressBar android:id="@+id/progressbar" android:layout_width="wrap_content

Android编程自定义圆角半透明Dialog的方法

本文实例讲述了Android编程自定义圆角半透明Dialog的方法.分享给大家供大家参考,具体如下: 效果图如下: 只是在实例化的时候使用带样式的构造函数即可 new MyDialog(GameActivity.this, R.style.dialog); 在value文件夹中添加mydialogthemes.xml <?xml version="1.0″ encoding=" utf-8″?> <resources> <style name="

Android编程实现随机生成颜色的方法示例

本文实例讲述了Android编程实现随机生成颜色的方法.分享给大家供大家参考,具体如下: 网上有个ColorPicker开源项目,选择颜色值.而在这里我想实现的是动态修改一个view的背景色. 开一个线程,每隔1s修改一次view的背景色. 我们知道在Android里设置一个view的背景色有 framelayout.setBackgroundColor(Color.parseColor("#"+arg0.obj)); 就是用android的Color类去解析一个带#号的十六进制色值.

Android AsyncTask实现异步处理任务的方法详解

Android AsyncTask实现异步处理任务的方法详解 在开发Android应用时必须遵守单线程模型的原则:Android UI操作并不是线程安全的并且这些操作必须在UI线程中执行. Android 单线程模型概念详解:http://www.jb51.net/article/112165.htm 在单线程模型中始终要记住两条法则: 不要阻塞UI线程 确保只在UI线程中访问Android UI工具包 当一个程序第一次启动时,Android会同时启动一个对应的主线程(Main Thread),