最近做项目遇到的问题是加载listview里面的item,但是item本身的样式各不相同,如下图:
图中item的图片数量不一样,要想解决这个问题,我们首先想到的是adapter里面给我们提供了获取当前item种类的方法,所以adapter的代码如下:
public class ItemAdapter extends BaseAdapter{
private ArrayList<DataModel> datas;
private Context context;
private final int TYPE_ZERO_IMG = 0;
private final int TYPE_ONE_IMG = 1;
private final int TYPE_TWO_IMG = 2;
private final int TYPE_THREE_IMG = 3;
private final int TYPE_FOUR_IMG = 4;
public ItemAdapter(ArrayList<DataModel> datas, Context context) {
super();
this.datas = datas;
this.context = context;
}
@Override
public int getCount() {
return datas.size();
}
@Override
public Object getItem(int i) {
return datas.get(i);
}
@Override
public long getItemId(int i) {
return i;
}
@Override
public int getItemViewType(int position) {
int type=super.getItemViewType(position);
DataModel item = datas.get(position);
if(null != item){
int sizes = item.getImgs().size();
if(sizes == 0){
type = TYPE_ZERO_IMG;
}else if(sizes == 1){
type = TYPE_ONE_IMG;
}else if(sizes == 2){
type = TYPE_TWO_IMG;
}else if(sizes == 3){
type = TYPE_THREE_IMG;
}else if(sizes == 4){
type = TYPE_FOUR_IMG;
}
}
return type;
}
@Override
public int getViewTypeCount() {
return 5;
}
@Override
public View getView(int i, View convertView, ViewGroup parent) {
ViewHolder holder = null;
ViewHolderOne holderOne = null;
ViewHolderTwo holderTwo = null;
ViewHolderThree holderThree = null;
ViewHolderFour holderFour = null;
int type = getItemViewType(i);
if(null == convertView){
switch (type) {
case TYPE_ZERO_IMG:
holder = new ViewHolder();
convertView = LayoutInflater.from(context).inflate(R.layout.listview_item, null);
holder.title = (TextView)convertView.findViewById(R.id.tv_title);
holder.content = (TextView)convertView.findViewById(R.id.tv_content);
convertView.setTag(holder);
break;
case TYPE_ONE_IMG:
holderOne = new ViewHolderOne();
convertView = LayoutInflater.from(context).inflate(R.layout.listview_item_one, null);
holderOne.title = (TextView)convertView.findViewById(R.id.tv_title);
holderOne.content = (TextView)convertView.findViewById(R.id.tv_content);
holderOne.iv_one = (ImageView)convertView.findViewById(R.id.iv_one);
convertView.setTag(holderOne);
break;
case TYPE_TWO_IMG:
holderTwo = new ViewHolderTwo();
convertView = LayoutInflater.from(context).inflate(R.layout.listview_item_two, null);
holderTwo.title = (TextView)convertView.findViewById(R.id.tv_title);
holderTwo.content = (TextView)convertView.findViewById(R.id.tv_content);
holderTwo.iv_one = (ImageView)convertView.findViewById(R.id.iv_one);
holderTwo.iv_two = (ImageView)convertView.findViewById(R.id.iv_two);
convertView.setTag(holderTwo);
break;
case TYPE_THREE_IMG:
holderThree = new ViewHolderThree();
convertView = LayoutInflater.from(context).inflate(R.layout.listview_item_three, null);
holderThree.title = (TextView)convertView.findViewById(R.id.tv_title);
holderThree.content = (TextView)convertView.findViewById(R.id.tv_content);
holderThree.iv_one = (ImageView)convertView.findViewById(R.id.iv_one);
holderThree.iv_two = (ImageView)convertView.findViewById(R.id.iv_two);
holderThree.iv_three = (ImageView)convertView.findViewById(R.id.iv_three);
convertView.setTag(holderThree);
break;
case TYPE_FOUR_IMG:
holderFour = new ViewHolderFour();
convertView = LayoutInflater.from(context).inflate(R.layout.listview_item_four, null);
holderFour.title = (TextView)convertView.findViewById(R.id.tv_title);
holderFour.content = (TextView)convertView.findViewById(R.id.tv_content);
holderFour.iv_one = (ImageView)convertView.findViewById(R.id.iv_one);
holderFour.iv_two = (ImageView)convertView.findViewById(R.id.iv_two);
holderFour.iv_three = (ImageView)convertView.findViewById(R.id.iv_three);
holderFour.iv_four = (ImageView)convertView.findViewById(R.id.iv_four);
convertView.setTag(holderFour);
break;
default:
break;
}
}else{
switch (type) {
case TYPE_ZERO_IMG:
holder = (ViewHolder)convertView.getTag();
break;
case TYPE_ONE_IMG:
holderOne = (ViewHolderOne)convertView.getTag();
break;
case TYPE_TWO_IMG:
holderTwo = (ViewHolderTwo)convertView.getTag();
break;
case TYPE_THREE_IMG:
holderThree = (ViewHolderThree)convertView.getTag();
break;
case TYPE_FOUR_IMG:
holderFour = (ViewHolderFour)convertView.getTag();
break;
default:
break;
}
}
DataModel model = datas.get(i);
switch (type) {
case TYPE_ZERO_IMG:
holder.title.setText(model.getTitle());
holder.content.setText(model.getContent());
break;
case TYPE_ONE_IMG:
holderOne.title.setText(model.getTitle());
holderOne.content.setText(model.getContent());
holderOne.iv_one.setImageResource(model.getImgs().get(0));
break;
case TYPE_TWO_IMG:
holderTwo.title.setText(model.getTitle());
holderTwo.content.setText(model.getContent());
holderTwo.iv_one.setImageResource(model.getImgs().get(0));
holderTwo.iv_two.setImageResource(model.getImgs().get(1));
break;
case TYPE_THREE_IMG:
holderThree.title.setText(model.getTitle());
holderThree.content.setText(model.getContent());
holderThree.iv_one.setImageResource(model.getImgs().get(0));
holderThree.iv_two.setImageResource(model.getImgs().get(1));
holderThree.iv_three.setImageResource(model.getImgs().get(2));
break;
case TYPE_FOUR_IMG:
holderFour.title.setText(model.getTitle());
holderFour.content.setText(model.getContent());
holderFour.iv_one.setImageResource(model.getImgs().get(0));
holderFour.iv_two.setImageResource(model.getImgs().get(1));
holderFour.iv_three.setImageResource(model.getImgs().get(2));
holderFour.iv_four.setImageResource(model.getImgs().get(3));
break;
default:
break;
}
return convertView;
}
class ViewHolder{
private TextView title;
private TextView content;
}
class ViewHolderOne{
private TextView title;
private TextView content;
private ImageView iv_one;
}
class ViewHolderTwo{
private TextView title;
private TextView content;
private ImageView iv_one, iv_two;
}
class ViewHolderThree{
private TextView title;
private TextView content;
private ImageView iv_one, iv_two, iv_three;
}
class ViewHolderFour{
private TextView title;
private TextView content;
private ImageView iv_one, iv_two, iv_three, iv_four;
}
}
很显然,这种方式不是最简洁的一种,当类型很多的时候,代码量会很大。
所以想到了第二种方法,就是动态添加图片,判断当前的图片数量,然后在adapter里动态添加图片进去。具体实现如下:
public class ItemAdapter extends BaseAdapter{
private ArrayList<DataModel> datas;
private Context context;
public ItemAdapter(ArrayList<DataModel> datas, Context context) {
super();
this.datas = datas;
this.context = context;
}
@Override
public int getCount() {
return datas.size();
}
@Override
public Object getItem(int i) {
return datas.get(i);
}
@Override
public long getItemId(int i) {
return i;
}
@Override
public View getView(int i, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if(null == convertView){
holder = new ViewHolder();
convertView = LayoutInflater.from(context).inflate(R.layout.listview_item_four, null);
holder.title = (TextView)convertView.findViewById(R.id.tv_title);
holder.content = (TextView)convertView.findViewById(R.id.tv_content);
holder.ll_onecontainer = (LinearLayout)convertView.findViewById(R.id.ll_onecontainer);
holder.ll_twocontainer = (LinearLayout)convertView.findViewById(R.id.ll_twocontainer);
convertView.setTag(holder);
}else{
holder = (ViewHolder)convertView.getTag();
}
DataModel model = datas.get(i);
holder.title.setText(model.getTitle());
holder.content.setText(model.getContent());
/*动态添加imgeview*/
ArrayList<ImageModel> oneList = new ArrayList<ImageModel>();
ArrayList<ImageModel> twoList = new ArrayList<ImageModel>();
int imgSize = model.getImgs().size();
if(imgSize == 1 || imgSize == 2){
for(int j=0; j<imgSize; j++){
oneList.add(new ImageModel(model.getImgs().get(j)));
}
}else if(imgSize == 3){
for(int j=0; j<1; j++){
oneList.add(new ImageModel(model.getImgs().get(j)));
}
for(int j=1; j<imgSize; j++){
twoList.add(new ImageModel(model.getImgs().get(j)));
}
}else if(imgSize == 4){
for(int j=0; j<2; j++){
oneList.add(new ImageModel(model.getImgs().get(j)));
}
for(int j=2; j<imgSize; j++){
twoList.add(new ImageModel(model.getImgs().get(j)));
}
}
holder.ll_onecontainer.addView(setData(oneList));
holder.ll_twocontainer.addView(setData(twoList));
return convertView;
}
/*向容器里添加控件*/
private LinearLayout setData(ArrayList<ImageModel> imgs){
ImageViewItem item;
LinearLayout containers = (LinearLayout)LayoutInflater.from(context).inflate(R.layout.linearlayout_container, null);
if(null != containers){
containers.removeAllViews();
}
for(int j=0; j<imgs.size(); j++){
item = new ImageViewItem(context, imgs.get(j));
item.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
item.setGravity(Gravity.CENTER_HORIZONTAL);
containers.addView(item);
}
return containers;
}
class ViewHolder{
private TextView title;
private TextView content;
private LinearLayout ll_onecontainer, ll_twocontainer;
}
这种方法比上一种简洁多了,但是当数据很多的时候,这种布局会让页面很卡,所以我们可以考虑第三种方法就是自定义View,把盛放图片的容器当成一个View,然后把图片画到这个容器里面。代码如下图:
public class ItemViewAdapter extends BaseAdapter{
private ArrayList<DataModel> datas;
private Context context;
public ItemViewAdapter(ArrayList<DataModel> datas, Context context) {
super();
this.datas = datas;
this.context = context;
}
@Override
public int getCount() {
return datas.size();
}
@Override
public Object getItem(int i) {
return datas.get(i);
}
@Override
public long getItemId(int i) {
return i;
}
@Override
public View getView(int i, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if(null == convertView){
holder = new ViewHolder();
convertView = LayoutInflater.from(context).inflate(R.layout.listview_viewitem, null);
holder.title = (TextView)convertView.findViewById(R.id.tv_title);
holder.content = (TextView)convertView.findViewById(R.id.tv_content);
holder.myView = (MyView)convertView.findViewById(R.id.img_container);
convertView.setTag(holder);
}else{
holder = (ViewHolder)convertView.getTag();
}
DataModel model = datas.get(i);
holder.title.setText(model.getTitle());
holder.content.setText(model.getContent());
holder.myView.setImageResourcess(model.getImgs());
return convertView;
}
class ViewHolder{
private TextView title;
private TextView content;
private MyView myView;
}
自定义的view:
public class MyView extends View{
private ArrayList<Integer> imgs;
private final int IMAGE_SIZE = 70;
private final int IMAGE_PADDING = 10;
public MyView(Context context ) {
super(context);
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public void setImageResourcess(ArrayList<Integer> list){
imgs = list;
}
@SuppressWarnings("deprecation")
@SuppressLint("DrawAllocation")
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Resources res = getResources();
canvas.drawColor(Color.WHITE);
int sizes = imgs.size();
if(sizes == 1){//1张图片
canvas.save();
InputStream is = res.openRawResource(imgs.get(0));
BitmapDrawable bitDraw = new BitmapDrawable(is);
Bitmap bitmaps = bitDraw.getBitmap();
Bitmap bitmapsscale = Bitmap.createScaledBitmap(bitmaps, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapsscale, (IMAGE_SIZE+IMAGE_PADDING*3)/2, (IMAGE_SIZE+IMAGE_PADDING*3)/2, null);
canvas.restore();
}
if(sizes == 2){//2张图片
canvas.save();
InputStream is = res.openRawResource(imgs.get(0));
BitmapDrawable bitDraw = new BitmapDrawable(is);
Bitmap bitmaps = bitDraw.getBitmap();
Bitmap bitmapsscale = Bitmap.createScaledBitmap(bitmaps, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapsscale, IMAGE_PADDING, (IMAGE_SIZE+IMAGE_PADDING*3)/2, null);
canvas.restore();
canvas.save();
is = res.openRawResource(imgs.get(1));
bitDraw = new BitmapDrawable(is);
Bitmap bitmap = bitDraw.getBitmap();
Bitmap bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, IMAGE_SIZE+IMAGE_PADDING*2, (IMAGE_SIZE+IMAGE_PADDING*3)/2, null);
canvas.restore();
}
if(sizes == 3){//3张图片
canvas.save();
InputStream is = res.openRawResource(imgs.get(0));
BitmapDrawable bitDraw = new BitmapDrawable(is);
Bitmap bitmap = bitDraw.getBitmap();
Bitmap bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, (IMAGE_SIZE+IMAGE_PADDING*3)/2, IMAGE_PADDING, null);
canvas.restore();
canvas.save();
is = res.openRawResource(imgs.get(1));
bitDraw = new BitmapDrawable(is);
bitmap = bitDraw.getBitmap();
bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, IMAGE_PADDING, IMAGE_SIZE+IMAGE_PADDING*2, null);
canvas.restore();
canvas.save();
is = res.openRawResource(imgs.get(2));
bitDraw = new BitmapDrawable(is);
bitmap = bitDraw.getBitmap();
bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, IMAGE_SIZE+IMAGE_PADDING*2, IMAGE_SIZE+IMAGE_PADDING*2, null);
canvas.restore();
}
if(sizes >= 4){//4张图片
canvas.save();
InputStream is = res.openRawResource(imgs.get(0));
BitmapDrawable bitDraw = new BitmapDrawable(is);
Bitmap bitmap = bitDraw.getBitmap();
Bitmap bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, IMAGE_PADDING, IMAGE_PADDING, null);
canvas.restore();
canvas.save();
is = res.openRawResource(imgs.get(1));
bitDraw = new BitmapDrawable(is);
bitmap = bitDraw.getBitmap();
bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, IMAGE_SIZE+IMAGE_PADDING*2, IMAGE_PADDING, null);
canvas.restore();
canvas.save();
is = res.openRawResource(imgs.get(2));
bitDraw = new BitmapDrawable(is);
bitmap = bitDraw.getBitmap();
bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, IMAGE_PADDING, IMAGE_SIZE+IMAGE_PADDING*2, null);
canvas.restore();
canvas.save();
is = res.openRawResource(imgs.get(3));
bitDraw = new BitmapDrawable(is);
bitmap = bitDraw.getBitmap();
bitmapscale = Bitmap.createScaledBitmap(bitmap, IMAGE_SIZE, IMAGE_SIZE, true);
canvas.drawBitmap(bitmapscale, IMAGE_SIZE+IMAGE_PADDING*2, IMAGE_SIZE+IMAGE_PADDING*2, null);
canvas.restore();
}
}
}
XML布局的时候,直接include这个view即可:
<com.listviewdemo.MyView
android:id="@+id/img_container"
android:layout_width="0dp"
android:layout_weight="2"
android:layout_height="match_parent"
android:layout_gravity="center"/>
这样,就可以根据需要加载不同张图片,而且加载的效率也很高。