您的位置:首页 > 移动开发 > Android开发

从零开始学android<ListView数据列表显示组件.二十一.>

2014-08-16 14:33 816 查看
与滚动视图(ScrollView)类似的还有一种列表组件(ListView),可以将多个组件加入到ListView之中以达到组件的滚动显示效果,ListView组件本身也有对应的ListView类支持,可以通过操作ListView类以完成对此组组件的操作,ListView类的继承结构如下所示:
java.lang.Object
↳ android.view.View
↳ android.view.ViewGroup
↳ android.widget.AdapterView<T extends android.widget.Adapter>
↳ android.widget.AbsListView
↳ android.widget.ListView

public ListView(Context context)
构造
创建ListView类的实例化对象
public void setAdapter(ListAdapter adapter)
普通
设置显示的数据
public ListAdapter getAdapter()
普通
返回ListAdapter
public void setOnItemSelectedListener (AdapterView.OnItemSelectedListener listener)
普通
当选项选中时触发此事件
要进行ListView数据的显示就必须使用一个Adapter数据的容器来存储和管理数据

Known Indirect Subclasses(已知的子类)

ArrayAdapter<T>, BaseAdapter, CursorAdapter, HeaderViewListAdapter, ListAdapter, ResourceCursorAdapter, SimpleAdapter, SimpleCursorAdapter,SpinnerAdapter, WrapperListAdapter
我们比较常用的是 ArrayAdapter<T>,BaseAdapter和simpleAdapter
今天我们就来学习下这几种adapter与listView的使用

首先来看下ArrayAdapter<T>
他支持一下集中构造方法
ArrayAdapter<T>(context, textViewResourceId) 传入一个上下文对象,显示方式

ArrayAdapter<T>(context, resource, textViewResourceId)传入一个上下文对象,资源ID,显示方式
ArrayAdapter<T>(context, textViewResourceId, objects)传入一个上下文对象,显示格式,和显示数据(可以为object数组或者object 集合)

ArrayAdapter<T>(context, resource, textViewResourceId, objects)传入一个上下文对象,资源ID,显示格式,和显示数据(可以为object数组或者object 集合)

下面使用前面做过的列子类进行一下简单的讲解
XMl文件
<span style="font-size:18px;"><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=".MainActivity" >

<ListView
android:id="@+id/listview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>

</RelativeLayout>
</span>


JAVA文件
<span style="font-size:18px;">package com.example.listview;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class MainActivity extends Activity {
private ListView listView;
private final String data[] = { "昵称:风飞雪未扬", "性别:男", "年龄:22岁", "学校:河南大学",
"系别 :教育科学学院", "邮箱:fangjaylong@gmail.com" };

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.setContentView(R.layout.activity_main);
listView = (ListView)this.findViewById(R.id.listview);
listView.setAdapter(new ArrayAdapter<String>(MainActivity.this,
android.R.layout.simple_list_item_1, data));
listView.setOnItemClickListener(new OnItemClickListener() {

@Override
public void onItemClick(AdapterView<?> parents, View view, int position,
long id) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this, "您选择了"+data[position], Toast.LENGTH_SHORT).show();
}
});

}

}
</span>


显示效果



下面来介绍下SimpleAdapter的使用

使用simpleAdapter来实现带标题的LIstVIew效果

构造方法如下:

SimpleAdapter (Context context, List<? extends Map<String, ?>> data, int resource, String[] from, int[] to)

基本的使用方法会在代码中给大家于详细的注释
Xml文件的配置

<span style="font-size:18px;"><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=".MainActivity" >

<ListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" >

</ListView>

</RelativeLayout></span>


JAVA文件
<span style="font-size:18px;">package com.example.listview2;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.Toast;

public class MainActivity extends Activity {
private final String Title[] = { "昵称:", "性别:", "年龄:", "学校:", "系别 :", "邮箱:" };// 标题数据
private final String contents[] = { "风飞雪未扬", "男", "22岁", "河南大学", "教育科学学院",// 内容数据
"fangjaylong@gmail.com" };
private ListView listView = null;
ArrayList<Map<String, String>> list = null;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.setContentView(R.layout.activity_main);
listView = (ListView) this.findViewById(R.id.listview);
list = new ArrayList<Map<String, String>>();// 实例化list
for (int i = 0; i < Title.length; i++) {// for循环向list中增加数据
Map<String, String> map = new HashMap<String, String>();// 创建map对象
map.put("title", Title[i]);
map.put("content", contents[i]);
list.add(map);// 将map数据增加到list中去
}
// 为ListView设置adapter
listView.setAdapter(new SimpleAdapter(MainActivity.this, // 上下文对象
list,// List数据
android.R.layout.simple_list_item_2,// ListView中数据的显示方式
new String[] { "title", "content" },// 此处的String数据必须与List当中的key值对应
new int[] { android.R.id.text1, android.R.id.text2 }));// android.R.layout.simple_list_item_2中提供的文本控件
// android. R.id.text1,android. R.id.text2 这两个属性是由
// android.R.layout.simple_list_item_2这个系统布局提供的,大家可以尝试里面其他控件的使用
//		为listView中的数据项设置单击事件
listView.setOnItemClickListener(new OnItemClickListener() {

@Override
public void onItemClick(AdapterView<?> parent, View view,
int psition, long id) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this, "您选择了" +Title[psition]+ contents[psition],
Toast.LENGTH_SHORT).show();//土司提示
}
});

}

}
</span>
效果图:



上面使用的是android自带的显示效果,用户也可以根据自己的需要定制合适的显示效果
下面我们通过自定义的Layout实现图文混排的效果



xml文件

<span style="font-size:18px;"><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=".MainActivity" >

<ListView
android:id="@+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true" >

</ListView>

</RelativeLayout></span>


自定义xml文件

<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/imageView1"
android:textAppearance="?android:attr/textAppearanceMedium" />

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/imageView1"
android:layout_alignLeft="@+id/textView1" />

</RelativeLayout>
</span>


JAVA文件配置

<span style="font-size:18px;">package com.example.lsitview3;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.Toast;

public class MainActivity extends Activity {

private final String Title[] = { "昵称:", "性别:", "年龄:", "学校:", "系别 :", "邮箱:" };// 标题数据
private final String contents[] = { "风飞雪未扬", "男", "22岁", "河南大学", "教育科学学院",// 内容数据
"fangjaylong@gmail.com" };
private ListView listView = null;
private int image[] = { R.drawable.a1, R.drawable.a2, R.drawable.a3,
R.drawable.a4, R.drawable.a5, R.drawable.a6 };// 设置图片数据
ArrayList<Map<String, Object>> list = null;// 将第二个参数设置为Object 便于接收其他类型的参数

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.setContentView(R.layout.activity_main);
listView = (ListView) this.findViewById(R.id.listView1);
list = new ArrayList<Map<String, Object>>();// 实例化list
for (int i = 0; i < Title.length; i++) {// for循环向list中增加数据
Map<String, Object> map = new HashMap<String, Object>();// 创建map对象
map.put("image", image[i]);
map.put("title", Title[i]);
map.put("content", contents[i]);
list.add(map);// 将map数据增加到list中去
}
// 为ListView设置adapter
listView.setAdapter(new SimpleAdapter(MainActivity.this, // 上下文对象
list,// List数据
R.layout.custom,// ListView中数据的显示方式
new String[] { "image","title", "content" },// 此处的String数据必须与List当中的key值对应
new int[] { R.id.imageView1, R.id.textView1,R.id.textView2 }));// 自定义布局的控件id
// 为listView中的数据项设置单击事件
listView.setOnItemClickListener(new OnItemClickListener() {

@Override
public void onItemClick(AdapterView<?> parent, View view,
int psition, long id) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
"您选择了" + Title[psition] + contents[psition],
Toast.LENGTH_SHORT).show();// 土司提示
}
});
}

}
</span>


最终效果



BaseAdapter的使用

Known Direct Subclasses(已知子类)

ArrayAdapter<T>, CursorAdapter, SimpleAdapter,ArrayAdapter<T>

由继承关系可见SimpleAdapter,ArrayAdapter<T>都是BaseAdapter的子类

使用BaseAdapter可以轻松实现对数据的显示操作和对数据其他特征的设置,接下来的列子我们局通过BaseAdapter来设置item的背景颜色

结构



xml文件配置

<span style="font-size:18px;"><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=".MainActivity" >

<ListView
android:id="@+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" >

</ListView>

</RelativeLayout>
</span>


自定义xml
<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#bed742"
>

<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="@drawable/a1" />

<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/imageView1"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium" />

<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@+id/imageView1"
android:layout_alignLeft="@+id/textView1"
android:text="TextView" />

</RelativeLayout>
</span>


JAVA文件的配置
<span style="font-size:18px;">package com.example.listview;

import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {
private ListView listView;
private Myadapter adapter;
private final String titles[] = { "昵称:", "性别:", "年龄:", "学校:", "系别 :", "邮箱:" };// 标题数据
private final String contents[] = { "风飞雪未扬", "男", "22岁", "河南大学", "教育科学学院",
"fangjaylong@gmail.com" };// 内容数据

private int images[] = { R.drawable.a1, R.drawable.a2, R.drawable.a3,
R.drawable.a4, R.drawable.a5, R.drawable.a6 };// 图片数据

@Override
protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
listView = (ListView) this.findViewById(R.id.listView1);
adapter = new Myadapter(this);
listView.setAdapter(adapter);
// 设置选项的监听事件
listView.setOnItemClickListener(new OnItemClickListener() {

@Override
public void onItemClick(AdapterView<?> arg0, View view,
int position, long id) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this,
"你选择了:" + titles[position] + contents[position],
Toast.LENGTH_LONG).show();// 土司提示

}
});
}

class Myadapter extends BaseAdapter {
// 定义颜色,这里定义了两种交替显示,读者可以定义任意颜色
private int color[] = { Color.CYAN, Color.GREEN };

private Context myContext;

// 构造方法传递Context对象,也可以使用 getApplicationContext()来获取
public Myadapter(Context myContext) {

this.myContext = myContext;
}

@Override
public int getCount() {
// TODO Auto-generated method stub
return titles.length;// 返回列表选项的个数
}

@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return position;// 返回当前位置
}

@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return position;// 返回选中ID
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
// 获得颜色数组的id 0或1
int colorId = position % color.length;

// 通过缓存convertView,这种利用缓存contentView的方式可以判断如果缓存中不存在View才创建View,如果已经存在可以利用缓存中的View,提升了性能
if (convertView == null) {
// 获得View对象
convertView = LayoutInflater.from(myContext).inflate(
R.layout.my_adapter_view, null);
}
// 获得组件
ImageView image = (ImageView) convertView
.findViewById(R.id.imageView1);
TextView title = (TextView) convertView
.findViewById(R.id.textView1);
TextView content = (TextView) convertView
.findViewById(R.id.textView2);
// 设置组件信息
image.setImageResource(images[position]);
title.setText(titles[position]);
content.setText(contents[position]);
convertView.setBackgroundColor(color[colorId]);
// 返回装载后的view
return convertView;
}

}
}
</span>


最终效果



这样listView与adapter就基本上讲完了,在开发一般只会用到这么多,希望读者好好掌握
以上的所有代码基本都有注释,看不明白的可以在下方留言,我会在第一时间进行回复

下节预报:
SeekBar拖动条组件
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: