AndroidきらびやかなListViewテーブル効果の実現
概要:
ビジネスシステムでは、テーブルコントロールを使用してデータを表示することがよくありますが、Androidが持っているListViewコントロール自体は、より美しいテーブル効果を実現することはできませんが、他の方法でListViewテーブルをよりきれいにすることができます.一緒に検討しましょう.
まず、次の2つの図を見てみましょう.
図(一)
図(二)
明らかに、図1は簡潔で、図2は明るく輝いているように見えます.ユーザー体験の観点から言えば、図2のインタフェースの効果は明らかに図1より良いですが、枠はどのように追加されていますか?ListViewのadapter SimapleAdapterを使用しています.上の図からListViewの各行には多くの項目が含まれています.ListViewのデータ内容は、ListViewを構築し、各項目を1つのmapに設定することで実現できます.
ArrayList<HashMap<String, String>> mylist = newArrayList<HashMap<String, String>>();
HashMap<String, String> map1 = newHashMap<String, String>();
map1.put("Num" , "220503432" );
map1.put("Receive" , " " );
map1.put("Payway" , " " );
map1.put("TotalPrice" , "$98.30" );
map1.put("State" , " " );
map1.put("Date" , "2010-09-23" );
mylist.add(map1);
ListViewはデータを表示するコンテナに相当し、中の各行は受注情報であり、これらの行情報は別のXMLファイルで定義する必要があり、具体的な表の枠線もこのXMLファイルで実現されている.次に、リストビューでテーブルの縦線枠線をどのように実現するかを説明します.Androidでは、Viewはandroid線の基礎であり、ListViewの枠線はViewで実現されています.ListViewの内容はxmlファイルでListViewの内容をロードすることができます.TableLayoutも枠線が存在しません.では、以下はViewでxml文書に枠線を描きます.以下はListViewの枠線を実現するコアコードです.
<TableLayoutandroid:id= "@+id/a07_ls_rlo"
android:layout_width="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" >
<TableRow>
<View style="@style/view2" />
<TextView
style="@style/txtNolinkleft"
android:id="@+id/a07_ls_txtYF" />
<View style="@style/view2" />
<TextView
style="@style/txtNolinkright"
android:layout_width="80dip"
android:gravity="center"
android:id="@+id/a07_ls_txtXXSR" />
<View style="@style/view2" />
<TextView
style="@style/txtNolinkright"
android:layout_width="100dip"
android:gravity="center"
android:id="@+id/a07_ls_txtYNSE" />
<View style="@style/view2" />
<TextView
style="@style/txtNolinkright"
android:layout_width="80dip"
android:id="@+id/a07_ls_txtSNSE" />
<View style="@style/view2" />
<TextView
style="@style/txtNolinkleft"
android:layout_width="92dip"
android:gravity="center"
android:id="@+id/a07_ls_txtSBRQ" />
<View style="@style/view2" />
<TextView
style="@style/txtNolinkleft"
android:layout_width="92dip"
android:id="@+id/a07_ls_txtJNRQ" />
<View style="@style/view2" />
<TextView
style="@style/txtNolinkleft"
android:layout_width="80dip"
android:gravity="center"
android:id="@+id/a07_ls_txtSPDM" />
<View style="@style/view2" />
</TableRow>
</TableLayout>
データソースおよびListView各行の内容を定義したら、SimapleAdapterを使用してListView、データコンテンツ、各行の定義を関連付けることができます.コードは以下の通りです.
SpecialAdapter mSchedule = new SpecialAdapter( this ,mylist,R.layout.listview,
new String[]{ "Num" , "Receive" , "Payway" , "TotalPrice" , "State" , "Date" },
newint[]{R.id.a07_ls_txtNum,R.id.a07_ls_txtReceive,R.id.a07_ls_txtPayway,
R.id.a07_ls_txtTotalPrice,R.id.a07_ls_txtState,R.id.a07_ls_txtDate};
list.setAdapter(mSchedule);
上のコードのSpecialAdapterを見て、これは何ですか?SimpleAdapterじゃないの?以下、SpecialAdapterが何に使うのか説明します.
Androidレイアウトでは、基本的な5つのレイアウト方式には枠がありません.私たちは上のView方式で枠の効果を実現しました.通常、いくつかのビジネスシステムを作るとき、お客様はデータリストページに表の形式でデータを表示することを要求するほか、行のハイライトを選択したり、行の色を交互にしたりするなど、華やかな効果を要求しています.もちろんこれはユーザー体験にとって良いことです.この2つの効果の実現方法について説明します.
まず、選択した行のハイライトの効果を図(3)に示します.
図(三)
ハイライト効果は背景図を設定することによって実現され、実現されるコードは以下の通りである.
ListView list=(ListView) this .findViewById(R.id.listview);
Drawabledrawable = getResources().getDrawable(R.drawable.listview_hoverbg);
list.setSelector(drawable);
図(3)から分かるように、このリストは、前述のSpecial Adapterに関連して、SimpleAdapterクラスを継承し、Special Adapterは親クラスのgetViewメソッドを書き換え、パラメータpositionの判断によって単一の2行を区別する単一の2行の色の交互効果を実現している.リストセルの各viewの背景色を設定することで、行全体の背景色を設定する効果が得られます.コードは次のとおりです.
privateint[] colors = new int [] { 0x30FF0000 , 0x300000FF };
@Override
public View getView( int position, View convertView, ViewGroup parent) {
View view = super .getView(position, convertView, parent);
intcolorPos = position % colors.length;
if (colorPos== 1 )
view.setBackgroundColor(Color.argb(250 , 255 , 255 , 255 ));
else
view.setBackgroundColor(Color.argb(250 , 224 , 243 , 250 ));
return view;
}
SimpleAdapterは非常に有用なクラスであり、データソースアダプタだけでなく、各行の多くの情報を取得または設定することができます.例えば、各行のセルのコントロールやスタイルなどを取得することができます.絢爛たるListViewテーブルを開発する上で非常に有用で実用的なクラスであり、柔軟性と拡張性があります.
http://blog.csdn.net/xiehuan_uestc/article/details/7982814#