Android初级教程_图片混排成效和ViewPager的使用

前段时间公司需要实现图片混排的效果,类似"美丽说"那样,宽度一样,高度不一.总共有3列.每次加载更多的时候都是往最低的那列添加图片,这样就不会出现有的列非常多的图片,而有的列图片很少.首先申明的是这个例子是根据别人的程序基础上改的:https://github.com/dodola/android_waterfall再次感谢.!

效果如下图所示:

当滑倒底部的时候如果还有图片则自动加载下一页.

代码实现如下:

首先自定义布局:

public class MyLinearLayout extends LinearLayout {	private Map<Integer, Integer> map;	private ArrayList<LinearLayout> waterfall_items;	private Context context;	private Display display;	private int itemWidth;	public MyLinearLayout(Context context, AttributeSet attrs) {		super(context, attrs);	}	public MyLinearLayout(Context context) {		super(context);	}	/**	 * 初始化容器 	 * @param columnCount	 *            列数	 * @param paddingLeft	 * @param paddingTop	 * @param paddingRight	 * @param paddingBottom	 */	public void initLayout(int columnCount, int paddingLeft, int paddingTop,			int paddingRight, int paddingBottom) {				if (columnCount < 1)			columnCount = 3;				Constans.COLUMN_COUNT = columnCount;				waterfall_items = new ArrayList<LinearLayout>();		map = new HashMap<Integer, Integer>();		for (int i = 0; i < columnCount; i++) {			map.put(i, 0);		}		context = getContext();		WindowManager windowManager = (WindowManager) context				.getSystemService(Context.WINDOW_SERVICE);		display = windowManager.getDefaultDisplay();		itemWidth = display.getWidth() / columnCount;// 根据屏幕大小计算每列大小		for (int i = 0; i < columnCount; i++) {			LinearLayout itemLayout = new LinearLayout(context);			LinearLayout.LayoutParams itemParam = new LinearLayout.LayoutParams(					itemWidth, LayoutParams.WRAP_CONTENT);			itemLayout.setPadding(1, 2, 1, 2);			itemLayout.setOrientation(LinearLayout.VERTICAL);			itemLayout.setLayoutParams(itemParam);			waterfall_items.add(itemLayout);			this.addView(itemLayout);		}	}	/**	 * 贴图	 * @param article 文章实体	 * @param columnIndex 列索引	 */	private void addImage(final Article article, int columnIndex) {		ImageView item = (ImageView) LayoutInflater.from(context).inflate(				R.layout.waterfallitem, null);		waterfall_items.get(columnIndex).addView(item);		//int inSampleSize = 1;		int h = 0;		// int originalWidth = article.getWidth();		 int originalHieght = article.getHeight();		//		// int screenHeight = display.getHeight() / 7;		// int screenWidth = display.getWidth() / 7;		// float heightRatio = (float) Math.ceil(article.getHeight()		// / screenHeight);		// float widthRatio = (float) (Math.ceil(originalWidth / screenWidth));		// if (heightRatio >= 1 && widthRatio >= 1) {		// if (heightRatio > widthRatio) {		// inSampleSize = (int) heightRatio;		// } else {		// inSampleSize = (int) widthRatio;		// }		// h = originalHieght;// inSampleSize;		// } else {		// h = originalHieght;		// }		h = originalHieght;		int value = map.get(columnIndex);		map.put(columnIndex, value+h);				TaskParam param = new TaskParam();		param.setItemWidth(itemWidth);		Bitmap defaultImage = BitmapFactory.decodeResource(getResources(),				R.drawable.loading);		ImageLoaderTask task = new ImageLoaderTask(item, display,				article.getImage(), article, defaultImage, param);		task.execute(param);		item.setOnClickListener(new View.OnClickListener() {			@Override			public void onClick(View v) {				Intent intent = new Intent();				intent.setClassName(context.getPackageName(),						GirlDetailActivity.class.getName());				intent.putExtra("id", article.getId());				context.startActivity(intent);			}		});					}	/**	 * 把图片集合填充到容器里	 * @param articles	 */	public void setAdapter(List<Article> articles) {		for (int i = 0; i < articles.size(); i++) {			Article article = articles.get(i);			addImage(article, getLowestColumn());		}	}	public int getLowestColumn(){		List<Integer> list = new ArrayList<Integer>();		list.addAll(map.values());		Collections.sort(list);		int min = list.get(0);		Set<Map.Entry<Integer, Integer>> entrySet = map.entrySet();		for (Map.Entry<Integer, Integer> entry : entrySet) {			if(min==entry.getValue()){				return entry.getKey();			}		}		return 0;	}}

界面Activity:

Handler handler = new Handler() {		public void handleMessage(android.os.Message msg) {			waterfall_container.setAdapter(articles);//设置数据				if(countImage==currentCount){					System.out.println("已经到最后");					textView.setVisibility(View.VISIBLE);				}		}	};	@Override	public void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		setContentView(R.layout.main);			initLayout();	}	private void initLayout() {				textView = (TextView) findViewById(R.id.tv_tip);		waterfall_scroll = (LazyScrollView) findViewById(R.id.waterfall_scroll);		waterfall_scroll.getView();		waterfall_scroll.setOnScrollListener(new OnScrollListener() {			@Override			public void onTop() {				Log.d("LazyScroll", "Scroll to top");			}			@Override			public void onScroll() {				Log.d("LazyScroll", "Scroll");			}			@Override			public void onBottom() {				// 滚动到最底端				if(countImage!=currentCount) {					new Thread(new LoadMyArticle()).start();//加载下一页				}			}		});		waterfall_container = (MyLinearLayout) this				.findViewById(R.id.waterfall_container);		//初始化容器		waterfall_container.initLayout(3, 2, 2, 2, 2);				// 加载所有图片路径		new Thread(new LoadMyArticle()).start();	}	public final class LoadMyArticle implements Runnable {		@Override		public void run() {			try {				url_article_list.append("&page=").append(page++);				InputStream inputStream = GsonJsonParser						.getIputStream(url_article_list.toString());				ArticleJson articleJson = (ArticleJson) GsonJsonParser						.parseStreamToObject(inputStream, ArticleJson.class);				countImage = articleJson.getTotal();				articles = articleJson.getData();				currentCount += articles.size();				handler.sendEmptyMessage(1);			} catch (IOException e) {				e.printStackTrace();			}		}	}

当点击某一张图片的时候,进入图片详情.这里使用了VIewPager来实现的.效果如下:

实现如下:

private ViewPager viewPager;	private List<ImageView> imageViews = new ArrayList<ImageView>();	private List<Photo> photos;	private Map<Integer,SoftReference<Bitmap>> cache = new HashMap<Integer,SoftReference<Bitmap>>();	private ProgressBar pb;	private MyAsyncTask myAsyncTask;	int screenWidth ;	int screenHeight; 	Handler handler = new Handler(){		public void handleMessage(android.os.Message msg) {			switch (msg.what) {			case 1:				if(photos!=null&&photos.size()>0){					for (int i = 0; i < photos.size(); i++) {						ImageView imageView = new ImageView(GirlDetailActivity.this);						imageViews.add(imageView);					}					viewPager.setAdapter(new AwesomePagerAdapter());					myAsyncTask = new MyAsyncTask(0);					myAsyncTask.execute(photos.get(0).getImage());				}				break;			}		}	};	@Override	protected void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		requestWindowFeature(Window.FEATURE_NO_TITLE);		setContentView(R.layout.girls_detail);		Display display = getWindowManager().getDefaultDisplay();		display = getWindowManager().getDefaultDisplay();		screenWidth = display.getWidth();		screenHeight = display.getHeight();		init();		Intent intent = getIntent();		String id = intent.getStringExtra("id");		StringBuffer url = new StringBuffer(url);		url.append("?id=").append(id).append("&type=2");		new Thread(new LoadImagePath(url.toString())).start();	}	public void init(){				pb = (ProgressBar) findViewById(R.id.widget);				viewPager = (ViewPager) findViewById(R.id.awesomepager);				viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {			@Override			public void onPageSelected(final int position) {				String image_path = photos.get(position).getImage();				pb.setVisibility(View.GONE);				if(cache.containsKey(position)){					Bitmap bitmap = cache.get(position).get();					if(bitmap!=null){						imageViews.get(position).setImageBitmap(bitmap);					}else {						if(!myAsyncTask.isCancelled()){							System.out.println("任务被取消");							myAsyncTask.cancel(true);						}						myAsyncTask = new MyAsyncTask(position);						myAsyncTask.execute(image_path);					}				}else {					if(!myAsyncTask.isCancelled()){						System.out.println("任务被取消");						myAsyncTask.cancel(true);					}					myAsyncTask = new MyAsyncTask(position);					myAsyncTask.execute(image_path);				}			}						@Override			public void onPageScrolled(int position, float positionOffset,					int positionOffsetPixels) {							}						@Override			public void onPageScrollStateChanged(int arg0) {							}		});	}	public class AwesomePagerAdapter extends PagerAdapter {		@Override		public int getCount() {			return imageViews.size();		}		@Override		public Object instantiateItem(View collection, int position) {			ImageView imageView = imageViews.get(position);			((ViewPager) collection).addView(imageView, 0);			return imageViews.get(position);		}		@Override		public void destroyItem(View collection, int position, Object view) {			((ViewPager) collection).removeView(imageViews.get(position));		}		@Override		public boolean isViewFromObject(View view, Object object) {			// System.out.println("isViewFromObject");			return view == (object);		}		@Override		public void finishUpdate(View arg0) {			// System.out.println("finishUpdate");		}		@Override		public void restoreState(Parcelable arg0, ClassLoader arg1) {			// System.out.println("restoreState");		}		@Override		public Parcelable saveState() {			// System.out.println("saveState");			return null;		}		@Override		public void startUpdate(View arg0) {		}	}	@Override	public void onStop() {		super.onStop();	}	@Override	protected void onDestroy() {		super.onDestroy();	}		private final class LoadImagePath implements Runnable{		private String url;		public LoadImagePath(String url){			this.url = url;		}		@Override		public void run() {			try {				InputStream in = JsonParse.getIputStream(url);				PhotoDetailJson photoDetailJson = (PhotoDetailJson) GsonJsonParser.parseStreamToObject(in, PhotoDetailJson.class);				PhotoDetail detail = photoDetailJson.getData();				photos = detail.getPhoto();				handler.sendEmptyMessage(1);			} catch (IOException e) {				e.printStackTrace();			}		}	}		public final class MyAsyncTask extends AsyncTask<String, Void, Bitmap>{		private int position;		public MyAsyncTask(int position){			this.position = position;		}		@Override		protected Bitmap doInBackground(String... params) {			String path = params[0];			try {				InputStream in = JsonParse.getIputStream(path);				//如果屏幕超过800*480				if(screenWidth>480&&screenHeight>800){//960x540					screenWidth = 480;					screenHeight = 800;				}				 Bitmap bitmap = ImageUtil.getSizedBitmap(screenWidth, screenHeight, in);				 cache.put(position, new SoftReference<Bitmap>(bitmap));				 return bitmap;			} catch (IOException e) {				e.printStackTrace();			} catch (Exception e) {				e.printStackTrace();			}			return null;		}				@Override		protected void onPostExecute(Bitmap result) {			super.onPostExecute(result);			imageViews.get(position).setImageBitmap(result);			pb.setVisibility(View.GONE);		}				@Override		protected void onPreExecute() {			super.onPreExecute();			pb.setVisibility(View.VISIBLE);			imageViews.get(position).setImageResource(R.drawable.wait_girl_detail);		}			}

完毕!

欢迎转载,转载请注明出处:http://blog.csdn.net/johnny901114/article/details/7835139

谢谢大家.希望对你有帮助.有事请留言....