android自定义View实现图片上传进度显示(仿手机QQ上传效果)
来源:互联网 发布:网络推广月工作计划 编辑:程序博客网 时间:2024/05/16 08:08
首先看下我们想要实现的效果如下图(qq聊天中发送图片时的效果):
再看一下我实现的效果:
1、效果已经看见了,下面我们来实现它。首先我创建一个android工程ProgressImageView。然后我们重写ImageView控件,创建ProcessImageView类代码如下:
package com.example.processimageview;import android.annotation.SuppressLint;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Rect;import android.util.AttributeSet;import android.view.ViewGroup.LayoutParams;import android.widget.ImageView;public class ProcessImageView extends ImageView { private Paint mPaint;// 画笔 int width = 0; int height = 0; Context context = null; int progress = 0; public ProcessImageView(Context context) { super(context); // TODO Auto-generated constructor stub } 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; mPaint = new Paint(); } @SuppressLint("DrawAllocation") @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); mPaint.setAntiAlias(true); // 消除锯齿 mPaint.setStyle(Paint.Style.FILL); mPaint.setColor(Color.parseColor("#70000000"));// 半透明 canvas.drawRect(0, 0, getWidth(), getHeight()- getHeight() * progress / 100, mPaint); mPaint.setColor(Color.parseColor("#00000000"));// 全透明 canvas.drawRect(0, getHeight() - getHeight() * progress / 100, getWidth(), getHeight(), mPaint); mPaint.setTextSize(30); mPaint.setColor(Color.parseColor("#FFFFFF")); mPaint.setStrokeWidth(2); Rect rect = new Rect(); mPaint.getTextBounds("100%", 0, "100%".length(), rect);// 确定文字的宽度 canvas.drawText(progress + "%", getWidth() / 2 - rect.width() / 2, getHeight() / 2, mPaint); } public void setProgress(int progress) { this.progress = progress; postInvalidate(); };}
2、将ProcessImageView控件加入activity_layout.xml布局文件中,代码如下;
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.example.processimageview.MainActivity" > <com.example.processimageview.ProcessImageView android:id="@+id/image" android:layout_centerInParent = "true" android:layout_width="200dp" android:layout_height="300dp" android:contentDescription="This is a ProcessImage" android:src="@drawable/image" /> </RelativeLayout>
3、最后一步,显示效果(是不是很激动),在MainActivity类加入显示进度条的ImageView,代码如下:
package com.example.processimageview;import android.app.Activity;import android.os.Bundle;import android.os.Handler;import android.os.Message;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.view.ViewGroup.LayoutParams;import android.widget.Toast;public class MainActivity extends Activity { ProcessImageView processImageView =null; private final int SUCCESS=0; int progress=0; Handler handler=new Handler(){ @Override public void handleMessage(Message msg) { super.handleMessage(msg); switch (msg.what) { case SUCCESS: Toast.makeText(MainActivity.this, "图片上传完成", Toast.LENGTH_SHORT).show(); processImageView.setVisibility(View.GONE); break; } } }; @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){//图片上传完成 handler.sendEmptyMessage(SUCCESS); return; } progress++; processImageView.setProgress(progress); try{ Thread.sleep(200); //暂停0.2秒 } catch (InterruptedException e){ e.printStackTrace(); } } } }).start(); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); }}
4、编译运行,大功告成。
1 0
- android自定义View实现图片上传进度显示(仿手机QQ上传效果)
- android自定义View实现图片上传进度显示(仿手机QQ上传效果)
- android自定义View实现图片上传进度显示(仿手机QQ上传效果)
- 安卓自定义View实现图片上传进度显示(仿QQ)
- 安卓自定义View实现图片上传进度显示(仿QQ)
- 安卓自定义View实现图片上传进度显示(仿QQ)
- Android 自定义阴影进度实现仿QQ图片上传
- 自定义View实现图片上传进度显示
- 自定义View实现类似QQ图片上传的效果
- 实现自定义view(2):仿Android QQ多屏幕显示ListView的效果
- Android实现仿QQ的图片上传方式
- Android自定义View——仿QQ等级天数进度
- Android:自定义View实现水波进度效果
- Android仿QQ空间发说说实现上传图片到服务器(带缩略图的)
- 《Android-圆形图片处理(上传)进度显示》
- Android 自定义View修炼-仿360手机卫士波浪球进度的实现
- android自定义ImageView仿图片上传
- 使用AFN上传图片,显示上传进度
- Linux线程互斥锁
- Unable to instantiate fragment make sure class name exists, is public, and has an empty constructor
- 用命令行运行hadoop程序WordCount
- 找到一篇关于form以post、get方式提交数据中文乱码问题总结
- Web前后端分离:MVC简介
- android自定义View实现图片上传进度显示(仿手机QQ上传效果)
- 最近对IT行业收入的话题火起来了,我也来说说毕业三年混到20万的经历
- ios开发-Autolayout
- Java中的二维数组和c语言中的二维数组的区别
- OpenSessionInViewFilter-no session
- iOS NSNotificationCenter 使用姿势详解
- [leetcode] Contains Duplicate II
- iOS编程——预编译命令#include、#import和@class
- Mac 下配置Android NDK 环境变量[附带网盘NDK下载]