简易新闻app（下）之BitMapUtils及ListView的使用

简易新闻app（下）之BitMapUtils及ListView的使用

BitMapUtils是xutils用于imageView显示的一个常用工具类，这里用来展示新闻的图片。

ListView则用来展示服务器新闻列表。

代码示例

Handler handler = new Handler(){
public void handleMessage(android.os.Message msg) {
ListView lvList = (ListView) findViewById(R.id.lv_list);
lvList.setAdapter(new MyAdapter());
}
};

我们在接收到解析服务器线程解析完成后的消息后再做一个ListView的列表来显示新闻数据。

class MyAdapter extends BaseAdapter{
private BitmapUtils bitmapUtils;
public MyAdapter(){
bitmapUtils = new BitmapUtils(getApplicationContext());
}

@Override
public int getCount() {
return listNews.size();
}

@Override
public News getItem(int position) {
return listNews.get(position);
}

@Override
public long getItemId(int position) {
return position;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if(convertView == null){
convertView = View.inflate(getApplicationContext(), R.layout.item_news_list, null);

holder = new ViewHolder();
holder.tvTitle = (TextView) convertView.findViewById(R.id.tv_title);
holder.tvDetail = (TextView) convertView.findViewById(R.id.tv_detail);
holder.tvComment = (TextView) convertView.findViewById(R.id.tv_comment);
holder.ivImage = (ImageView) convertView.findViewById(R.id.iv_image);

convertView.setTag(holder);
}else{
holder = (ViewHolder) convertView.getTag();
}

News news = getItem(position);
holder.tvTitle.setText(news.getTitle());
holder.tvDetail.setText(news.getDetail());
holder.tvComment.setText(news.getComment());

bitmapUtils.display(holder.ivImage, news.getImageUrl());

return convertView;
}
}

static class ViewHolder{
public TextView tvTitle;
public TextView tvDetail;
public TextView tvComment;
public ImageView ivImage;
}

这是一个listView适配器的标准写法，我们在项目中会经常用到。

首先我们在这个adapter的构造方法里创建一个bitmaputils对象，用来显示服务器的图像数据。这是后面显示图像的代码

bitmapUtils.display(holder.ivImage, news.getImageUrl());

它显示一个imageView非常简单，我们先要传入一个imageview的显示位置：holder.ivImage

holder.ivImage = (ImageView) convertView.findViewById(R.id.iv_image);

显然，holder.ivImage就是我们在布局文件里的imageview，下面是这个布局文件的相关代码

<ImageView
android:id="@+id/iv_image"
android:layout_width="70dp"
android:layout_height="70dp"
android:src="@drawable/ic_launcher"
android:layout_centerVertical="true"
/>

我们传入的第二个参数就是从服务器获取的图片url路径：news.getImageUrl()。传入这两个参数后，就可以正常显示服务器的图片了。

下面就是listview的适配器写法了，这里所谓的adapter其实就是告诉系统：我们要显示在listview里面的item的一些具体信息，这些信息包括:

item的数量：即我们从服务器端获取的加载到集合listNews里news的个数

@Override
public int getCount() {
return listNews.size();
}

每个item应该返回一个什么样的数据：我们返回集合listNews里的news

@Override
public News getItem(int position) {
return listNews.get(position);
}

每个item对应的id，当出现一些非常规的item（如只是用来分割作用的，后面会介绍到），我们一般就返回一个position的调整值，从而能更加方便的get到相关的item

@Override
public long getItemId(int position) {
return position;
}

每个item具体怎么显示（重要）

    @Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if(convertView == null){
convertView = View.inflate(getApplicationContext(), R.layout.item_news_list, null);

holder = new ViewHolder();
holder.tvTitle = (TextView) convertView.findViewById(R.id.tv_title);
holder.tvDetail = (TextView) convertView.findViewById(R.id.tv_detail);
holder.tvComment = (TextView) convertView.findViewById(R.id.tv_comment);
holder.ivImage = (ImageView) convertView.findViewById(R.id.iv_image);

convertView.setTag(holder);
}else{
holder = (ViewHolder) convertView.getTag();
}

News news = getItem(position);
holder.tvTitle.setText(news.getTitle());
holder.tvDetail.setText(news.getDetail());
holder.tvComment.setText(news.getComment());

bitmapUtils.display(holder.ivImage, news.getImageUrl());
return convertView;
}
}

static class ViewHolder{
public TextView tvTitle;
public TextView tvDetail;
public TextView tvComment;
public ImageView ivImage;
}

convertView是我们填充的一个item布局（即我们先把想要显示的item用一个布局文件画出来）：R.layout.item_news_list

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
>

<ImageView
android:id="@+id/iv_pic"
android:layout_width="70dp"
android:layout_height="70dp"
android:scaleType="centerCrop"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="@drawable/image_demo"
/>

<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="20dp"
android:layout_toRightOf="@+id/iv_pic"
android:text="新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题"
android:maxLines="2"
android:ellipsize="end"
android:textColor="#000"
android:textSize="20sp"
/>

<TextView
android:id="@+id/tv_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@id/tv_title"
android:layout_alignBottom="@id/iv_pic"
android:layout_marginTop="10dp"
android:text="2011-10-18 10:38"
android:textSize="16sp"
android:textColor="@android:color/darker_gray"
/>
</RelativeLayout>

我们把convertView里的各个组件找到，然后放到一个静态类ViewHolder里去。这样做的好处就是我们只需要一次的findViewById，以后我们就直接拿ViewHolder里的数据来设置相关的内容了。