Android之ListView头部添加ViewPager

来源:互联网 发布:2016年数据库市场份额 编辑:程序博客网 时间:2024/05/22 17:29

目前很多客户端都采用的是ListView添加两个头部,一个是下拉加载更多的View,另外一个就是ViewPager来进行广告/图片的轮播。

今天我们先来实现一个简单的ListView头部添加ViewPager的Demo(暂不考虑事件冲突):


ListView添加头部/尾部分别调用的是:

listView.addHeaderView(view);

listView.addFooterView(view);


然而,在实现的过程中我们经常会遇到ViewPager显示不出来或者显示整个屏幕。

原因:

ViewPager在XML中设置为android:layout_width="fill_parent" android:layout_width="wrap_content"都会出现满屏的效果。

解决办法:

1.XML中,在ViewPager外层嵌套一个LinearLayout等布局。

<?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:orientation="vertical" >    <android.support.v4.view.ViewPager        android:id="@+id/viewpager"        android:layout_width="fill_parent"        android:layout_height="200dp" /></LinearLayout>

2.在代码中实现:上一种方法由于指定的固定值,所以适配其他手机的时候会出现问题。

在代码中动态指定宽高可以有效的解决,利用DisplayMetrics获取屏幕的宽高,再根据半分比来加载ViewPager的宽高就可以了

//从布局文件中获取ViewPager父容器pagerLayout = (LinearLayout) findViewById(R.id.view_pager_content);//创建ViewPager    adViewPager = new ViewPager(this);        //获取屏幕像素相关信息    DisplayMetrics dm = new DisplayMetrics();        getWindowManager().getDefaultDisplay().getMetrics(dm);            //根据屏幕信息设置ViewPager广告容器的宽高        adViewPager.setLayoutParams(new LayoutParams(dm.widthPixels, dm.heightPixels * 2 / 5));                //将ViewPager容器设置到布局文件父容器中    pagerLayout.addView(adViewPager);

我们的Demo用的第一种方法,需要做适配的同学,请用第二种方法


MainAcitivty.java

public class MainActivity extends Activity {private ListView listView;private MyAdapter adapter;// ListView适配器private MyViewPagerAdapter pagerAdapter;// ViewPager适配器private ViewPager pager;private List<View> list;// 保存ImageView的List@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initView();}private void initView() {listView = (ListView) findViewById(R.id.listView);// ListView头部ViewView view = LayoutInflater.from(this).inflate(R.layout.header, null);pager = (ViewPager) view.findViewById(R.id.viewpager);initPageData();pagerAdapter = new MyViewPagerAdapter(list);pager.setAdapter(pagerAdapter);// addHeaderView一定要在setAdapter前调用listView.addHeaderView(view);adapter = new MyAdapter(this, getDate());listView.setAdapter(adapter);}/** * list图片数据 */private void initPageData() {list = new ArrayList<View>();ImageView img1 = new ImageView(this);img1.setBackgroundResource(R.drawable.ic_launcher);list.add(img1);ImageView img2 = new ImageView(this);img2.setBackgroundResource(R.drawable.ic_launcher);list.add(img2);ImageView img3 = new ImageView(this);img3.setBackgroundResource(R.drawable.ic_launcher);list.add(img3);ImageView img4 = new ImageView(this);img4.setBackgroundResource(R.drawable.ic_launcher);list.add(img4);ImageView img5 = new ImageView(this);img5.setBackgroundResource(R.drawable.ic_launcher);list.add(img5);ImageView img6 = new ImageView(this);img6.setBackgroundResource(R.drawable.ic_launcher);list.add(img6);}/** * ListView数据 */private List<String> getDate() {List<String> list = new ArrayList<String>();int idex = 0;for (; idex < 20; idex++) {list.add("第" + idex + "行");}return list;}/** * 自定义的PagerAdapter */public class MyViewPagerAdapter extends PagerAdapter {private List<View> views = null;public MyViewPagerAdapter(List<View> views) {super();this.views = views;}@Overridepublic void destroyItem(ViewGroup container, int position, Object object) {((ViewPager) container).removeView(views.get(position));}@Overridepublic Object instantiateItem(ViewGroup container, int position) {((ViewPager) container).addView(views.get(position));return views.get(position);}@Overridepublic int getCount() {return views.size();}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == arg1;}}}

效果图:(略渣~但是效果实现了)



0 1
原创粉丝点击