ListView应用实战

ListView应用实战

     本篇文章讲解的为ListView应用实战,主要应用到ListView添加headView实现整体滑动,添加RadioGroup实现切换ListView数据.话不多说，先上效果图:
                                                                                        
可以看到这个项目还是将ListView的基础功能都应用上了。如果大家有需要整个项目源码的话， 单击源码下载.

     花了一个下午的时间终于做出这么一个ListView加载效果出来:ListView通过addView添加图片，文本导航,以及RadioGroup导航实现ListView与这些view的整体滑动效果,同时点击不同的RadioButton,ListView加载不同的类型数据，我加载的为一个webView，所以会看到加载会有些慢。再加上UI的设计，我觉得这个项目还是有分享出来，大家一起讨论学习的必要！下面就和我们一起来解剖这个项目吧！

运用到的技术点

ListView加载其他View实现整体滑动、自定义Adapter应用(根据用户不同选择为ListView适配不同数据)、ListView加载不同数据、WebView和ListView整合技术、UI设计

ListView与View整体滑动

这部分内容很基础,就是通过ListView.addHeaderView()将该view包含其中即可,需要注意的是该view一定要设置 AbsListView.LayoutParams参数来设置加载布局,不了解的朋友,可以看我的另外两篇篇博客: 设置View的LayoutParams以及 ListView基础应用里面都有详细的解释。

关键代码如下：

private void addHeadView() {
		// 获取屏幕宽度,高度
		Display display = this.getWindowManager().getDefaultDisplay();
		int width = display.getWidth();
		int height = display.getHeight();
		LinearLayout headView = (LinearLayout) View.inflate(this,
				R.layout.head, null);
		AbsListView.LayoutParams lph = new AbsListView.LayoutParams(
				new LayoutParams(AbsListView.LayoutParams.MATCH_PARENT,
						(int) (height * 0.28)));
		headView.setLayoutParams(lph);
		listView.addHeaderView(headView);
		LinearLayout showView = (LinearLayout) View.inflate(this,
				R.layout.show, null);
		AbsListView.LayoutParams lps = new AbsListView.LayoutParams(
				new LayoutParams(AbsListView.LayoutParams.MATCH_PARENT,
						(int) (height * 0.10)));
		showView.setLayoutParams(lps);
		listView.addHeaderView(showView);
		LinearLayout navView = (LinearLayout) View.inflate(this, R.layout.nav,
				null);
		AbsListView.LayoutParams lpn = new AbsListView.LayoutParams(
				new LayoutParams(width, (int) (height * 0.11)));
		navView.setLayoutParams(lpn);
		radioGroup = (RadioGroup) navView.findViewById(R.id.radioGroup);
		radioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {

			@Override
			public void onCheckedChanged(RadioGroup group, int checkedId) {
				// TODO Auto-generated method stub
				if (checkedId == R.id.rb1) {
					adapter = new SimpleBaseAdapter(MainActivity.this,
							getData(), R.layout.item, new String[] { "icon",
									"content" }, new int[] { R.id.icon,
									R.id.content }, null, null, 0);
				} else if (checkedId == R.id.rb2) {
					adapter = new SimpleBaseAdapter(MainActivity.this, null,
							R.layout.webview, null, null,
							"http://www.sina.com.cn", R.id.webView, 1);
				}
				listView.setAdapter(adapter);
			}
		});
		listView.addHeaderView(navView);

	}

可以看到,ListView通过三次addHeadView来添加View操作,并设置每个view的LayoutParams才能在ListView中正确显示。
标题样式：

自定义Adapter适配ListView

我们需要知道,根据选择不同RadioButton的结果,ListView得加载不同类型的数据,所以需要自定义适配器了。
自定义适配器属性以及构造方法代码如下:

/*
 * 注意:此处实现的适配器根据 dataType传递的参数,选择加载的数据类型
 */
public class SimpleBaseAdapter extends BaseAdapter {
	private Context context;
	// 数据集合
	private List<Map<string object="">> mlist;
	// 解析布局文件
	private Integer resourceId;
	// map集合中存储的key的name集合
	private String[] keyName;
	// 布局文件中对应的view的id集合
	private int[] viewId;
	// webView加载的url
	private String url;
	// webView组件的id
	private Integer webViewId;
	// 数据类型: 0代表解析 item.xml类型数据; 1代表解析webview.xml类型数据
	private int dataType;

	public SimpleBaseAdapter(Context context, List<Map<string object="">> mlist,
			Integer resourceId, String[] keyName, int[] viewId, String url,
			Integer webViewId, int dataType) {
		super();
		this.context = context;
		this.mlist = mlist;
		this.resourceId = resourceId;
		this.keyName = keyName;
		this.viewId = viewId;
		this.url = url;
		this.webViewId = webViewId;
		this.dataType = dataType;
	}
</string></string>

在这里我添加了dataType作为开关来选择加载哪种类型的数据,第一种类型为常用类型,和SimpleAdapter加载数据类似,但是第二种就是加载webView了,所以需要传递加载的webViewId,以及加载的url.同时可以看到,ListView加载webView时刻，我设置ListView的数据项只有一项,代码如下:

	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return dataType == 0 ? mlist.size() : 1;
	}

最后再看看最关键的getView方法吧!代码如下:

@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		// TODO Auto-generated method stub
		View root = null;
		AbsListView.LayoutParams lp = null;
		if (convertView == null) {
			root = View.inflate(context, resourceId, null);
		} else {
			root = convertView;
		}
		if (dataType == 0) {
			lp = new AbsListView.LayoutParams(new AbsListView.LayoutParams(-1,
					180));
			Map<string object=""> data = mlist.get(position);
			for (int i = 0; i < keyName.length; i++) {
				View view = root.findViewById(viewId[i]);
				if (view instanceof TextView) {
					((TextView) view).setText(data.get(keyName[i]).toString());
				} else if (view instanceof ImageView) {
					Object value = data.get(keyName[i]);
					Integer intValue = null;
					if (value instanceof Integer) {
						intValue = (Integer) value;
					} else if (value instanceof String) {
						intValue = Integer.valueOf(value.toString());
					}
					if (intValue != null) {
						((ImageView) view).setBackgroundResource(intValue);
					}
				}
			}
		} else if (dataType == 1) {
			lp = new AbsListView.LayoutParams(new AbsListView.LayoutParams(-1,
					-1));
			WebView webView = (WebView) root.findViewById(webViewId);
			WebSettings setting = webView.getSettings();
			setting.setJavaScriptEnabled(true);
			webView.setWebChromeClient(new WebChromeClient());
			webView.setWebViewClient(new WebViewClient());
			webView.loadUrl(url);
		}
		root.setLayoutParams(lp);
		return root;
	}
</string>

好吧，其实你会发现和SimpleAdapter中的判断类似,只是多了一种数据类型加载判断而已.是的，都是一些基础的应用。而且里面我没有用装逼的ViewHolder来提高性能。哈哈，看完之后是不是感觉很简单咧！
     终于分享完了，发现我自己也收获了不少东西啊。仔细看完，你会发现根本没有多少有难度的东西，只是你没有不实践罢了。有好多东西只要知道了思路，获取我们都会觉得那不就很简单了吗？ 其实不然，只有当你真正去实践了，才发现里面的UI，里面遇到的各种问题，才是你能快速成长的经验啊！哈哈，原谅我这菜鸟又在心灵鸡汤了。最后，欢迎大家和我一起学习讨论，一起提高！