VIewPager+XListView+RadioButton实现布局

要实现上面图片中的效果，首先要有一个布局：

接下来把我们的XListView配置文件添加到项目中：

*xlistview_arrow.pog为一张下拉箭头的图片*
*strings.xml文件是为所有的文字创建的value文件*

*布局文件*

*配置文件*

1.先看一下主页面布局（activity_main.xml）：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context="com.example.weektwoex.MainActivity" >    <com.example.weektwoex.view.xlist.XListView        android:id="@+id/xlv"        android:layout_width="match_parent"        android:layout_height="match_parent" >    </com.example.weektwoex.view.xlist.XListView></RelativeLayout>

2.布局的优化（list_item.xml）：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:padding="10dp" >    <TextView        android:id="@+id/xtv_title"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_toRightOf="@+id/xiv"        android:padding="10dp"        android:singleLine="true"        android:text="标题" />    <ImageView        android:id="@+id/xiv"        android:layout_width="150dp"        android:layout_height="100dp"        android:layout_alignParentLeft="true" /></RelativeLayout>

3.添加网络权限：

4.实例化信息：

《News.java》import java.util.List;public class News {    String ga_prefix;    String id;    List<String> images;    String title;    int type;    public String getGa_prefix() {        return ga_prefix;    }    public void setGa_prefix(String ga_prefix) {        this.ga_prefix = ga_prefix;    }    public String getId() {        return id;    }    public void setId(String id) {        this.id = id;    }    public List<String> getImages() {        return images;    }    public void setImages(List<String> images) {        this.images = images;    }    public String getTitle() {        return title;    }    public void setTitle(String title) {        this.title = title;    }    public int getType() {        return type;    }    public void setType(int type) {        this.type = type;    }    public News(String ga_prefix, String id, List<String> images, String title,            int type) {        super();        this.ga_prefix = ga_prefix;        this.id = id;        this.images = images;        this.title = title;        this.type = type;    }    @Override    public String toString() {        return "News [ga_prefix=" + ga_prefix + ", id=" + id + ", images="                + images + ", title=" + title + ", type=" + type + "]";    }}

《NewsData.java》import java.util.ArrayList;import java.util.List;public class NewsData {    String date;    List<News> stories = new ArrayList<News>();    List<NewsTop> top_stories = new ArrayList<NewsTop>();    public String getDate() {        return date;    }    public void setDate(String date) {        this.date = date;    }    public List<News> getStories() {        return stories;    }    public void setStories(List<News> stories) {        this.stories = stories;    }    public List<NewsTop> getTop_stories() {        return top_stories;    }    public void setTop_stories(List<NewsTop> top_stories) {        this.top_stories = top_stories;    }    @Override    public String toString() {        return "NewsData [date=" + date + ", stories=" + stories                + ", top_stories=" + top_stories + "]";    }}

《NewsTop.java》public class NewsTop {    String ga_prefix;    int id;    String image;    String title;    int type;    public String getGa_prefix() {        return ga_prefix;    }    public void setGa_prefix(String ga_prefix) {        this.ga_prefix = ga_prefix;    }    public int getId() {        return id;    }    public void setId(int id) {        this.id = id;    }    public String getImage() {        return image;    }    public void setImage(String image) {        this.image = image;    }    public String getTitle() {        return title;    }    public void setTitle(String title) {        this.title = title;    }    public int getType() {        return type;    }    public void setType(int type) {        this.type = type;    }    public NewsTop(String ga_prefix, int id, String image, String title,            int type) {        super();        this.ga_prefix = ga_prefix;        this.id = id;        this.image = image;        this.title = title;        this.type = type;    }    @Override    public String toString() {        return "NewsTop [ga_prefix=" + ga_prefix + ", id=" + id + ", image="                + image + ", title=" + title + ", type=" + type + "]";    }}

5.添加网络请求：

import java.io.InputStream;import java.io.InputStreamReader;import java.io.Reader;import java.net.HttpURLConnection;import java.net.URL;public class NetUtils {    public static Reader getDataByGet(String path){        InputStreamReader isr = null;        try {            URL url = new URL(path);            HttpURLConnection conn = (HttpURLConnection) url.openConnection();            conn.setRequestMethod("GET");            int code = conn.getResponseCode();            if(code == 200){                InputStream is = conn.getInputStream();                isr = new InputStreamReader(is);            }        } catch (Exception e) {            // TODO Auto-generated catch block            e.printStackTrace();        }        return isr;    }}

6.MyApplication初始化：

import com.nostra13.universalimageloader.core.DisplayImageOptions;import com.nostra13.universalimageloader.core.ImageLoader;import com.nostra13.universalimageloader.core.ImageLoaderConfiguration;import com.nostra13.universalimageloader.core.display.FadeInBitmapDisplayer;import android.app.Application;public class MyApp extends Application{    public void onCreate() {        DisplayImageOptions options = new DisplayImageOptions.Builder()        .showImageOnLoading(R.drawable.ic_launcher)        .cacheInMemory(true)        .cacheOnDisk(true)        .displayer(new FadeInBitmapDisplayer(1500))        .build();        ImageLoaderConfiguration configs = new ImageLoaderConfiguration.Builder(this)        .memoryCacheExtraOptions(480, 800)        .defaultDisplayImageOptions(options)        .build();        ImageLoader.getInstance().init(configs);    };}

7.最后就是主文件的配置了（MainActivity.java）：

import java.io.Reader;import java.util.ArrayList;import java.util.List;import android.app.Activity;import android.os.AsyncTask;import android.os.Bundle;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.ImageView.ScaleType;import android.widget.TextView;import com.example.weektwoex.bean.NewsData;import com.example.weektwoex.utils.NetUtils;import com.example.weektwoex.view.xlist.XListView;import com.example.weektwoex.view.xlist.XListView.IXListViewListener;import com.google.gson.Gson;import com.nostra13.universalimageloader.core.ImageLoader;public class MainActivity extends Activity {    XListView xlv;    NewsData nd;    MyAdapter adapter;    //viewpager相关变量    ViewPager vp;    List<ImageView> vpList;    View view;    MyPagerAdapter vpAdapter;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        xlv = (XListView) findViewById(R.id.xlv);        initData();        adapter = new MyAdapter();        xlv.setAdapter(adapter);        xlv.setXListViewListener(new IXListViewListener() {            @Override            public void onRefresh() {                new AsyncTask<String, String, String>() {                    @Override                    protected String doInBackground(String... params) {                        //获取指定网址的字符输入流                        Reader reader = NetUtils.getDataByGet("https://news-at.zhihu.com/api/4/news/latest");                        if(reader != null){                            Gson gson = new Gson();                            //得到javabean对象                            nd = gson.fromJson(reader, NewsData.class);                        }                        return null;                    }                    protected void onPostExecute(String result) {                        //刷新页面                        adapter.notifyDataSetChanged();                        xlv.stopRefresh();                    };                }.execute();            }            @Override            public void onLoadMore() {                //              new Handler().postAtTime(new Runnable() {                //                                  //                  @Override                //                  public void run() {                //                      Toast.makeText(MainActivity.this, "没有更多数据", 0).show();                //                      xlv.stopLoadMore();                //                  }                //              }, 2000);            }        });    }    /**     * 该方法用来单独创建一个ViewPager的视图   添加在xListView的头布局中显示     * @return     */    private View initViewPager() {        View view = View.inflate(MainActivity.this, R.layout.view_viewpager, null);        vp = (ViewPager) view.findViewById(R.id.vp);        //初始化VP要显示ImageView控件        initVPData();        vpAdapter = new MyPagerAdapter();        vp.setAdapter(vpAdapter);        final TextView tv = (TextView) view.findViewById(R.id.vp_tv);        if(nd != null){            tv.setText(nd.getTop_stories().get(0).getTitle());        }        //添加ViewPager监听  滑动时改变文本内容addOnPageChangeListener = setOnPageChangeListener        //add方法是新版本sdk更新的方法  跟set作用一致      因为set在新版本的sdk中是不推荐使用的方法        vp.addOnPageChangeListener(new OnPageChangeListener() {            @Override            public void onPageSelected(int arg0) {                tv.setText(nd.getTop_stories().get(arg0).getTitle());            }            @Override            public void onPageScrolled(int arg0, float arg1, int arg2) {                // TODO Auto-generated method stub            }            @Override            public void onPageScrollStateChanged(int arg0) {                // TODO Auto-generated method stub            }        });        return view;    }    /**     * 初始化ViewPager数据     */    private void initVPData() {        vpList = new ArrayList<ImageView>();        if(nd != null){            for (int i = 0; i < nd.getTop_stories().size(); i++) {                ImageView iv = new ImageView(this);                iv.setScaleType(ScaleType.FIT_XY);                ImageLoader.getInstance().displayImage(nd.getTop_stories().get(i).getImage(), iv);                vpList.add(iv);            }        }    }    /**     * 加载数据库数据     * 加载网络数据       *      */    private void initData() {        //      getDBData();        //wifi判断  如果满足条件  进行网络加载        getNetData();    }    /**     * 获取网络数据     */    private void getNetData() {        new AsyncTask<String, String, String>() {            @Override            protected String doInBackground(String... params) {                //获取指定网址的字符输入流                Reader reader = NetUtils.getDataByGet("https://news-at.zhihu.com/api/4/news/latest");                if(reader != null){                    Gson gson = new Gson();                    //得到javabean对象                    nd = gson.fromJson(reader, NewsData.class);                }                return null;            }            protected void onPostExecute(String result) {                //刷新xlv页面                adapter.notifyDataSetChanged();                //显示Viewpager数据                view = initViewPager();                xlv.addHeaderView(view);            };        }.execute();    }    /**     * ListView适配器     * @author Administrator     *     */    class MyAdapter extends BaseAdapter{        @Override        public int getCount() {            if(nd != null){                return nd.getStories().size();            }            return 0;        }        @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) {            ViewHolder holder;            if(convertView == null){                convertView = View.inflate(MainActivity.this, R.layout.list_itme, null);                holder = new ViewHolder();                holder.xtv_title = (TextView) convertView.findViewById(R.id.xtv_title);                holder.xiv = (ImageView) convertView.findViewById(R.id.xiv);                convertView.setTag(holder);            }else{                holder = (ViewHolder) convertView.getTag();            }            holder.xtv_title.setText(nd.getStories().get(position).getTitle());            ImageLoader.getInstance().displayImage(nd.getStories().get(position).getImages().get(0), holder.xiv);            return convertView;        }    }    public static class ViewHolder{        ImageView xiv;        TextView xtv_title;    }    /**     * ViewPager适配器     * @author Administrator     *     */    class MyPagerAdapter extends PagerAdapter{        @Override        public int getCount() {            if(nd != null){                return nd.getTop_stories().size();            }            return 0;        }        @Override        public boolean isViewFromObject(View arg0, Object arg1) {            // TODO Auto-generated method stub            return arg0 == arg1;        }        @Override        public void destroyItem(ViewGroup container, int position, Object object) {            container.removeView((View) object);        }        @Override        public Object instantiateItem(ViewGroup container, int position) {            container.addView(vpList.get(position));            return vpList.get(position);        }    }}

最后就是我们是实现效果了：