`
zdphpn
  • 浏览: 11451 次
  • 性别: Icon_minigender_1
  • 来自: 邯郸市
社区版块
存档分类
最新评论

20、长图的加载显示

阅读更多
        有时候图片很长,预览只是其一部分,有个类似按钮点击之后加载全图并显示,类似于GIF的加载显示。

ListAdapter中:

else if("lmg".equals(data.type)){
	Drawable drawable=lmgload.loadImage(viewparent,tagpre,data.dataurl,null);
	if(drawable!=null){
		LayoutParams lp=holder.rl_data.getLayoutParams();
		lp.height=itemwidth*drawable.getMinimumHeight()/drawable.getMinimumWidth();
		holder.rl_data.setLayoutParams(lp);
		if(holder.tv_lmgctrl!=null){
			holder.tv_lmgctrl. setVisibility(View.GONE);
			holder.rl_data. removeView(holder.tv_lmgctrl);
		}
		holder.rl_data.setBackground(drawable);
		holder.rl_data.setVisibility(View.VISIBLE);
	}
	else{
		LayoutParams lp=holder.rl_data.getLayoutParams();
		lp.height=itemwidth*data.height/data.width;
		holder.rl_data.setLayoutParams(lp);
				
		holder.rl_data.setTag(tagpre);
		Drawable pre=imgload.loadImage(viewparent,tagpre,data.preurl,ilcallback);
		holder.rl_data.setBackground(pre);
				
		if(holder.tv_lmgctrl!=null){
			holder.rl_data.removeView(holder.tv_lmgctrl);
		}
				
		RelativeLayout.LayoutParams lp1 = new RelativeLayout.LayoutParams(
		LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT);
		holder.tv_lmgctrl=new TextView(activity);
		holder.tv_lmgctrl.setText("点击查看全图");
		holder.tv_lmgctrl.setGravity(Gravity.CENTER_HORIZONTAL);
		holder.tv_lmgctrl.setTextColor(activity.getResources().getColor(R.color.white_dark));
		holder.tv_lmgctrl.setTextSize(TypedValue.COMPLEX_UNIT_PX,activity.getResources().getDimension(R.dimen.text_level1));
		holder.tv_lmgctrl.setBackgroundResource(R.color.black_normal_88);
		int padding=(int)activity.getResources().getDimension(R.dimen.padding_n);
		holder.tv_lmgctrl.setPadding(padding,padding,padding,padding);
		lp1.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
		holder.tv_lmgctrl.setLayoutParams(lp1);
		holder.tv_lmgctrl.setTag(tagctrllmg);

		holder.rl_data.addView(holder.tv_lmgctrl);
				
		OnClickListener listener=new OnClickListener() {

			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
				v.setOnClickListener(null);
				 ((TextView)v.findViewWithTag(tagctrllmg)).setText("全图加载中...");
				lmgload.loadImage(viewparent,tagpre,data.dataurl,llcallback);
				RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
				holder.pb_load=new ProgressBar(activity,null,android.R.attr.progressBarStyleSmall);
				lp.addRule(RelativeLayout.CENTER_IN_PARENT);
				holder.pb_load.setLayoutParams(lp);
				holder.pb_load.setTag(tagloadlmg);
				holder.rl_data.addView(holder.pb_load);
			}
		};
				
		holder.rl_data.setOnClickListener(listener);
		holder.rl_data.setVisibility(View.VISIBLE);
	}
}

        图片加载完成的回掉函数:
private LmageLoadCallback llcallback=new LmageLoadCallback() {
	@SuppressLint("NewApi")
	@Override
	public void onSuccess(Drawable drawable, int tag, View viewParent) {
		// TODO Auto-generated method stub
		if(drawable!=null){
			RelativeLayout rl_data=(RelativeLayout)(viewParent.findViewWithTag(tag));
			if(rl_data!=null){
				LayoutParams lp=rl_data.getLayoutParams();
				lp.height=itemwidth*drawable.getMinimumHeight()/drawable.getMinimumWidth();
				rl_data.setLayoutParams(lp);
				rl_data.setBackground(drawable);
				rl_data.findViewWithTag(tag+1).setVisibility(View.GONE);
				rl_data.findViewWithTag(tag-1).setVisibility(View.GONE);
			}
		}
	}
};

        长图加载的类与图片加载的类相同:
public class LmageLoad {

	private Context context;
	
	private Map<String, Drawable> imageMap;
	private ThreadPoolExecutor executor = null;
	BlockingQueue<Runnable> queue =null;
	 
	private String path=Environment.getExternalStorageDirectory()+"/Dp Notes/Cache/LonImage";
	private int threadMaxNum=Runtime.getRuntime().availableProcessors()>1?Runtime.getRuntime().availableProcessors():2;
	private int cacheMaxNum=1;
	
	
	@SuppressLint("NewApi")
	public LmageLoad(Context context){
		this.context=context;
		
		imageMap=new LinkedHashMap<String, Drawable>();
		queue =new ArrayBlockingQueue<Runnable>(this.threadMaxNum);
		executor=new ThreadPoolExecutor(this.threadMaxNum,this.threadMaxNum,1,TimeUnit.MINUTES,queue,new ThreadPoolExecutor.CallerRunsPolicy());
		
//		File dir=new File(this.path);
//		if(!dir.exists()){
//			dir.mkdirs();
//		}
	}
	
	public void setcacheMaxNum(int maxNum){
		this.cacheMaxNum=maxNum;
	}
	
	public Drawable loadImage(final View viewParent,final int viewTag,final String imageUrl,final LmageLoadCallback callback){
		
		if (imageMap.containsKey(imageUrl)) {
			Drawable drawable=imageMap.get(imageUrl);

			return drawable;
		}
		if(callback==null){
			return null;
		}
//		int index=imageUrl.lastIndexOf("/");
//		index=index>=0?index:0;
//		String filename=imageUrl.substring(index);
//		final String filepath=path+filename+".0";
//		
//		final File mf=new File(filepath);
//		if(mf.exists()){
//			Bitmap bitmap=BitmapFactory.decodeFile(filepath);
//			BitmapDrawable draw=new BitmapDrawable(context.getResources(),bitmap);
//			if(draw!=null){
//				imageMap.put(imageUrl,draw);
//				chackMapSize();
//				return draw;
//			}
//		}
		imageMap.put(imageUrl,null);
		
		final Handler handler = new Handler() {

			@SuppressLint("HandlerLeak")
			public void handleMessage(Message message) {
				if(callback!=null){
					if(message.what==1){
						callback.onSuccess((Drawable) message.obj,viewTag,viewParent);
					}
				}
			}
		};

		executor.execute(new Runnable() {
			
			@Override
			public void run() {
				// TODO Auto-generated method stub
				URL url = null;
				InputStream inputStream = null;
				try {
					url = new URL(imageUrl);
					inputStream = url.openStream();
					Drawable drawable = Drawable.createFromStream(inputStream, "src");
					
					Message message;
					message=handler.obtainMessage(1,drawable);
					handler.sendMessage(message);
					
					if(drawable!=null){
						imageMap.put(imageUrl,drawable);
					}
					else{
						imageMap.remove(imageUrl);
					}
					chackMapSize();
					
//					if(drawable!=errorDrawable){
//						try {
//							if(!mf.exists()){
//								try {
//									mf.createNewFile();
//								} catch (IOException e) {
//									// TODO Auto-generated catch block
//									e.printStackTrace();
//								}
//							}
//							FileOutputStream fout=new FileOutputStream(mf);
//							Bitmap bitmap=((BitmapDrawable)drawable).getBitmap();
//							bitmap.compress(Bitmap.CompressFormat.JPEG, 100, fout);
//						} catch (FileNotFoundException e) {
//							// TODO Auto-generated catch block
//							e.printStackTrace();
//						}
//					}
					
				} catch (Exception e) {
					e.printStackTrace();
				} finally {
					try {
						if (inputStream != null)
							inputStream.close();
					} catch (IOException e) {
						e.printStackTrace();
					}
				}
			}
		});
		
		return null;
	}
	
	private void chackMapSize(){

		if(imageMap.size()>cacheMaxNum){
			for(Entry<String, Drawable> m:imageMap.entrySet()){
				imageMap.remove(m.getKey());
				break;
			}
		}
		
	}

	public interface LmageLoadCallback {
		public void onSuccess(Drawable drawable,int tag,View viewParent);
	}
	
}

        容易理解,运行:

注:这是一个.gif动图,ctrl点击图片查看

        当GIF图片滑动出屏幕时,暂停,需要之前的QRecyclerListener了:

public ListAdapter(Activity activity,QListView listview){
	
	…
	listview.setQRecyclerListener(rclistener);
}

private QRecyclerListener rclistener=new QRecyclerListener() {
		
	@Override
	public void onMovedToScrapHeap(View view) {
		// TODO Auto-generated method stub
		Holder holder=(Holder)view.getTag();
		if(holder!=null&&holder.rl_data!=null){
			if(holder.tv_lmgctrl!=null){
				holder.rl_data.removeView(holder.tv_lmgctrl);
				holder.tv_lmgctrl=null;
			}
			if(holder.giv_data!=null){
				holder.rl_data.removeView(holder.giv_data);
				holder.giv_data=null;
			}
			if(holder.tv_gifctrl!=null){
				holder.rl_data.removeView(holder.tv_gifctrl);
				holder.tv_gifctrl=null;
			}
			if(holder.pb_load!=null){
				holder.rl_data.removeView(holder.pb_load);
				holder.pb_load=null;
			}
		}
	}
};

        在Item滑出屏幕的监听器中,将动态添加的GifImageView、按钮、进度条移除就可以了。

路在脚下——2017/06/10





  • 大小: 4.2 MB
分享到:
评论

相关推荐

    ajax图片框显示图片的加载进度Demo

    在网页开发中,图片加载是常见的操作,但用户体验往往因为图片加载时间过长而受到影响。"Ajax图片框显示图片的加载进度Demo" 提供了一种解决方案,它利用JavaScript(JS)、Ajax以及jQuery技术来实现图片在加载过程...

    6种显示网页正在加载中的代码

    在网页设计中,当用户点击链接或提交表单时,页面加载的过程可能会花费一些时间,尤其是在数据量大或者网络...同时,优化页面加载速度也是提高用户体验的重要一环,因为即使最漂亮的加载指示器也无法弥补长时间的等待。

    js实现页面加载完毕之前loading提示效果

    JavaScript是一种强大的客户端脚本语言,常用于...这种技术对于优化网页性能和用户体验至关重要,尤其是对于那些内容加载时间较长的网站。同时,也可以根据实际需求调整提示文本和样式,以更好地匹配网站的整体设计。

    C#语言实现页面加载条

    当用户访问一个网页时,如果加载时间较长,容易导致用户失去耐心而离开。因此,引入页面加载条不仅能够提升美观度,还能有效提高用户的耐心,减少因等待而产生的负面情绪。 #### 技术原理及实现方法 本篇将通过...

    jQuery模拟页面加载进度条

    2. 计算总加载资源的数量,可以是图片、脚本或其他需要加载的资源。 3. 使用`$.getScript()`或`$.ajax()`方法逐个加载资源,每次加载完成后更新进度条的宽度。 4. 利用`setTimeout()`或`setInterval()`函数来模拟...

    css3实现loading动画加载.rar

    例如,你可以用JS来判断页面何时加载完成,然后停止loading动画,或者根据用户行为动态显示和隐藏加载动画。 标签"JS特效-css样式"表明这个压缩包可能包含了使用JavaScript增强CSS3动画的示例。"jiaoben438"可能是...

    网页前端优化之滚动延时加载图片示例

    假设一个页面需要加载20张图片,如果一次性加载,将增加页面的总体大小,导致加载时间延长,用户可能需要等待较长时间才能看到完全的页面内容。相反,通过滚动延时加载,页面首次加载时仅加载足够填充浏览器视口的...

    jQuery.spin.js自定义页面加载Loading动画代码

    5. **与其他jQuery插件的集成**:由于jQuery.spin.js是基于jQuery构建的,因此它可以方便地与其他jQuery插件(如Ajax请求、轮播图等)结合使用,为这些组件提供加载提示。 总的来说,jQuery.spin.js提供了一种简单...

    简单的jQuery动态加载进度条特效

    本案例是一个简单的jQuery动态加载进度条特效,适用于图片加载或后台处理时间较长的情况。 首先,我们需要了解jQuery库。jQuery是一个轻量级的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互等常见...

    第六十八课:基于Ruby内存加载shellcode第一季.docx

    根据提供的文档信息,本文将详细解释“第六十八课:基于Ruby内存加载shellcode第一季”中的关键知识点。主要内容包括理解shellcode的概念、如何利用Ruby语言生成shellcode以及如何在内存中加载并执行shellcode。 ##...

    asp.net页面加载前进度条

    随着Web应用程序功能越来越复杂,页面加载时间可能会变长,这会降低用户的体验感。因此,在页面加载过程中展示进度条或加载提示可以有效地缓解用户等待时的焦虑情绪,提高用户体验。 #### 二、技术原理及实现思路 ...

    Delphi中DBGrid数据分行/拆行/多行显示

    - 使用虚拟模式:如果数据量大,可以考虑使用虚拟模式来提高性能,但这需要更复杂的代码来管理数据的加载和显示。 - 考虑使用Hint:对于长文本,可以只显示部分信息,其余作为Hint显示,鼠标悬停时显示完整内容。 ...

    飞控电子显示屏编辑软件 v4.3.3.zip

    1、 支持显示屏参数软件的初始化设置、加载; 2、 支持多区域画面编辑与显示; 3、 支持中英文时钟编辑与显示; 4、 支持游走字幕编辑与显示; 5、 支持正负温度、湿度等传感器信息编辑与显示; 6、 支持软件...

    jquery实现多余文字显示或隐藏

    通过以上技术,我们可以实现当文本过长时,仅显示部分内容并添加省略号,用户可以通过鼠标悬停或点击来查看完整的文本。这既保持了页面的整洁,又提供了查看全部信息的途径,提高了用户体验。在实际应用中,可以根据...

    1:20万和1:5万接图表,ArcGIS矢量文件

    1. 数据加载:将1:5万和1:20万的接图表矢量文件导入ArcGIS,作为地图的底图层。 2. 接合线处理:通过编辑接图表的矢量数据,调整接合线的位置,确保在比例尺切换时的平滑过渡。 3. 分层显示:根据需要,设置不同比例...

    loading动画加载进度条效果.zip

    在网页设计中,加载动画和进度条效果是用户体验的重要组成部分,尤其在用户等待网页内容完全加载时,一个吸引人的加载动画或进度条可以提供视觉反馈,让用户感知到系统的运行状态,减少用户的焦虑感。本资源...

    CSS3实现的跳跃式loading加载动画特效源码.zip

    首先,"跳跃式loading加载动画"是指在页面内容加载过程中显示的一种动态效果,它通常以某种形式的图形或进度条不断变化,展示数据加载的进度,增加用户体验的趣味性和互动性。在CSS3中,我们可以利用其丰富的动画...

    HTML5等待加载动画效果

    20% { transform: scaleY(1); } } ``` 在这段代码中,`.loading &gt; p i` 类定义了单个进度条的样式和动画,通过不同的`animation-delay`设置,实现了进度条的依次显示。 ### JavaScript代码 文中还提供了一个简单...

    div+CSS3实现的30个鼠标经过悬停图片动画显示特效源码.zip

    23. **渐进加载动画**:在图片加载过程中显示进度条或动态效果,提升用户体验。 24. **响应式动画**:利用媒体查询(Media Queries),使动画效果根据屏幕尺寸自动调整。 25. **时间函数(Timing Functions)**:...

Global site tag (gtag.js) - Google Analytics