Android学习笔记(20)————利用ListView制作带竖线的多彩表格

http://blog.csdn.net/conowen/article/details/7421805

/********************************************************************************************
 * 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的各种属性，如颜色，布局等等。

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

5、详细代码：

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

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

1. /*author:conowen
2. * date:2012.4.2
3. * DataHelper
4. */
5. package com.conowen.grid;
6. import android.content.Context;
7. import android.database.sqlite.SQLiteDatabase;
8. import android.database.sqlite.SQLiteDatabase.CursorFactory;
9. import android.database.sqlite.SQLiteOpenHelper;
10. public class DataHelper extends SQLiteOpenHelper {
11. @Override
12. public synchronized void close() {
13. // TODO Auto-generated method stub
14. super.close();
15. }
16. public DataHelper(Context context, String name, CursorFactory factory,
17. int version) {
18. super(context, name, factory, version);
19. // TODO Auto-generated constructor stub
20. }
21. @Override
22. public void onCreate(SQLiteDatabase db) {
23. // TODO Auto-generated method stub
24. String sql = "CREATE  TABLE JobChecker (_id INTEGER PRIMARY KEY , department VARCHAR, job VARCHAR,teacher VARCHAR,address VARCHAR,student VARCHAR,isworking VARCHAR)";
25. db.execSQL(sql);
26. }
27. @Override
28. public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) {
29. // TODO Auto-generated method stub
30. }
31. }

main.xml

1. <?xml version="1.0" encoding="utf-8"?>
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
3. android:layout_width="fill_parent"
4. android:layout_height="fill_parent"
5. android:orientation="vertical" >
6. <LinearLayout
7. xmlns:android="http://schemas.android.com/apk/res/android"
8. android:layout_width="fill_parent"
9. android:layout_height="wrap_content"
10. android:orientation="horizontal" >
11. <TextView
12. android:layout_width="40dip"
13. android:layout_height="30dp"
14. android:text="序号"
15. android:textSize="20sp" />
16. <TextView
17. android:id="@+id/job"
18. android:layout_width="200dip"
19. android:layout_height="30dp"
20. android:text="岗位名称"
21. android:textSize="20sp" />
22. <TextView
23. android:id="@+id/addr"
24. android:layout_width="150dip"
25. android:layout_height="30dp"
26. android:text="详细地点"
27. android:textSize="20sp" />
28. <TextView
29. android:id="@+id/student"
30. android:layout_width="100dip"
31. android:layout_height="30dp"
32. android:text="工作学生"
33. android:textSize="20sp" />
34. <TextView
35. android:id="@+id/isworking"
36. android:layout_width="80dip"
37. android:layout_height="30dp"
38. android:text="备注"
39. android:textSize="20sp" />
40. </LinearLayout>
41. <ListView
42. android:id="@+id/lv"
43. android:layout_width="fill_parent"
44. android:layout_height="wrap_content" >
45. </ListView>
46. </LinearLayout>

listviewlayout.xml

1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
2. android:layout_width="fill_parent"
3. android:layout_height="fill_parent"
4. android:orientation="horizontal" >
5. <View
6. android:layout_width="0.5px"
7. android:layout_height="fill_parent"
8. android:background="#B8B8B8"
9. android:visibility="visible" />
10. <TextView
11. android:id="@+id/id"
12. android:layout_width="40dip"
13. android:layout_height="55dip"
14. android:textColor="#CD3700"
15. android:textSize="20sp" />
16. <View
17. android:layout_width="0.5px"
18. android:layout_height="fill_parent"
19. android:background="#B8B8B8"
20. android:visibility="visible" />
21. <TextView
22. android:id="@+id/job"
23. android:layout_width="200dip"
24. android:layout_height="wrap_content"
25. android:textColor="#000000"
26. android:textSize="17sp" />
27. <View
28. android:layout_width="0.5px"
29. android:layout_height="fill_parent"
30. android:background="#B8B8B8"
31. android:visibility="visible" />
32. <TextView
33. android:id="@+id/addr"
34. android:layout_width="150dip"
35. android:layout_height="wrap_content"
36. android:textColor="#000000"
37. android:textSize="17sp" />
38. <View
39. android:layout_width="0.5px"
40. android:layout_height="fill_parent"
41. android:background="#B8B8B8"
42. android:visibility="visible" />
43. <TextView
44. android:id="@+id/student"
45. android:layout_width="100dip"
46. android:layout_height="wrap_content"
47. android:textColor="#000000"
48. android:textSize="20sp" />
49. <View
50. android:layout_width="0.5px"
51. android:layout_height="fill_parent"
52. android:background="#B8B8B8"
53. android:visibility="visible" />
54. </LinearLayout>