[安卓]新聞客戶端(五) 主頁面之slidingMenu & fragment(3)

續前文

新聞子欄目,上面的這個佈局,需要一個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;	 		
	}



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章