續前文
新聞子欄目,上面的這個佈局,需要一個viewpager,但是由於一些首位頁滑動bug問題,這裏給他寫成一個類來實現,前面已經有兩個類似情況了,同時由於要傳遞參數,要重寫一個傳遞屬性的構造函數,關於bug,有一篇詳述
listview上下拖動,這裏需要帶動上面的viewpager,本來可以放到scrollview裏面,但是由於上面還有一個下拉菜單,所以需要把viewpager抽出來,當做listview的第一項。
上面的佈局包括一個viewpager,一個textview和一個indicator,把他當做header,使用addheader添加
public class TopNewsViewPager extends ViewPager{
public TopNewsViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
public TopNewsViewPager(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
}
然後tabDetailPager的佈局當成了一整個list,前面也提到了,listview有一個屬性 cachecolorhint,點擊時背景色的設置,默認是黑色
<?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="match_parent"
android:orientation="vertical" >
<ListView
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:cacheColorHint="#FFF"
android:id="@+id/lv_tab_detail_news"/>
</LinearLayout>
他實際上是兩部分了
組合佈局裏的點引用了indicator裏的控件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="200dp">
<com.example.mynewsapp.view.TopNewsViewPager
android:id="@+id/vp_tab_detail_topnews"
android:layout_width="match_parent"
android:layout_height="200dp">
</com.example.mynewsapp.view.TopNewsViewPager>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#a000"
android:layout_alignParentBottom="true"
android:padding="5dp">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/tv_tabdetial_topnewstitle"
android:textColor="#FFF"/>
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/topnews_indicator"
android:padding="10dip"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentRight="true"/>
</RelativeLayout>
</RelativeLayout>
另一個是下面的list
<pre name="code" class="html"><?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp">
<ImageView
android:id="@+id/iv_pic"
android:layout_width="110dp"
android:layout_height="70dp"
android:scaleType="fitXY"
android:padding="1dp"
android:background="@android:color/darker_gray"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="@drawable/image_demo" />
<TextView
android:id="@+id/tv_newsitme_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:textColor="#000"
android:maxLines="2"
android:ellipsize="end"
android:textSize="20sp" />
<TextView
android:id="@+id/tv_newsitme_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@id/tv_newsitme_title"
android:text="2015-03-16 16:20"
android:layout_alignBottom="@id/iv_pic"
android:textColor="@android:color/darker_gray"
android:textSize="16sp" />
</RelativeLayout>
回到tab裏來,這裏的解析同樣需要一個bean來規定格式
public class TabData {
public int retcode;
public TabDetail data;
public class TabDetail {
public String title;
public String more;
public ArrayList<TabNewsData> news;
public ArrayList<TopNewsData> topnews;
@Override
public String toString() {
return "TabDetail [title=" + title + ", news=" + news
+ ", topnews=" + topnews + "]";
}
}
public class TabNewsData {
public String id;
public String listimage;
public String pubdate;
public String title;
public String type;
public String url;
@Override
public String toString() {
return "TabNewsData [title=" + title + "]";
}
}
public class TopNewsData {
public String id;
public String topimage;
public String pubdate;
public String title;
public String type;
public String url;
@Override
public String toString() {
return "TopNewsData [title=" + title + "]";
}
}
@Override
public String toString() {
return "TabData [data=" + data + "]";
}
}
public class TabDetailPager extends BaseMenuDetailPager {
private String mUrl;
private NewsTabData newtabdata;
private ViewPager vp_tab_detail_topnews; //上面的頭條新聞(使用大圖來顯示)
private ListView lv_tab_detail_news; //新聞列表
private TabData mTabDetailData; //這個頁籤的詳細數據(包含該分類的全部新聞)
public ArrayList<TopNewsData> mTopNewsList;
private TextView tv_tabdetial_topnewstitle; //放topnews新聞標題的控件
private CirclePageIndicator topnews_indicator;
private ArrayList<TabNewsData> listnewsData;
public TabDetailPager(Activity activity) {
super(activity);
// TODO Auto-generated constructor stub
}
public TabDetailPager(Activity mActivity, NewsTabData newsTabData) {
// TODO Auto-generated constructor stub
super(mActivity);
newtabdata = newsTabData;
mUrl = GlobalContants.SERVER_URL+ newsTabData.url;
System.out.println("TabDetailPager.TabDetailPager()"+mUrl);
}
@Override
public View initViews() {
View v= View.inflate(mActivity, R.layout.tab_detail_pager, null);
View head = View.inflate(mActivity, R.layout.list_news_head, null);
vp_tab_detail_topnews = (ViewPager) head.findViewById(R.id.vp_tab_detail_topnews);
tv_tabdetial_topnewstitle = (TextView) head.findViewById(R.id.tv_tabdetial_topnewstitle);
topnews_indicator = (CirclePageIndicator) head.findViewById(R.id.topnews_indicator);
lv_tab_detail_news = (ListView) v.findViewById(R.id.lv_tab_detail_news);
lv_tab_detail_news.addHeaderView(head);
return v;
}
@Override
public void initData() {
// TODO Auto-generated method stub
super.initData();
//text.setText(newtabdata.title); //應該放在這裏
getDataFromServer();
}
private void getDataFromServer() {
// TODO Auto-generated method stub
HttpUtils utils = new HttpUtils();
utils.send(HttpMethod.GET, mUrl, new RequestCallBack<String>() {
@Override
public void onSuccess(ResponseInfo<String> responseInfo) {
String result = (String) responseInfo.result;
System.out.println("獲取到的json數據" + result);
parseData(result, false);
}
@Override
public void onFailure(HttpException error, String msg) {
Toast.makeText(mActivity, msg, Toast.LENGTH_SHORT).show();
error.printStackTrace();
}
});
}
private void parseData(String result, boolean b) {
// TODO Auto-generated method stub
Gson gson = new Gson();
mTabDetailData = gson.fromJson(result, TabData.class);
System.out.println(" 解析到的數據爲:" + mTabDetailData);
mTopNewsList = mTabDetailData.data.topnews;
vp_tab_detail_topnews.setAdapter(new TopNewsAdapter());
vp_tab_detail_topnews.setOnPageChangeListener(new MyOnPageChangeListener());
topnews_indicator.setViewPager(vp_tab_detail_topnews);
topnews_indicator.setOnPageChangeListener(new MyOnPageChangeListener());
topnews_indicator.setSnap(true);
//拿到數據之後,現將第一個topnews的title設置到控件上。即默認顯示第一條topnews
String tilte0 = mTopNewsList.get(0).title;
tv_tabdetial_topnewstitle.setText(tilte0);
//下面的listview也要設置adapter去填充數據
listnewsData =mTabDetailData.data.news;
MyListViewAdapter listViewAdapter = new MyListViewAdapter();
lv_tab_detail_news.setAdapter(listViewAdapter);
}
/**
* topnews的填充adapter
*/
class TopNewsAdapter extends PagerAdapter {
private BitmapUtils utils;
public TopNewsAdapter() {
utils = new BitmapUtils(mActivity);
utils.configDefaultLoadingImage(R.drawable.topnews_item_default);
}
@Override
public int getCount() {
System.out.println("TabDetailPager.TopNewsAdapter.getCount()"+mTabDetailData.data.topnews.size());
return mTabDetailData.data.topnews.size();
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView image = new ImageView(mActivity);
image.setScaleType(ScaleType.FIT_XY);// 設置圖片填充 撐滿
TopNewsData topNewsData = mTopNewsList.get(position);
utils.display(image, topNewsData.topimage);// 直接去下載,然後將下載的圖片放到該view中
container.addView(image);
//image.setOnTouchListener(new TopNewsTouchListener());//
return image;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
class MyOnPageChangeListener implements OnPageChangeListener{
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
@Override
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
System.out
.println("TabDetailPager.MyOnPageChangeListener.onPageSelected()");
String tilte = mTopNewsList.get(arg0).title;
tv_tabdetial_topnewstitle.setText(tilte);
}
}
class MyListViewAdapter extends BaseAdapter{
private BitmapUtils bitmapUtils;
public MyListViewAdapter() {
bitmapUtils = new BitmapUtils(mActivity);
bitmapUtils.configDefaultLoadFailedImage(R.drawable.pic_item_list_default);
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return listnewsData.size();
}
@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return null;
}
@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
View item_view =null;
Holder holder = new Holder();
if (convertView==null) {
item_view = View .inflate(mActivity, R.layout.list_news_item, null);
holder.iv_newpic = (ImageView) item_view.findViewById(R.id.iv_pic);
holder.tv_newsitme_title = (TextView) item_view.findViewById(R.id.tv_newsitme_title);
holder.tv_newsitme_date = (TextView) item_view.findViewById(R.id.tv_newsitme_date);
item_view.setTag(holder);
}else {
item_view=convertView;
holder = (Holder) item_view.getTag();
}
holder.tv_newsitme_title.setText(listnewsData.get(position).title);
holder.tv_newsitme_date.setText(listnewsData.get(position).pubdate);
bitmapUtils.display(holder.iv_newpic, listnewsData.get(position).listimage);
return item_view;
}
}
class Holder{
ImageView iv_newpic ;
TextView tv_newsitme_title ;
TextView tv_newsitme_date;
}