当前位置： 移动技术网 > IT编程>移动开发>Android > android自定义ImageView仿图片上传示例

android自定义ImageView仿图片上传示例

2019年07月24日  | 移动技术网IT编程  | 我要评论

mei,周末休息,唐海情

看下效果图

主要看下自定义view 代码

public class processimageview extends imageview{ 
  private context context; 
  private paint paint; 
  private logutil log=logutil.getinstance(); 
  int progress = 0; 
  private boolean flag; 
 
  public processimageview(context context) { 
    super(context); 
  } 
 
  public processimageview(context context, attributeset attrs) { 
    this(context, attrs,0); 
  } 
 
  public processimageview(context context, attributeset attrs, int defstyleattr) { 
    super(context, attrs, defstyleattr); 
    this.context=context; 
    paint=new paint(); 
  } 
 
  @override 
  protected void ondraw(canvas canvas) { 
    super.ondraw(canvas); 
    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); //这里getwidth() 获取的是image对象宽高度 xml值*2 
 
    paint.setcolor(color.parsecolor("#00000000"));// 全透明 
    canvas.drawrect(0, getheight() - getheight() * progress / 100, 
        getwidth(), getheight(), paint); 
 
    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); 
    } 
  } 
 
  public void setprogress(int progress) { 
    this.progress = progress; 
    if(progress==100){ 
      flag=true; 
    } 
    postinvalidate(); 
  } 
}

里面代码很详细了。

然后看下 activity代码

public class mainactivity extends appcompatactivity { 
  processimageview processimageview =null; 
  int progress=0; 
 
  @override 
  protected void oncreate(bundle savedinstancestate) { 
    super.oncreate(savedinstancestate); 
    setcontentview(r.layout.activity_main); 
 
    processimageview=(processimageview) findviewbyid(r.id.image); 
    //模拟图片上传进度 
    new thread(new runnable() { 
      @override 
      public void run() { 
        while (true){ 
          if(progress==100){//图片上传完成 
            return; 
          } 
          progress++; 
          processimageview.setprogress(progress); 
          try{ 
            thread.sleep(200); //暂停0.2秒 
          } catch (interruptedexception e){ 
            e.printstacktrace(); 
          } 
        } 
      } 
    }).start(); 
  } 
}

下面来详细介绍view代码。

首先从图中可以看到 中间有个参数变化，这个进度值不断变化，我们再activity 中使用了一个线程 ，每隔0.2 秒会增加progress这个值，然后通过 processimageview.setprogress(progress); 改变view类中 progress重绘制这个定义view.

然后看下自定义view 类，主要ondraw（）方法中.

绘制中分为三部分，

第一部分为上部分半透明区域

第二部分为下部分全透明区域

第三部分就是中间的progress值变化

先看第一个部分画出上部分半透明，

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);

第三部分动态改变字符串

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); 
    }

源码地址

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网