无网不进  
软硬件开发
客户端上显示csdn上的各类别下的的文章列表 （制作csdn app 三）

转载请标明出处：http://blog.csdn.net/lmj623565791/article/details/23597229

今天将在Android 使用Fragment，ViewPagerIndicator 制作csdn app主要框架和抓取csdn上的各类别的文章 （制作csdn app 二）这两篇的基础之上，继续完善我们的项目。

今天的目标效果：

好了，说下今天的主要任务：引入XlistView，然后对从网络上获取的数据进行显示，说起来还是挺轻松的，不过咱们的app看起来已经很不错了。

进入正题。

1、首先当然是实现承诺，把我们第二篇博客中的制作好的jar引入我们的项目。

 

注意我们的csdn_splider.jar依赖于jsoup.jar，不但两个都需要引入，而且需要jsoup在前，不然可能会报ClassNotFoundException。

2、MainActivity没有变化，但还是贴一下代码，方便大家的理解。

 

[java] view plain copy
 
  1. package com.zhy.csdndemo;  
  2.   
  3. import com.viewpagerindicator.TabPageIndicator;  
  4.   
  5. import android.os.Bundle;  
  6. import android.support.v4.app.FragmentActivity;  
  7. import android.support.v4.app.FragmentPagerAdapter;  
  8. import android.support.v4.view.ViewPager;  
  9.   
  10. public class MainActivity extends FragmentActivity  
  11. {  
  12.     private TabPageIndicator mIndicator ;  
  13.     private ViewPager mViewPager ;  
  14.     private FragmentPagerAdapter mAdapter ;  
  15.   
  16.     @Override  
  17.     protected void onCreate(Bundle savedInstanceState)  
  18.     {  
  19.         super.onCreate(savedInstanceState);  
  20.         setContentView(R.layout.activity_main);  
  21.       
  22.         mIndicator = (TabPageIndicator) findViewById(R.id.id_indicator);  
  23.         mViewPager = (ViewPager) findViewById(R.id.id_pager);  
  24.         mAdapter = new TabAdapter(getSupportFragmentManager());  
  25.         mViewPager.setAdapter(mAdapter);  
  26.         mIndicator.setViewPager(mViewPager, 0);  
  27.           
  28.           
  29.     }  
  30.       
  31.       
  32.   
  33. }  

主要的工作都是在MainFragment.java中完成。

 

 

[java] view plain copy
 
  1. package com.zhy.csdndemo;  
  2.   
  3. import java.util.ArrayList;  
  4. import java.util.List;  
  5.   
  6. import me.maxwin.view.IXListViewLoadMore;  
  7. import me.maxwin.view.IXListViewRefreshListener;  
  8. import me.maxwin.view.XListView;  
  9. import android.annotation.SuppressLint;  
  10. import android.os.AsyncTask;  
  11. import android.os.Bundle;  
  12. import android.support.v4.app.Fragment;  
  13. import android.view.LayoutInflater;  
  14. import android.view.View;  
  15. import android.view.ViewGroup;  
  16.   
  17. import com.zhy.bean.CommonException;  
  18. import com.zhy.bean.NewsItem;  
  19. import com.zhy.biz.NewsItemBiz;  
  20. import com.zhy.csdn.Constaint;  
  21. import com.zhy.csdndemo.adapter.NewsItemAdapter;  
  22.   
  23. @SuppressLint("ValidFragment")  
  24. public class MainFragment extends Fragment implements IXListViewRefreshListener, IXListViewLoadMore  
  25. {  
  26.     /** 
  27.      * 默认的newType 
  28.      */  
  29.     private int newsType = Constaint.NEWS_TYPE_YEJIE;  
  30.     /** 
  31.      * 当前页面 
  32.      */  
  33.     private int currentPage = 1;  
  34.     /** 
  35.      * 处理新闻的业务类 
  36.      */  
  37.     private NewsItemBiz mNewsItemBiz;  
  38.     /** 
  39.      * 扩展的ListView 
  40.      */  
  41.     private XListView mXListView;  
  42.     /** 
  43.      * 数据适配器 
  44.      */  
  45.     private NewsItemAdapter mAdapter;  
  46.       
  47.     /** 
  48.      * 数据 
  49.      */  
  50.     private List<NewsItem> mDatas = new ArrayList<NewsItem>();  
  51.   
  52.     /** 
  53.      * 获得newType 
  54.      * @param newsType 
  55.      */  
  56.     public MainFragment(int newsType)  
  57.     {  
  58.         this.newsType = newsType;  
  59.         mNewsItemBiz = new NewsItemBiz();  
  60.     }  
  61.   
  62.     @Override  
  63.     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)  
  64.     {  
  65.         return inflater.inflate(R.layout.tab_item_fragment_main, null);  
  66.     }  
  67.   
  68.     @Override  
  69.     public void onActivityCreated(Bundle savedInstanceState)  
  70.     {  
  71.         super.onActivityCreated(savedInstanceState);  
  72.         mAdapter = new NewsItemAdapter(getActivity(), mDatas);  
  73.         /** 
  74.          * 初始化 
  75.          */  
  76.         mXListView = (XListView) getView().findViewById(R.id.id_xlistView);  
  77.         mXListView.setAdapter(mAdapter);  
  78.         mXListView.setPullRefreshEnable(this);  
  79.         mXListView.setPullLoadEnable(this);  
  80.         //mXListView.NotRefreshAtBegin();  
  81.         /** 
  82.          * 进来时直接刷新 
  83.          */  
  84.         mXListView.startRefresh();  
  85.     }  
  86.   
  87.     @Override  
  88.     public void onRefresh()  
  89.     {  
  90.         new LoadDatasTask().execute();  
  91.     }  
  92.   
  93.     @Override  
  94.     public void onLoadMore()  
  95.     {  
  96.         // TODO Auto-generated method stub  
  97.   
  98.     }  
  99.     /** 
  100.      * 记载数据的异步任务 
  101.      * @author zhy 
  102.      * 
  103.      */  
  104.     class LoadDatasTask extends AsyncTask<Void, Void, Void>  
  105.     {  
  106.   
  107.         @Override  
  108.         protected Void doInBackground(Void... params)  
  109.         {  
  110.             try  
  111.             {  
  112.                 List<NewsItem> newsItems = mNewsItemBiz.getNewsItems(newsType, currentPage);  
  113.                 mDatas = newsItems;  
  114.             } catch (CommonException e)  
  115.             {  
  116.                 // TODO Auto-generated catch block  
  117.                 e.printStackTrace();  
  118.             }  
  119.   
  120.             return null;  
  121.         }  
  122.   
  123.         @Override  
  124.         protected void onPostExecute(Void result)  
  125.         {  
  126.             mAdapter.addAll(mDatas);  
  127.             mAdapter.notifyDataSetChanged();  
  128.             mXListView.stopRefresh();  
  129.         }  
  130.   
  131.     }  
  132.   
  133. }  

MainActivity中需要一个数据适配器，也就是NewsItemAdapter.java

 

 

[java] view plain copy
 
  1. package com.zhy.csdndemo.adapter;  
  2.   
  3. import java.util.List;  
  4.   
  5. import android.content.Context;  
  6. import android.util.Log;  
  7. import android.view.LayoutInflater;  
  8. import android.view.View;  
  9. import android.view.ViewGroup;  
  10. import android.widget.BaseAdapter;  
  11. import android.widget.ImageView;  
  12. import android.widget.TextView;  
  13.   
  14. import com.nostra13.universalimageloader.core.DisplayImageOptions;  
  15. import com.nostra13.universalimageloader.core.ImageLoader;  
  16. import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;  
  17. import com.nostra13.universalimageloader.core.display.FadeInBitmapDisplayer;  
  18. import com.nostra13.universalimageloader.core.display.RoundedBitmapDisplayer;  
  19. import com.zhy.bean.NewsItem;  
  20. import com.zhy.csdn.DataUtil;  
  21. import com.zhy.csdndemo.R;  
  22.   
  23. public class NewsItemAdapter extends BaseAdapter  
  24. {  
  25.   
  26.     private LayoutInflater mInflater;  
  27.     private List<NewsItem> mDatas;  
  28.       
  29.     /** 
  30.      * 使用了github开源的ImageLoad进行了数据加载 
  31.      */  
  32.     private ImageLoader imageLoader = ImageLoader.getInstance();  
  33.     private DisplayImageOptions options;  
  34.   
  35.     public NewsItemAdapter(Context context, List<NewsItem> datas)  
  36.     {  
  37.         this.mDatas = datas;  
  38.         mInflater = LayoutInflater.from(context);  
  39.           
  40.         imageLoader.init(ImageLoaderConfiguration.createDefault(context));  
  41.         options = new DisplayImageOptions.Builder().showStubImage(R.drawable.images)  
  42.                 .showImageForEmptyUri(R.drawable.images).showImageOnFail(R.drawable.images).cacheInMemory()  
  43.                 .cacheOnDisc().displayer(new RoundedBitmapDisplayer(20)).displayer(new FadeInBitmapDisplayer(300))  
  44.                 .build();  
  45.     }  
  46.   
  47.     public void addAll(List<NewsItem> mDatas)  
  48.     {  
  49.         this.mDatas.addAll(mDatas);  
  50.     }  
  51.   
  52.     @Override  
  53.     public int getCount()  
  54.     {  
  55.         return mDatas.size();  
  56.     }  
  57.   
  58.     @Override  
  59.     public Object getItem(int position)  
  60.     {  
  61.         return mDatas.get(position);  
  62.     }  
  63.   
  64.     @Override  
  65.     public long getItemId(int position)  
  66.     {  
  67.         return position;  
  68.     }  
  69.   
  70.     @Override  
  71.     public View getView(int position, View convertView, ViewGroup parent)  
  72.     {  
  73.         ViewHolder holder = null;  
  74.         if (convertView == null)  
  75.         {  
  76.             convertView = mInflater.inflate(R.layout.news_item_yidong, null);  
  77.             holder = new ViewHolder();  
  78.   
  79.             holder.mContent = (TextView) convertView.findViewById(R.id.id_content);  
  80.             holder.mTitle = (TextView) convertView.findViewById(R.id.id_title);  
  81.             holder.mDate = (TextView) convertView.findViewById(R.id.id_date);  
  82.             holder.mImg = (ImageView) convertView.findViewById(R.id.id_newsImg);  
  83.   
  84.             convertView.setTag(holder);  
  85.         } else  
  86.         {  
  87.             holder = (ViewHolder) convertView.getTag();  
  88.         }  
  89.         NewsItem newsItem = mDatas.get(position);  
  90.         holder.mTitle.setText(DataUtil.ToDBC(newsItem.getTitle()));  
  91.         holder.mContent.setText(newsItem.getContent());  
  92.         holder.mDate.setText(newsItem.getDate());  
  93.         if (newsItem.getImgLink() != null)  
  94.         {  
  95.             holder.mImg.setVisibility(View.VISIBLE);  
  96.             imageLoader.displayImage(newsItem.getImgLink(), holder.mImg, options);  
  97.         } else  
  98.         {  
  99.             holder.mImg.setVisibility(View.GONE);  
  100.         }  
  101.   
  102.         return convertView;  
  103.     }  
  104.   
  105.     private final class ViewHolder  
  106.     {  
  107.         TextView mTitle;  
  108.         TextView mContent;  
  109.         ImageView mImg;  
  110.         TextView mDate;  
  111.     }  
  112.   
  113. }  

对于Listview的每个Item的布局，这样的写法也很常见了，所以都不多说了，注意一点就行，这里对图片的加载用的是Github上的ImageLoader项目。

 

3、Frament的布局文件

 

[html] view plain copy
 
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent" >  
  5.   
  6.     <me.maxwin.view.XListView  
  7.         android:id="@+id/id_xlistView"  
  8.         android:layout_width="match_parent"  
  9.         android:layout_height="match_parent"  
  10.         android:cacheColorHint="#00000000"  
  11.         android:divider="@drawable/base_list_divider_drawable"  
  12.         android:fadingEdge="none" >  
  13.     </me.maxwin.view.XListView>  
  14.   
  15. </RelativeLayout>  

XlistView的Item的布局文件：

 

 

[html] view plain copy
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="wrap_content"  
  5.     android:orientation="vertical"  
  6.     android:paddingLeft="16dp"  
  7.     android:paddingRight="16dp"  
  8.     android:paddingTop="8dp"  
  9.     android:paddingBottom="8dp"  
  10.     >  
  11.     <TextView   
  12.         android:id="@+id/id_title"  
  13.         android:layout_width="match_parent"  
  14.         android:layout_height="wrap_content"  
  15.         android:layout_marginBottom="8dp"  
  16.         android:textSize="18sp"  
  17.         android:textColor="@color/black"  
  18.         android:text="如何有效地在海外市场推广产品？"/>  
  19. <LinearLayout   
  20.     android:layout_width="fill_parent"  
  21.     android:layout_height="wrap_content"  
  22.     android:orientation="horizontal"  
  23.     android:baselineAligned="true"  
  24.     >  
  25. <ImageView   
  26.         android:id="@+id/id_newsImg"  
  27.         android:src="@drawable/images"  
  28.         android:layout_width="wrap_content"  
  29.         android:layout_height="wrap_content"  
  30.         android:layout_marginRight="8dp"  
  31.         android:visibility="visible"/>  
  32.     <LinearLayout  
  33.         android:layout_width="0dp"  
  34.         android:layout_height="fill_parent"  
  35.         android:layout_gravity="center_vertical"  
  36.         android:layout_weight="1"  
  37.         android:gravity="center_vertical"  
  38.         android:orientation="vertical" >  
  39.           
  40.         <LinearLayout  
  41.             android:layout_width="fill_parent"  
  42.             android:layout_height="0dp"  
  43.             android:layout_weight="1"  
  44.             android:gravity="top" >  
  45.   
  46.             <TextView  
  47.                 android:id="@+id/id_content"  
  48.                 android:layout_width="fill_parent"  
  49.                 android:layout_height="wrap_content"  
  50.                 android:gravity="top"  
  51.                 android:maxLines="2"  
  52.                 android:text="3D打印机一直以来只能进行单向操作，任务一旦开始便无法反悔。不过最近一批研究生研发了一种新型打印机，让你在打印的同时，可以修改重塑之前的设计。让我们一起来看看这个神奇的设备究竟是怎样的吧。"  
  53.                 android:textColor="@color/nomalGray"  
  54.                 android:textSize="14sp"  
  55.                  />  
  56.   
  57.               
  58.         </LinearLayout>  
  59.   
  60.         <LinearLayout  
  61.             android:layout_width="fill_parent"  
  62.             android:layout_height="wrap_content"  
  63.             android:gravity="center_vertical" >  
  64.   
  65.             <TextView  
  66.                 android:id="@+id/id_date"  
  67.                 android:layout_width="0dp"  
  68.                 android:layout_height="wrap_content"  
  69.                 android:layout_weight="1"  
  70.                 android:gravity="center_vertical|right"  
  71.                 android:paddingTop="8dp"  
  72.                 android:singleLine="true"  
  73.                 android:text="13分钟前|11次阅读"  
  74.                 android:textSize="12sp"  
  75.                 android:textColor="@color/nomalGray" />  
  76.   
  77.             <TextView  
  78.                 android:id="@+id/id"  
  79.                 android:layout_width="0dp"  
  80.                 android:layout_height="wrap_content"  
  81.                 android:layout_weight="1"  
  82.                 android:paddingTop="16dp"  
  83.                 android:text="1"  
  84.                 android:gravity="right"  
  85.                 android:visibility="gone"  
  86.                 android:textColor="@color/nomalGray"  
  87.                  />  
  88.         </LinearLayout>  
  89.     </LinearLayout>  
  90. </LinearLayout>  
  91.             <!-- <TextView  
  92.                 android:id="@+id/availableNum"  
  93.                 android:layout_width="wrap_content"  
  94.                 android:layout_height="wrap_content"  
  95.                 android:textColor="@color/nomalGray"  
  96.                 android:layout_alignParentBottom="true"  
  97.                 android:layout_alignParentRight="true"  
  98.                 android:background="@drawable/bg_mark_pressed"  
  99.                 android:text="可借：4"  
  100.                 android:textSize="13sp"  
  101.                 android:layout_marginLeft="2dp"  
  102.                 android:layout_marginRight="2dp"  
  103.                 android:layout_centerVertical="true"  
  104.                  /> -->  
  105.       
  106. </LinearLayout>  

好了，到此结束，总体来说还是比较容易实现的，不过可以看到进展的感觉不错。

 

源码点击此处下载

 


 

版权声明：本文为博主原创文章，未经博主允许不得转载。
posted on 2017-11-23 11:46  无网不进  阅读(158)  评论(0)    收藏  举报
 
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3