Android 利用ListView制作带竖线的多彩表格

展开全文

/********************************************************************************************
* author：conowen@大钟
* E-mail：conowen@hotmail.com
* http://blog.csdn.net/conowen
* 注：本文为原创，仅作为学习交流使用，转载请标明作者及出处。

********************************************************************************************/

1、listview与GridView

其实Android本身是有表格控件（GridView）的，但是GridView的每一列的宽度被限定为一样宽，有时设计表格时，列宽不可能为同一宽度，所有可以用ListView控件去实现表格。

2、设计思路：

listview的每一列都是由一个textview去实现，表格的竖线可以通过view控件来绘制。listview每一列的颜色相互不同可以通过复写Adapter的类，然后复写getview方法具体去实现。

3、先看一下效果图：

4、数据库操作部分可以看我之前的博文：http://blog.csdn.net/conowen/article/details/7306545

本文主要在于竖线的绘制与getview方法的复写。

代码的目录结构如下图所示：

竖线的绘制：

在ListView的布局文件中，每隔一个TextView，就增加一个<View>控件。就是绘制一条竖线的意思。可以设置表格竖线的长度，宽度，颜色等等。

颜色的交互：

首先要知道listview的工作原理，每次得到一个item，listview都会通过getview来绘制一个item，在getview方法中，可以设置这个item的各种属性，如颜色，布局等等。

1public View getView(final int position, View convertView, ViewGroup parent){
2 
3//第一个参数position为listview的item序号，每个item的序号都是不同的。
4 
5//第二个参数convertView为View的缓存，当listview的item过多时，拖动会遮住一部分item，被遮住的item的view就是convertView保存着。
6 
7// 第三个参数parent表示是一个ViewGroup（view组）
8 
9}

5、详细代码：

01/*author:conowen 
02 * date:2012.4.2 
03 * GridActivity 
04 */ 
05package com.conowen.grid;  
06   
07import android.app.Activity;  
08import android.database.Cursor;  
09import android.database.sqlite.SQLiteDatabase;  
10import android.os.Bundle;  
11import android.widget.ListAdapter;  
12import android.widget.ListView;  
13   
14public class GridActivity extends Activity {  
15   
16    SQLiteDatabase sqldb;  
17    public String DB_NAME = "DB.sqlite";  
18    public String DB_TABLE = "num";  
19    public int DB_VERSION = 1;  
20    final DataHelper helper = new DataHelper(this, DB_NAME, null, DB_VERSION);  
21    // DbHelper类在DbHelper.java文件里面创建的  
22    ListView lv;  
23   
24    @Override 
25    public void onCreate(Bundle savedInstanceState) {  
26        // TODO Auto-generated method stub  
27        super.onCreate(savedInstanceState);  
28        setContentView(R.layout.main);  
29        sqldb = helper.getWritableDatabase();  
30        lv = (ListView) findViewById(R.id.lv);  
31        updatelistview();  
32    }  
33   
34    // 更新listview  
35    public void updatelistview() {  
36   
37        //  
38        Cursor cr = sqldb.query("JobChecker", null, null, null, null, null,  
39                null);  
40   
41        String id = cr.getColumnName(0);// 获取第1列  
42        String job = cr.getColumnName(2);// 获取第3列  
43        String address = cr.getColumnName(4);// 获取第5列  
44        String student = cr.getColumnName(5);// 获取第6列  
45        String[] ColumnNames = { id, job, address, student };  
46   
47        ListAdapter adapter = new MySimpleCursorAdapter(this,  
48                R.layout.listviewlayout, cr, ColumnNames, new int[] { R.id.id,  
49                        R.id.job, R.id.addr, R.id.student });  
50        // layout为listView的布局文件，包括三个TextView，用来显示三个列名所对应的值  
51        // ColumnNames为数据库的表的列名  
52        // 最后一个参数是int[]类型的，为view类型的id，用来显示ColumnNames列名所对应的值。view的类型为TextView  
53        lv.setAdapter(adapter);  
54   
55    }  
56   
57    @Override 
58    protected void onDestroy() {// 关闭数据库  
59        // TODO Auto-generated method stub  
60        super.onDestroy();  
61        if (helper != null) {  
62            helper.close();  
63        }  
64    }  
65   
66}

01/*author:conowen 
02 * date:2012.4.2 
03 * MySimpleCursorAdapter 
04 */ 
05package com.conowen.grid;  
06   
07import android.content.Context;  
08import android.database.Cursor;  
09import android.graphics.Color;  
10import android.view.View;  
11import android.view.ViewGroup;  
12import android.widget.SimpleCursorAdapter;  
13   
14public class MySimpleCursorAdapter extends SimpleCursorAdapter {  
15   
16    public MySimpleCursorAdapter(Context context, int layout, Cursor c,  
17            String[] from, int[] to) {  
18        super(context, layout, c, from, to);  
19        // TODO Auto-generated constructor stub  
20   
21    }  
22   
23    @Override 
24    public View getView(final int position, View convertView, ViewGroup parent) {  
25        // TODO Auto-generated method stub  
26        // listview每次得到一个item，都要view去绘制，通过getView方法得到view  
27        // position为item的序号  
28        View view = null;  
29        if (convertView != null) {  
30            view = convertView;  
31            // 使用缓存的view,节约内存  
32            // 当listview的item过多时，拖动会遮住一部分item，被遮住的item的view就是convertView保存着。  
33            // 当滚动条回到之前被遮住的item时，直接使用convertView，而不必再去new view()  
34   
35        } else {  
36            view = super.getView(position, convertView, parent);  
37   
38        }  
39   
40        int[] colors = { Color.WHITE, Color.rgb(219, 238, 244) };//RGB颜色  
41   
42        view.setBackgroundColor(colors[position % 2]);// 每隔item之间颜色不同  
43   
44        return super.getView(position, view, parent);  
45    }  
46   
47}

01/*author:conowen 
02 * date:2012.4.2 
03 * DataHelper 
04 */ 
05package com.conowen.grid;  
06   
07import android.content.Context;  
08import android.database.sqlite.SQLiteDatabase;  
09import android.database.sqlite.SQLiteDatabase.CursorFactory;  
10import android.database.sqlite.SQLiteOpenHelper;  
11   
12public class DataHelper extends SQLiteOpenHelper {  
13   
14    @Override 
15    public synchronized void close() {  
16        // TODO Auto-generated method stub  
17        super.close();  
18    }  
19   
20    public DataHelper(Context context, String name, CursorFactory factory,  
21            int version) {  
22        super(context, name, factory, version);  
23        // TODO Auto-generated constructor stub  
24   
25    }  
26   
27    @Override 
28    public void onCreate(SQLiteDatabase db) {  
29        // TODO Auto-generated method stub  
30   
31        String sql = "CREATE  TABLE JobChecker (_id INTEGER PRIMARY KEY , department VARCHAR, job VARCHAR,teacher VARCHAR,address VARCHAR,student VARCHAR,isworking VARCHAR)";  
32        db.execSQL(sql);  
33   
34    }  
35   
36    @Override 
37    public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {  
38        // TODO Auto-generated method stub  
39   
40    }  
41   
42}

main.xml

01<?xml version="1.0" encoding="utf-8"?>  
02<LinearLayout xmlns:android="http://schemas./apk/res/android" 
03    android:layout_width="fill_parent" 
04    android:layout_height="fill_parent" 
05    android:orientation="vertical" >  
06   
07    <LinearLayout 
08        xmlns:android="http://schemas./apk/res/android" 
09        android:layout_width="fill_parent" 
10        android:layout_height="wrap_content" 
11        android:orientation="horizontal" >  
12   
13        <TextView 
14            android:layout_width="40dip" 
15            android:layout_height="30dp" 
16            android:text="序号" 
17            android:textSize="20sp" />  
18   
19        <TextView 
20            android:id="@+id/job" 
21            android:layout_width="200dip" 
22            android:layout_height="30dp" 
23            android:text="岗位名称" 
24            android:textSize="20sp" />  
25   
26        <TextView 
27            android:id="@+id/addr" 
28            android:layout_width="150dip" 
29            android:layout_height="30dp" 
30            android:text="详细地点" 
31            android:textSize="20sp" />  
32   
33        <TextView 
34            android:id="@+id/student" 
35            android:layout_width="100dip" 
36            android:layout_height="30dp" 
37            android:text="工作学生" 
38            android:textSize="20sp" />  
39   
40        <TextView 
41            android:id="@+id/isworking" 
42            android:layout_width="80dip" 
43            android:layout_height="30dp" 
44            android:text="备注" 
45            android:textSize="20sp" />  
46    </LinearLayout>  
47   
48    <ListView 
49        android:id="@+id/lv" 
50        android:layout_width="fill_parent" 
51        android:layout_height="wrap_content" >  
52    </ListView>  
53   
54</LinearLayout>

listviewlayout.xml

01<LinearLayout xmlns:android="http://schemas./apk/res/android" 
02    android:layout_width="fill_parent" 
03    android:layout_height="fill_parent" 
04    android:orientation="horizontal" >  
05   
06    <View 
07        android:layout_width="0.5px" 
08        android:layout_height="fill_parent" 
09        android:background="#B8B8B8" 
10        android:visibility="visible" />  
11   
12    <TextView 
13        android:id="@+id/id" 
14        android:layout_width="40dip" 
15        android:layout_height="55dip" 
16        android:textColor="#CD3700" 
17        android:textSize="20sp" />  
18   
19    <View 
20        android:layout_width="0.5px" 
21        android:layout_height="fill_parent" 
22        android:background="#B8B8B8" 
23        android:visibility="visible" />  
24   
25    <TextView 
26        android:id="@+id/job" 
27        android:layout_width="200dip" 
28        android:layout_height="wrap_content" 
29        android:textColor="#000000" 
30        android:textSize="17sp" />  
31   
32    <View 
33        android:layout_width="0.5px" 
34        android:layout_height="fill_parent" 
35        android:background="#B8B8B8" 
36        android:visibility="visible" />  
37   
38    <TextView 
39        android:id="@+id/addr" 
40        android:layout_width="150dip" 
41        android:layout_height="wrap_content" 
42        android:textColor="#000000" 
43        android:textSize="17sp" />  
44   
45    <View 
46        android:layout_width="0.5px" 
47        android:layout_height="fill_parent" 
48        android:background="#B8B8B8" 
49        android:visibility="visible" />  
50   
51    <TextView 
52        android:id="@+id/student" 
53        android:layout_width="100dip" 
54        android:layout_height="wrap_content" 
55        android:textColor="#000000" 
56        android:textSize="20sp" />  
57   
58    <View 
59        android:layout_width="0.5px" 
60        android:layout_height="fill_parent" 
61        android:background="#B8B8B8" 
62        android:visibility="visible" />  
63   
64   
65   
66   
67</LinearLayout>