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的各種屬性,如顏色,布局等等。
public View getView(final int position, View convertView, ViewGroup parent){//第一個參數position為listview的item序號,每個item的序號都是不同的。
//第二個參數convertView為View的緩存,當listview的item過多時,拖動會遮住一部分item,被遮住的item的view就是convertView保存著。
// 第三個參數parent表示是一個ViewGroup(view組)
}</pre>5、詳細代碼:
/*author:conowen* date:2012.4.2 * GridActivity */ package com.conowen.grid; import android.app.Activity; import android.database.Cursor; import android.database.sqlite.SQLiteDatabase; import android.os.Bundle; import android.widget.ListAdapter; import android.widget.ListView; public class GridActivity extends Activity { SQLiteDatabase sqldb; public String DB_NAME = "DB.sqlite"; public String DB_TABLE = "num"; public int DB_VERSION = 1; final DataHelper helper = new DataHelper(this, DB_NAME, null, DB_VERSION); // DbHelper類在DbHelper.java文件里面創建的 ListView lv; @Override public void onCreate(Bundle savedInstanceState) { // TODO Auto-generated method stub super.onCreate(savedInstanceState); setContentView(R.layout.main); sqldb = helper.getWritableDatabase(); lv = (ListView) findViewById(R.id.lv); updatelistview(); } // 更新listview public void updatelistview() { // Cursor cr = sqldb.query("JobChecker", null, null, null, null, null, null); String id = cr.getColumnName(0);// 獲取第1列 String job = cr.getColumnName(2);// 獲取第3列 String address = cr.getColumnName(4);// 獲取第5列 String student = cr.getColumnName(5);// 獲取第6列 String[] ColumnNames = { id, job, address, student }; ListAdapter adapter = new MySimpleCursorAdapter(this, R.layout.listviewlayout, cr, ColumnNames, new int[] { R.id.id, R.id.job, R.id.addr, R.id.student }); // layout為listView的布局文件,包括三個TextView,用來顯示三個列名所對應的值 // ColumnNames為數據庫的表的列名 // 最后一個參數是int[]類型的,為view類型的id,用來顯示ColumnNames列名所對應的值。view的類型為TextView lv.setAdapter(adapter); } @Override protected void onDestroy() {// 關閉數據庫 // TODO Auto-generated method stub super.onDestroy(); if (helper != null) { helper.close(); } } } </pre><pre class="brush:java; toolbar: true; auto-links: false;"> /*author:conowen * date:2012.4.2 * MySimpleCursorAdapter */ package com.conowen.grid; import android.content.Context; import android.database.Cursor; import android.graphics.Color; import android.view.View; import android.view.ViewGroup; import android.widget.SimpleCursorAdapter; public class MySimpleCursorAdapter extends SimpleCursorAdapter { public MySimpleCursorAdapter(Context context, int layout, Cursor c, String[] from, int[] to) { super(context, layout, c, from, to); // TODO Auto-generated constructor stub } @Override public View getView(final int position, View convertView, ViewGroup parent) { // TODO Auto-generated method stub // listview每次得到一個item,都要view去繪制,通過getView方法得到view // position為item的序號 View view = null; if (convertView != null) { view = convertView; // 使用緩存的view,節約內存 // 當listview的item過多時,拖動會遮住一部分item,被遮住的item的view就是convertView保存著。 // 當滾動條回到之前被遮住的item時,直接使用convertView,而不必再去new view() } else { view = super.getView(position, convertView, parent); } int[] colors = { Color.WHITE, Color.rgb(219, 238, 244) };//RGB顏色 view.setBackgroundColor(colors[position % 2]);// 每隔item之間顏色不同 return super.getView(position, view, parent); } } </pre><pre class="brush:java; toolbar: true; auto-links: false;"> /*author:conowen * date:2012.4.2 * DataHelper */ package com.conowen.grid; import android.content.Context; import android.database.sqlite.SQLiteDatabase; import android.database.sqlite.SQLiteDatabase.CursorFactory; import android.database.sqlite.SQLiteOpenHelper; public class DataHelper extends SQLiteOpenHelper { @Override public synchronized void close() { // TODO Auto-generated method stub super.close(); } public DataHelper(Context context, String name, CursorFactory factory, int version) { super(context, name, factory, version); // TODO Auto-generated constructor stub } @Override public void onCreate(SQLiteDatabase db) { // TODO Auto-generated method stub String sql = "CREATE TABLE JobChecker (_id INTEGER PRIMARY KEY , department VARCHAR, job VARCHAR,teacher VARCHAR,address VARCHAR,student VARCHAR,isworking VARCHAR)"; db.execSQL(sql); } @Override public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion) { // TODO Auto-generated method stub } } </pre><span style="color:#3333ff;font-size:24px;">main.xml<pre class="brush:xml; toolbar: true; auto-links: false;"><?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" ><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <TextView android:layout_width="40dip" android:layout_height="30dp" android:text="序號" android:textSize="20sp" /> <TextView android:id="@+id/job" android:layout_width="200dip" android:layout_height="30dp" android:text="崗位名稱" android:textSize="20sp" /> <TextView android:id="@+id/addr" android:layout_width="150dip" android:layout_height="30dp" android:text="詳細地點" android:textSize="20sp" /> <TextView android:id="@+id/student" android:layout_width="100dip" android:layout_height="30dp" android:text="工作學生" android:textSize="20sp" /> <TextView android:id="@+id/isworking" android:layout_width="80dip" android:layout_height="30dp" android:text="備注" android:textSize="20sp" /> </LinearLayout> <ListView android:id="@+id/lv" android:layout_width="fill_parent" android:layout_height="wrap_content" > </ListView>
</LinearLayout> </pre></span>listviewlayout.xml
<LinearLayout xmlns:android=" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" ><View android:layout_width="0.5px" android:layout_height="fill_parent" android:background="#B8B8B8" android:visibility="visible" /> <TextView android:id="@+id/id" android:layout_width="40dip" android:layout_height="55dip" android:textColor="#CD3700" android:textSize="20sp" /> <View android:layout_width="0.5px" android:layout_height="fill_parent" android:background="#B8B8B8" android:visibility="visible" /> <TextView android:id="@+id/job" android:layout_width="200dip" android:layout_height="wrap_content" android:textColor="#000000" android:textSize="17sp" /> <View android:layout_width="0.5px" android:layout_height="fill_parent" android:background="#B8B8B8" android:visibility="visible" /> <TextView android:id="@+id/addr" android:layout_width="150dip" android:layout_height="wrap_content" android:textColor="#000000" android:textSize="17sp" /> <View android:layout_width="0.5px" android:layout_height="fill_parent" android:background="#B8B8B8" android:visibility="visible" /> <TextView android:id="@+id/student" android:layout_width="100dip" android:layout_height="wrap_content" android:textColor="#000000" android:textSize="20sp" /> <View android:layout_width="0.5px" android:layout_height="fill_parent" android:background="#B8B8B8" android:visibility="visible" /> </LinearLayout> </pre></span>