您的位置:首页 > 移动开发 > Android开发

android自定义ImageView仿图片上传

2017-04-21 21:12 337 查看


Activity代码

1 public class MainActivity extends AppCompatActivity {
2     ProcessImageView processImageView =null;
3     int progress=0;
4
5     @Override
6     protected void onCreate(Bundle savedInstanceState) {
7         super.onCreate(savedInstanceState);
8         setContentView(R.layout.activity_main);
9
10         processImageView=(ProcessImageView) findViewById(R.id.image);
11         //模拟图片上传进度
12         new Thread(new Runnable() {
13             @Override
14             public void run() {
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 class ProcessImageView extends ImageView{
2     private Context context;
3     private Paint paint;
4     private LogUtil log=LogUtil.getInstance();
5     int progress = 0;
6     private boolean flag;
7
8     public ProcessImageView(Context context) {
9         super(context);
10     }
11
12     public ProcessImageView(Context context, AttributeSet attrs) {
13         this(context, attrs,0);
14     }
15
16     public ProcessImageView(Context context, AttributeSet attrs, int defStyleAttr) {
17         super(context, attrs, defStyleAttr);
18         this.context=context;
19         paint=new Paint();
20     }
21
22     @Override
23     protected void onDraw(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 = new Rect();
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(int progress) {
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);
}


  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐