Activity代码
1 public classMainActivity extends AppCompatActivity {2 ProcessImageView processImageView =null;3 int progress=0;4 5 @Override6 protected voidonCreate(Bundle savedInstanceState) {7 super.onCreate(savedInstanceState);8 setContentView(R.layout.activity_main);9 10 processImageView=(ProcessImageView) findViewById(R.id.image);11 //模拟图片上传进度
12 new Thread(newRunnable() {13 @Override14 public voidrun() {15 while (true){16 if(progress==100){//图片上传完成
17 return;18 }19 progress++;20 processImageView.setProgress(progress);21 try{22 Thread.sleep(200); //暂停0.2秒
23 } catch(InterruptedException e){24 e.printStackTrace();25 }26 }27 }28 }).start();29 }30 }
自定义view
1 public classProcessImageView extends ImageView{2 privateContext context;3 privatePaint paint;4 private LogUtil log=LogUtil.getInstance();5 int progress = 0;6 privateboolean flag;7 8 publicProcessImageView(Context context) {9 super(context);10 }11 12 publicProcessImageView(Context context, AttributeSet attrs) {13 this(context, attrs,0);14 }15 16 public ProcessImageView(Context context, AttributeSet attrs, intdefStyleAttr) {17 super(context, attrs, defStyleAttr);18 this.context=context;19 paint=newPaint();20 }21 22 @Override23 protected voidonDraw(Canvas canvas) {24 super.onDraw(canvas);25 paint.setAntiAlias(true); //消除锯齿
26 paint.setStyle(Paint.Style.FILL); //设置paint为实心, Paint.Style.STROKE为空心
27 paint.setColor(Color.parseColor("#70000000")); //设置为半透明
28 canvas.drawRect(0,0,getWidth(),getHeight()-getHeight()*progress/100,paint); //这里getWidth() 获取的是image对象宽高度 xml值*2
29 30 paint.setColor(Color.parseColor("#00000000"));//全透明
31 canvas.drawRect(0, getHeight() - getHeight() * progress / 100,32 getWidth(), getHeight(), paint);33 34 if(!flag){35 paint.setTextSize(30);36 paint.setColor(Color.parseColor("#FFFFFF"));37 paint.setStrokeWidth(2);38 Rect rect = newRect();39 paint.getTextBounds("100%", 0, "100%".length(), rect);//确定文字的宽度
40 canvas.drawText(progress + "%", getWidth() / 2 - rect.width() / 2,41 getHeight() / 2, paint);42 }43 }44 45 public void setProgress(intprogress) {46 this.progress =progress;47 if(progress==100){48 flag=true;49 }50 postInvalidate();51 }52 }
看下自定义view 类,主要onDraw()方法中.
绘制中分为三部分,
第一部分为上部分半透明区域
paint.setAntiAlias(true); //消除锯齿
paint.setStyle(Paint.Style.FILL); //设置paint为实心, Paint.Style.STROKE为空心
paint.setColor(Color.parseColor("#70000000")); //设置为半透明
canvas.drawRect(0,0,getWidth(),getHeight()-getHeight()*progress/100,paint);
第二部分为下部分全透明区域
paint.setColor(Color.parseColor("#00000000"));// 全透明
canvas.drawRect(0, getHeight() - getHeight() * progress / 100,
getWidth(), getHeight(), paint);
第三部分就是中间的progress值变化
if(!flag){
paint.setTextSize(30);
paint.setColor(Color.parseColor("#FFFFFF"));
paint.setStrokeWidth(2);
Rect rect = new Rect();
paint.getTextBounds("100%", 0, "100%".length(), rect);// 确定文字的宽度
canvas.drawText(progress + "%", getWidth() / 2 - rect.width() / 2,
getHeight() / 2, paint);
}