ListView的使用

最新推荐文章于 2015-11-24 10:19:29 发布

微弱浮尘

最新推荐文章于 2015-11-24 10:19:29 发布

阅读量697

点赞数

分类专栏： android 文章标签： android listview 布局

本文链接：https://blog.csdn.net/u012077264/article/details/47832597

版权

android 专栏收录该内容

23 篇文章 1 订阅

订阅专栏

单独的ListView使用见Listview的DEMO

通过在Activity中Fragment中引用ListView与直接在Activity中引用ListView有所不同

ListView的使用 + BaseAdapter
1）在layout文件中声明控件
2）定义一个layout文件描述ListView的item的外观控件
3）java代码找出ListView控件
4）定义ListView的数据源并添加数据
List<自定义类>
5）适配器：定义类 extends BaseAdapter
6）java代码中初始化适配器
7）ListView调用setAdapter()

实现的效果图：通过点击“男装”，“女装”等标签分别显示listview加载出来的内容，或者通过向左右活动屏幕切换到新的页面，相应的标签栏也进行了切换

首相进行Layout的创建 product_fragment：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="@dimen/activity_horizontal_margin" >

    <HorizontalScrollView
        android:id="@+id/product_hscroll"
        android:layout_width="match_parent"
        android:layout_height="@dimen/line_width_40"
        android:scrollbars="none" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:background="#fff"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/product_boy"
                android:layout_width="100dp"
                android:layout_height="match_parent"
                android:layout_marginLeft="1dp"
                android:background="#ccc"
                android:gravity="center"
                android:text="男装"
                android:textColor="#f00"
                android:textSize="16sp" />

            <TextView
                android:id="@+id/product_nv"
                android:layout_width="100dp"
                android:layout_height="match_parent"
                android:layout_marginLeft="1dp"
                android:background="#ccc"
                android:gravity="center"
                android:text="女装"
                android:textColor="#f00"
                android:textSize="16sp" />

            <TextView
                android:id="@+id/product_tong"
                android:layout_width="100dp"
                android:layout_height="match_parent"
                android:layout_marginLeft="1dp"
                android:background="#ccc"
                android:gravity="center"
                android:text="童装"
                android:textColor="#f00"
                android:textSize="16sp" />
            <TextView
                android:id="@+id/product_shipin"
                android:layout_width="100dp"
                android:layout_height="match_parent"
                android:layout_marginLeft="1dp"
                android:background="#ccc"
                android:gravity="center"
                android:text="饰品"
                android:textColor="#f00"
                android:textSize="16sp" />
            <TextView
                android:id="@+id/product_bag"
                android:layout_width="100dp"
                android:layout_height="match_parent"
                android:layout_marginLeft="1dp"
                android:background="#ccc"
                android:gravity="center"
                android:text="包包"
                android:textColor="#f00"
                android:textSize="16sp" />
        </LinearLayout>
  </HorizontalScrollView>
  <android.support.v4.view.ViewPager
        android:id="@+id/product_viewpager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="2dp" />
</LinearLayout>

创建一个ProductFragment用于获取上面的布局：

public class ProductFragment extends Fragment implements OnClickListener {
	private View rootView;
	// ViewPager相关
	private ViewPager viewPager;
	private List<Fragment> viewPagerData;
	private FragmentPagerAdapter viewPagerAdapter;

	private TextView[] tvCategorys;
	private HorizontalScrollView hScrollView;

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		if (rootView == null) {
			rootView = inflater.inflate(R.layout.fragment_product, container,
					false);
			initView(rootView);
		}
		ViewGroup par = (ViewGroup) rootView.getParent();
		if (par != null) {
			par.removeView(rootView);
		}
		return rootView;
	}

	private void initView(View rootView) {
		// ViewPager相关
		viewPager = (ViewPager) rootView.findViewById(R.id.product_viewpager);
		// 数据源
		viewPagerData = new ArrayList<Fragment>();
		viewPagerData.add(ProductCategoryFragment.newInstance("男装"));
		viewPagerData.add(ProductCategoryFragment.newInstance("女装"));
		viewPagerData.add(ProductCategoryFragment.newInstance("童装"));
		viewPagerData.add(ProductCategoryFragment.newInstance("饰品"));
		viewPagerData.add(ProductCategoryFragment.newInstance("包包"));
		// 适配器
		viewPagerAdapter = new ViewPagerProductAdapter(
				getChildFragmentManager(), viewPagerData);
		// 控件绑定适配器
		viewPager.setAdapter(viewPagerAdapter);
		// 滑动页面时让对应的标签跟着一起改变，滑动到第几个页面arg0的值随着改变，数组tvCategorys[arg0]对应的标签也随着改变，但tvCategorys在后面部分也没有影响
		viewPager.setOnPageChangeListener(new OnPageChangeListener() {

			@Override
			public void onPageSelected(int arg0) {
				for (int i = 0; i < tvCategorys.length; i++) {
					tvCategorys[i].setTextColor(Color.BLACK);
					tvCategorys[i].setBackgroundColor(Color.rgb(0xDD, 0xDD,
							0xDD));
				}
				tvCategorys[arg0].setBackgroundColor(Color.BLUE);
				tvCategorys[arg0].setTextColor(Color.WHITE);
			}

			@Override
			public void onPageScrolled(int arg0, float arg1, int arg2) {

			}

			@Override
			public void onPageScrollStateChanged(int arg0) {

			}
		});
		// //
		tvCategorys = new TextView[5];
		tvCategorys[0] = (TextView) rootView.findViewById(R.id.product_boy);
		tvCategorys[1] = (TextView) rootView.findViewById(R.id.product_nv);
		tvCategorys[2] = (TextView) rootView.findViewById(R.id.product_tong);
		tvCategorys[3] = (TextView) rootView.findViewById(R.id.product_shipin);
		tvCategorys[4] = (TextView) rootView.findViewById(R.id.product_bag);
		for (int i = 0; i < tvCategorys.length; i++) {
			tvCategorys[i].setOnClickListener(this);
		}
		hScrollView = (HorizontalScrollView) rootView
				.findViewById(R.id.product_hscroll);
	}

	// 通过点击控件进行对应页面的切换
	@Override
	public void onClick(View v) {
		for (int i = 0; i < tvCategorys.length; i++) {
			tvCategorys[i].setTextColor(Color.BLACK);
			tvCategorys[i].setBackgroundColor(Color.rgb(0xDD, 0xDD, 0xDD));
		}
		// 判断具体点击了哪一个TextView
		for (int i = 0; i < tvCategorys.length; i++) {

			if (v == tvCategorys[i]) {
				tvCategorys[i].setBackgroundColor(Color.BLUE);
				tvCategorys[i].setTextColor(Color.WHITE);
				viewPager.setCurrentItem(i);
				break;
			}
		}
	}
}

创建一个productcategory_listview，目的是为了把紧接着下面的这个listview_item_product这个控件放入这个布局中：

<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:id="@+id/productcategory_listview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:cacheColorHint="#0000" 
        ></ListView>

</LinearLayout>

创建一个listview_item_product：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:orientation="horizontal" >
    <ImageView
        android:id="@+id/listview_item_product_img"
        android:layout_width="100dp"
        android:layout_height="100dp" 
        />
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginLeft="4dp"
        android:orientation="vertical" 
        >
        <TextView
            android:id="@+id/listview_item_product_tv_name"
            android:layout_width="match_parent"
            android:layout_height="30dp"
            android:textSize="16sp"
            android:textStyle="bold"
            />
        <TextView
            android:id="@+id/listview_item_product_tv_desc"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:ellipsize="end"
            android:lineSpacingExtra="4dp"
            />
    </LinearLayout>

</LinearLayout>

通过java代码创建一个适配器，加载入listview_item_product中所有控件，但在这之前还需要创建一个product命名的标准类，为了方便阅读，接着创建在一下这个类后面：

public class ListViewProductAdapter extends BaseAdapter{
	// 需要两个成员变量
	private Context context ;
	private List<Product> data ;
	public ListViewProductAdapter(Context context, List<Product> data) {
		super();
		this.context = context;
		this.data = data;
	}
	@Override
	public int getCount() {
		return data.size() ;
	}
	@Override
	public Object getItem(int position) {
		return data.get(position) ;
	}
	@Override
	public long getItemId(int position) {
		return position ;
	}
	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		ViewHolder holder = null ;
		if(null == convertView) {
			convertView = LayoutInflater.from(context).inflate(R.layout.listview_product_item, null) ;
			holder = new ViewHolder() ;
			holder.iv = (ImageView) convertView.findViewById(R.id.listview_item_product_img) ;
			holder.tvTitle = (TextView) convertView.findViewById(R.id.listview_item_product_tv_name) ;
			holder.tvDesc = (TextView) convertView.findViewById(R.id.listview_item_product_tv_desc) ;
			convertView.setTag(holder) ;
		}
		else {
			holder = (ViewHolder) convertView.getTag() ;
		}
		// 为控件绑定数据项
		Product current = data.get(position) ;
		holder.iv.setImageResource(current.getImg()) ;
		holder.tvDesc.setText(current.getDesc()) ;
		holder.tvTitle.setText(current.getName()) ;
		
		return convertView ;
	}
	static class ViewHolder{
		// 声明你的item布局layout文件中所需要使用的控件
		ImageView iv;
		TextView tvTitle , tvDesc ;
	}
}

标准的product类：

public class Product {
	private long id ;
	private int img;
	private String name , desc ;
	private double price ;
	private int count ;	
	private String imgUrl ;
	public Product(long id, int img, String name, String desc, double price,
			int count) {
		super();
		this.id = id;
		this.img = img;
		this.name = name;
		this.desc = desc;
		this.price = price;
		this.count = count;
	}
	public Product(long id, String imgUrl, String name, String desc, double price,
			int count) {
		super();
		this.id = id;
		this.imgUrl = imgUrl;
		this.name = name;
		this.desc = desc;
		this.price = price;
		this.count = count;
	}
	public long getId() {
		return id;
	}
	public int getImg() {
		return img;
	}
	public String getName() {
		return name;
	}
	public String getDesc() {
		return desc;
	}
	public double getPrice() {
		return price;
	}
	public int getCount() {
		return count;
	}
	public String getImgUrl() {
		return imgUrl;
	}
	@Override
	public String toString() {
		return "Product [id=" + id + ", img=" + img + ", name=" + name
				+ ", desc=" + desc + ", price=" + price + ", count=" + count
				+ ", imgUrl=" + imgUrl + "]";
	}
	
}

创建一个ProductCategoryFragment，把适配器加载到listview

public class ProductCategoryFragment extends Fragment {
	private View rootView;
	private String category;

	private ListView listview;
	private List<Product> data;
	private BaseAdapter adapter;

	// 当前Fragment初始化时需要传入字符串类型的商品类别
	public static ProductCategoryFragment newInstance(String categoryName) {
		// 把参数放入Bundle
		Bundle bundle = new Bundle();
		bundle.putString("category", categoryName);
		// 初始化当前Fragment对象
		ProductCategoryFragment f = new ProductCategoryFragment();
		// 将Bundle放入当前Fragment对象的arguments里面
		f.setArguments(bundle);
		// 返回定义的当前Fragment对象
		return f;
	}

	// 获取Fragment初始化时传入的参数
	public String getCategory() {
		// 从Arguments中取出Bundle
		Bundle bundle = getArguments();
		// 从Bundle中取出数据
		String result = null;
		if (null != bundle) {
			result = bundle.getString("category");
		}
		return result;
	}

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		if (null == rootView) {
			rootView = inflater.inflate(R.layout.fragment_productcategory,
					container, false);
			initView(rootView);
		}
		ViewGroup parent = (ViewGroup) rootView.getParent();
		if (null != parent) {
			parent.removeView(rootView);
		}
		return rootView;
	}

	private void initView(View rootView) {
		category = getCategory();
		if (null == category) {
			return;
		}
		listview = (ListView) rootView
				.findViewById(R.id.productcategory_listview);
		data = new ArrayList<Product>();
		if ("男装".equals(category)) {
			data.add(new Product(1, R.drawable.nan_1, "dfsd", "dfdsgds", 128, 4));
			data.add(new Product(2, R.drawable.nan_2, "jeep", "dssdf", 228, 4));
			data.add(new Product(3, R.drawable.nan_3, "dfssdf", "dfdsgsdg",
					128, 4));
		} else if ("女装".equals(category)) {
			data.add(new Product(1, R.drawable.nv_1, "only", "only ", 128, 4));
			data.add(new Product(2, R.drawable.nv_2, "Very moda", "fdsfs", 128,
					4));
		} else if ("童装".equals(category)) {
			data.add(new Product(1, R.drawable.tong_1, "balala", "dfdsfs", 128,
					4));
			data.add(new Product(2, R.drawable.tong_2, "tom", "fgsf", 128, 4));
			data.add(new Product(2, R.drawable.tong_3, "cat", "dfsdf", 128, 4));
		} else if ("饰品".equals(category)) {
			data.add(new Product(2, R.drawable.shi_1, "Chanel", "dsfdsfds",
					128, 4));
		} else if ("包包".equals(category)) {
			data.add(new Product(2, R.drawable.bao_1, "MK", "MK", 128, 4));
			data.add(new Product(2, R.drawable.bao_2, "baburry", "dfdsf", 128,
					4));
			data.add(new Product(2, R.drawable.bao_3, "NineWest", "dfdsfsd",
					128, 4));
		}
		// 适配器
		adapter = new ListViewProductAdapter(getActivity(), data);
		listview.setAdapter(adapter);
	}
}