Android新浪微部落格戶端（六）——Home介面的ListView

標籤：新浪   非同步   微博   

原文出自：方傑|http://fangjie.sinaapp.com/?p=184 轉載請註明出處

最終效果示範：http://fangjie.sinaapp.com/?page_id=54
該項目代碼已經放到github：https://github.com/JayFang1993/SinaWeibo

一.首先是ListView的adapter。

因為微博列表的Item不是規則的，比如說有些微博有轉寄子微博，有些沒有，有些有圖片，有些沒有圖片，所以說很不固定。這裡就採用BaseAdapter，要自己為微博Item設計一個WeiboAdapter.java

package com.fangjie.weibo.ui;import java.util.Date;import java.util.List;import com.fangjie.weibo.R;import com.fangjie.weibo.bean.Weibo;import android.content.Context;import android.graphics.Bitmap;import android.support.v4.util.LruCache;import android.text.Html;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;public class WeiboAdapter extends BaseAdapter {private Context context;private List<Weibo> weibos;public WeiboAdapter(Context context,List<Weibo> weibos) {        System.out.println(weibos.get(1).content);this.context=context;this.weibos=weibos;}public int getCount() {return weibos.size();}public Object getItem(int position) {return null;}public long getItemId(int position) {return 0;}public View getView(int position, View convertView, ViewGroup parent) { //position代表位置          //通過View關聯自訂Item布局，進行填充   if(convertView == null)         { convertView = View.inflate(context, R.layout.wb_item, null);           }        System.out.println(position);        final Weibo weibo =weibos.get(position);        //擷取要顯示的組件,注意findViewById的調用對象是上面填充了Item的布局的對象View          TextView tv_name = (TextView)convertView.findViewById(R.id.txt_wb_item_uname);          TextView tv_content = (TextView)convertView.findViewById(R.id.txt_wb_item_content);          TextView tv_time =(TextView)convertView.findViewById(R.id.txt_wb_item_time);          TextView tv_from =(TextView)convertView.findViewById(R.id.txt_wb_item_from);          TextView tv_comment =(TextView)convertView.findViewById(R.id.txt_wb_item_comment);          TextView tv_repost =(TextView)convertView.findViewById(R.id.txt_wb_item_redirect);          LinearLayout zlayout=(LinearLayout)convertView.findViewById(R.id.lyt_wb_item_sublayout);        TextView tv_zcontent=(TextView)convertView.findViewById(R.id.txt_wb_item_subcontent);         final ImageView iv_userhead=(ImageView)convertView.findViewById(R.id.img_wb_item_head);        ImageView iv_isv=(ImageView)convertView.findViewById(R.id.img_wb_item_V);        ImageView iv_content_pic=(ImageView)convertView.findViewById(R.id.img_wb_item_content_pic);        ImageView iv_zcontent_pic=(ImageView)convertView.findViewById(R.id.img_wb_item_content_subpic);        //組件新增內容        tv_content.setText(weibo.getContent());        tv_name.setText(weibo.getUser().getName());        tv_from.setText("來自:"+Html.fromHtml(weibo.getFrom()));        tv_repost.setText(weibo.getReposts_count()+"");        tv_comment.setText(weibo.getComments_count()+"");        tv_time.setText(dealTime(weibo.getTime()));        loadBitmap(weibo.getUser().getProfile_image_url(), iv_userhead,80,80);          if(!weibo.getBmiddle_pic().equals(""))        {            loadBitmap(weibo.getBmiddle_pic(), iv_content_pic,0,0);                iv_content_pic.setVisibility(View.VISIBLE);        }        else        {            iv_content_pic.setVisibility(View.GONE);                }        if(weibo.getUser().isIsv())        iv_isv.setVisibility(View.VISIBLE);        else        iv_isv.setVisibility(View.GONE);        if(weibo.getWeibo()!=null)        {        zlayout.setVisibility(View.VISIBLE);        tv_zcontent.setText("@"+weibo.getWeibo().getUser().getName()+":"+weibo.getWeibo().getContent());            if(!weibo.getWeibo().getBmiddle_pic().equals(""))            {                loadBitmap(weibo.getWeibo().getBmiddle_pic(), iv_zcontent_pic,0,0);                    iv_zcontent_pic.setVisibility(View.VISIBLE);            }        }        else        zlayout.setVisibility(View.GONE);        return convertView;  }public void addItem(Weibo weibo){weibos.add(weibo);}}

微博Item的布局檔案 wb_item.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:background="@drawable/list_item">  <ImageView      android:id="@+id/img_wb_item_head"  android:layout_width="48dp"  android:layout_height="48dp"  android:src="@drawable/user_head"  android:layout_marginLeft="3dp"  android:layout_marginTop="5dp"/>  <!-- 右邊架構 -->  <LinearLayout  android:layout_width="match_parent"  android:orientation="vertical"  android:layout_height="wrap_content"  android:layout_margin="5dp"> <!-- 使用者名稱稱、新浪認證部分 --> <LinearLayout  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:orientation="horizontal">  <!-- 使用者名稱稱 -->  <TextView android:id="@+id/txt_wb_item_uname"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:textColor="#424d54"  android:textSize="15dp"  />  <!-- 新浪認證 -->   <ImageView android:id="@+id/img_wb_item_V"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:visibility="gone"  android:src="@drawable/v"/>  <RelativeLayout    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:gravity="right">  <!-- 發布時間 --> <TextView android:id="@+id/txt_wb_item_time"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:text="1小時前"  android:textColor="#efa608"  android:textSize="12dp"  />  </RelativeLayout>   </LinearLayout>  <!-- 微博本文內容 --> <LinearLayout  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:orientation="vertical">   <!-- 微博本文內容 --> <TextView android:id="@+id/txt_wb_item_content"  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:text="微博本文內容微博本文內容微博本文內容微博本文內容微博本文內容微博本文內容微博本文內容"  android:textColor="#6b717b"  android:textSize="13dp"  />   <ImageView android:id="@+id/img_wb_item_content_pic"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:src="@drawable/user_head"  android:layout_marginTop="3dp"  android:visibility="gone" /> </LinearLayout>   <!-- 轉寄的子微博內容 --> <LinearLayout  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:id="@+id/lyt_wb_item_sublayout"  android:orientation="vertical"  android:layout_marginTop="3dp"  android:visibility="gone"  android:background="@drawable/popup">   <!-- 微博本文內容 --> <TextView android:id="@+id/txt_wb_item_subcontent"  android:layout_width="fill_parent"  android:layout_height="wrap_content"  android:text="微博本文內容微博本文內容微博本文內容微博本文內容微博本文內容微博本文內容微博本文內容"  android:textColor="#6b717b"  android:textSize="13dp"  />   <ImageView android:id="@+id/img_wb_item_content_subpic"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:src="@drawable/user_head"  android:layout_marginTop="3dp"  android:visibility="gone" />  </LinearLayout>   <!-- 微博來源部分 -->   <LinearLayout  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:orientation="horizontal"  android:layout_marginTop="3dp"  android:layout_marginBottom="3dp" >   <!-- 使用者名稱稱 -->  <TextView android:id="@+id/txt_wb_item_from"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:text="來自:Touch Android"  android:textColor="#9ba0aa"  android:textSize="12dp"  />  <LinearLayout  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:orientation="horizontal"  android:gravity="right">  <TextView android:id="@+id/txt_wb_item_redirect"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:drawableLeft="@drawable/redirect_icon"  android:text="10"  android:textColor="#9ba0aa"  android:textSize="13dp"  />  <TextView android:id="@+id/txt_wb_item_comment"  android:layout_width="wrap_content"  android:layout_height="wrap_content"  android:layout_marginLeft="5dp"  android:drawableLeft="@drawable/comment_icon"  android:text="100"  android:textColor="#9ba0aa"  android:textSize="13dp"/>     </LinearLayout>      </LinearLayout>  </LinearLayout></LinearLayout>

WeiboAdapter的作用就是將List<Weibo> weibos的資料繫結到每一個View的控制項上去。註：關於圖片ImagView控制項的載入loadBitmap採用的是非同步載入，在下一篇中會講到。

二.ListView的細節——底部載入更多

首先需要為這個東西寫一個布局檔案 load_more.xml，布局很簡單，就是一個button。

<?xml version="1.0" encoding="utf-8"?><LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"  android:orientation="vertical"  android:layout_width="fill_parent"  android:layout_height="wrap_content">  <Button   android:id="@+id/loadMoreButton"   android:layout_width="fill_parent"   android:layout_height="wrap_content"   android:text="載入更多"   android:onClick="loadMore"/></LinearLayout>

然後在HomeActivity.java中為ListView增加一個底部視圖，ListView.addFooterView(View view);

//設定列表底部視圖-載入更多View loadMoreView = getLayoutInflater().inflate(R.layout.load_more, null);  loadMoreButton= (Button) loadMoreView.findViewById(R.id.loadMoreButton);          weibolist.addFooterView(loadMoreView);

三.ListView的重新整理按鈕

在點擊主介面的重新整理按鈕時，會出現progressbar，這些都不是很難。首先寫好一個progress的布局，在重新整理任務開始之前然progressbar顯示，任務結束後就View.gone就OK啦，詳細請看原始碼HomeActivity.

四.注意：我在寫ListView的時候，在模擬器測試完全OK，但是在真機上調試時，ListView與上面的TitleBar和TabHost交界處會有陰影。加上這句就可以了。

ListView.setFadingEdgeLength(0);

可能講的不是很直觀，最後附上HomeActivity.java的全部代碼，這個就是Home介面的代碼

package com.fangjie.weibo.ui;import java.util.HashMap;import java.util.List;import java.util.Map;import com.fangjie.weibo.R;import com.fangjie.weibo.bean.Task;import com.fangjie.weibo.bean.Weibo;import com.fangjie.weibo.logic.MainService;import com.fangjie.weibo.util.SharePreferencesUtil;import android.app.Activity;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.widget.Button;import android.widget.LinearLayout;import android.widget.ListView;import android.widget.TextView;import android.widget.Toast;public class HomeActivity extends Activity implements IWeiboAcitivity {private ListView weibolist;private List<Weibo> weibos;private WeiboAdapter adapter;private TextView tv_title;private Button btn_refresh;private Button btn_update;private LinearLayout progress;private Button loadMoreButton;protected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.home);init();}public void init() {weibolist=(ListView)findViewById(R.id.lv_weibos);tv_title=(TextView)findViewById(R.id.txt_wb_title);btn_refresh=(Button)findViewById(R.id.btn_refresh);btn_update=(Button)findViewById(R.id.btn_writer);progress=(LinearLayout)findViewById(R.id.layout_progress);//設定列表底部視圖-載入更多View loadMoreView = getLayoutInflater().inflate(R.layout.load_more, null);  loadMoreButton= (Button) loadMoreView.findViewById(R.id.loadMoreButton);          weibolist.addFooterView(loadMoreView);           weibolist.setFadingEdgeLength(0);final String token=SharePreferencesUtil.getLoginUser(HomeActivity.this).getToken();tv_title.setText(SharePreferencesUtil.getLoginUser(HomeActivity.this).getUserName());Map<String,Object> params=new HashMap<String,Object>();params.put("token", token);Task task=new Task(Task.GET_WEIBOS, params);progress.setVisibility(View.VISIBLE);MainService.newTask(task);MainService.addActivty(HomeActivity.this);loadMoreButton.setOnClickListener(new OnClickListener() {public void onClick(View v) {Map<String,Object> params=new HashMap<String,Object>();params.put("token", token);params.put("max_id", weibos.get(weibos.size()-1).getWid());loadMoreButton.setText("正在載入，請稍候...");Task task=new Task(Task.LOADMORE, params);MainService.newTask(task);MainService.addActivty(HomeActivity.this);}});btn_refresh.setOnClickListener(new OnClickListener() {public void onClick(View v) {Map<String,Object> params=new HashMap<String,Object>();params.put("token", token);progress.setVisibility(View.VISIBLE);Task task=new Task(Task.GET_WEIBOS, params);MainService.newTask(task);MainService.addActivty(HomeActivity.this);}});btn_update.setOnClickListener(new OnClickListener() {public void onClick(View v) {Toast.makeText(HomeActivity.this, "親，程式猿還沒寫好呢...", Toast.LENGTH_LONG).show();}});}@SuppressWarnings("unchecked")public void refresh(int taskID, Object... objects) {switch (taskID){case Task.GET_WEIBOS:weibos=(List<Weibo>)objects[0];adapter=new WeiboAdapter(HomeActivity.this,weibos);weibolist.setAdapter(adapter);break;case Task.LOADMORE:weibos=(List<Weibo>)objects[0];for(int i=1;i<weibos.size();i++)adapter.addItem(weibos.get(i));adapter.notifyDataSetChanged(); //資料集變化後,通知adapter loadMoreButton.setText("載入更多");}progress.setVisibility(View.GONE);MainService.reMoveActivty(HomeActivity.this);}}

 

可能大家在HomeActivity中只看到新開一些任務，但是這些任務具體做什麼操縱不清楚，大家可以看看前面的博文，因為有一個 邏輯處理的MainService處理類。針對Task.GET_WEIBOS和Task.LOADMORE，其中的代碼又增加了。這裡也附上MainService.java關於這兩個任務的部分代碼。

//重新整理微博case Task.GET_WEIBOS:{String token=(String)task.getParams().get("token");WeiboUtil weiboutil=new WeiboUtil();List<Weibo> weibos=weiboutil.getWeiboList(token,0);msg.obj=weibos;break;}//載入更多case Task.LOADMORE:{String token=(String)task.getParams().get("token");long max_id=(Long) task.getParams().get("max_id");WeiboUtil weiboutil=new WeiboUtil();List<Weibo> weibos=weiboutil.getWeiboList(token,max_id);msg.obj=weibos;break;}

 歡迎各位關注我的個人網站：http://fangjie.sinaapp.com/