Thêm dữ liệu vào ListView trong C#

Đôn Bá Đạo

Sunday, March 15, 2015

Lần trước chúng ta đã biết đổ dữ liệu từ SQL vào Listview nhưng có Images hôm nay chúng ta sẽ đổ dữ liệu theo kiểu như DataGridview.

Chúng ta vẫn vẽ ListView ra như các control khác .
Sau đó chúng ta sẽ viết Code . Hãy đọc lại bài Đổ dữ liệu vào Listview từ CSDL SQLSever - Hướng đối tượng C# để biết các hàm đã viết sẵn mà chúng ta sẽ dùng nhé.
listView2.Columns.Add["Tên món"]; listView2.Columns.Add["Giá tiền"]; listView2.Columns.Add["Đơn vị tính"]; listView2.Columns.Add["Ghi chú"]; public void ShowThucDon[] { DataTable dt = new DataTable[]; dt = bs.getThucdon[]; //listView2.Items.Clear[]; ListViewItem dong; for [int i = 0; i < dt.Rows.Count; i++] { DataRow dr = dt.Rows[i]; ListViewItem item = new ListViewItem[dr[1].ToString[]]; ListViewItem.ListViewSubItem subitem = new ListViewItem.ListViewSubItem[item, dt.Rows[i][0].ToString[]]; item.SubItems.Add[dr[2].ToString[]]; item.SubItems.Add[dr[3].ToString[]]; item.SubItems.Add[dr[4].ToString[]]; item.SubItems.Add[subitem]; listView2.Items.Add[item]; } listView2.View = View.Details; listView2.AutoResizeColumns[ColumnHeaderAutoResizeStyle.ColumnContent]; listView2.AutoResizeColumns[ColumnHeaderAutoResizeStyle.HeaderSize]; } Lưu ý:  Phải để chế độ View là Detail thì mới ra dạng bảng được nhé.
Tên Listview.View=View.Details
 Item.SubItems.Add[] là dùng để add các dữ liệu từ SQL lên Listview theo các cột mà chúng ta đã định sẵn.

ListView là phần tử View được dùng để hiện thị dữ liệu là một danh sách [mảng] từ một nguồn cấp gọi là Adapter, các bước để tạo và sử dụng ListView gồm có:

Khai báo ListView trong Layout

Tương tự như các View khác, ví dụ:

Gán cho ListView một Adapter là nguồn cấp dữ liệu cho nó

Xây dựng một Adapter cho ListView ở phần dưới, sau khi có Adapter cần thiết lập cho ListView, ví dụ trong onCreate của Activity:

listViewProduct = findViewById[R.id.listproduct]; listViewProduct.setAdapter[productListViewAdapter];

Khi đã gán Adapter vào ListView, thì ListView sẽ dùng Adapter này xác định cần hiện thị bao nhiêu phần tử, mỗi phần tử có View như thế nào do Adapter tạo và đính vào ListView, mỗi khi dữ liệu Adapter quản lý thay đổi, cần thông báo cho ListView biết mà cập nhật bằng cách gọi:

adapter.notifyDataSetChanged[];

Xây dựng Adapter cho ListView

Như đã nói trên, Adapter là mô hình cung cấp dữ liệu cho ListView, nó có chức năng tạo các View phần tử, gán dữ liệu vào phần tử View con trong ListView. Để tạo ra một Adapter riêng chỉ cần kế thừa triển khai lớp trừu tượng BaseAdapter, trong đó cần overrided các phương thức như dưới đây [Ví dụ xây dựng lớp MyAdapter]:

class MyAdapter extends BaseAdapter { @Override public int getCount[] { //Cần trả về số phần tử mà ListView hiện thị return 0; } @Override public Object getItem[int position] { //Cần trả về đối tượng dữ liệu phần tử ở vị trí position return null; } @Override public long getItemId[int position] { //Trả về một ID liên quan đến phần tử ở vị trí position return 0; } @Override public View getView[int position, View convertView, ViewGroup parent] { //convertView là View hiện thị phần tử, nếu là null cần tạo mới //[có thể nạp từ layout bằng View.inflate] //Cuối cùng là gán dữ liệu ở vị trí possition vào View và trả về đối //tượng View này return null; } }

Ví dụ ListView trong Android

Nội dung Ví dụ

Ứng dụng hiện thị một danh sách các sản phẩm đơn giản, sản phẩm được trình bày trong một layout có các thông tin như ID, tên sản phẩm, giá. Khi bấm vào chọn một sản phẩm, Pop up lên thông báo tên sản phẩm đó. Có chức năng cho phép xoá phần tử đầu tiên của danh sách [sau khi xoá ListView cập nhật lại]

Khởi tạo Ví dụ

Chạy Android Studio và tạo ứng dụng đặt tên, ví dụ XTLabListView bằng mẫu Empty Activity, sau đó thay nội dung activity_main.xml thành giao diện đơn giản, riêng có ListView như sau:

Model dữ liệu sản phẩm

Mỗi sản phẩm đơn giản hiện thị ID, tên sản phẩm, giá nên ta tạo ra một mô hình dữ liệu của nó như sau:

//Model phần tử dữ liệu hiện class Product { String name; int price; int productID; public Product[int productID, String name, int price] { this.name = name; this.price = price; this.productID = productID; } }

Trong MainActivity tạo ra một mảng chứa dữ liệu mẫu các Product [dùng ArrayList], ví dụ:

ArrayList listProduct; //Mảng dữ liệu sản phẩm @Override protected void onCreate[Bundle savedInstanceState] { super.onCreate[savedInstanceState]; setContentView[R.layout.activity_main]; //Khoi tao ListProduct, tự sinh một số dữ liệu listProduct = new ArrayList[]; listProduct.add[new Product[1, "Iphone 6", 500]]; listProduct.add[new Product[2, "Iphone 7", 700]]; listProduct.add[new Product[3, "Sony Abc", 800]]; listProduct.add[new Product[4, "Samsung XYZ", 900]]; listProduct.add[new Product[5, "SP 5", 500]]; listProduct.add[new Product[6, "SP 6", 700]]; listProduct.add[new Product[7, "SP 7", 800]]; listProduct.add[new Product[8, "SP 8", 900]]; }

Tạo Adapter cho ListView hiện thị sản phầm

Adapter này xây dựng để liên kết với mảng dữ liệu sản phẩm ở trên [ArrayList listProduct], Adapter tạo ra các View để hiện thị sản phẩm, nên đầu tiên tạo ra layout hiện thị một sản phẩm trong listview, layout này được inflate khi cần thiết.

layout/product_view.xml [bạn có thể trành bày layout theo cách đẹp đẽ, phức tạp của bạn].

Giờ là lúc tạo ra Adapter, đặt tên lớp là ProductListViewAdapter, nội dung code như sau

class ProductListViewAdapter extends BaseAdapter { //Dữ liệu liên kết bởi Adapter là một mảng các sản phẩm final ArrayList listProduct; ProductListViewAdapter[ArrayList listProduct] { this.listProduct = listProduct; } @Override public int getCount[] { //Trả về tổng số phần tử, nó được gọi bởi ListView return listProduct.size[]; } @Override public Object getItem[int position] { //Trả về dữ liệu ở vị trí position của Adapter, tương ứng là phần tử //có chỉ số position trong listProduct return listProduct.get[position]; } @Override public long getItemId[int position] { //Trả về một ID của phần return listProduct.get[position].productID; } @Override public View getView[int position, View convertView, ViewGroup parent] { //convertView là View của phần tử ListView, nếu convertView != null nghĩa là //View này được sử dụng lại, chỉ việc cập nhật nội dung mới //Nếu null cần tạo mới View viewProduct; if [convertView == null] { viewProduct = View.inflate[parent.getContext[], R.layout.product_view, null]; } else viewProduct = convertView; //Bind sữ liệu phần tử vào View Product product = [Product] getItem[position]; [[TextView] viewProduct.findViewById[R.id.idproduct]].setText[String.format["ID = %d", product.productID]]; [[TextView] viewProduct.findViewById[R.id.nameproduct]].setText[String.format["Tên SP : %s", product.name]]; [[TextView] viewProduct.findViewById[R.id.priceproduct]].setText[String.format["Giá %d", product.price]]; return viewProduct; } }

Quay trở lại áp dụng, trong onCreate tạo ra đối tượng từ lớp ProductListViewAdapter [dữ liệu khởi tạo là mảng danh sách sản phẩm listProduct], biến Adapter này đặt tên là productListViewAdapter, sau đó gán nó cho ListView, đến đây thì ListView sẵn sàng hiện thị danh sách các sản phẩm của bạn!

Ngoài ra có thêm một số đoạn code tuỳ chọn như listViewProduct.setOnItemClickListener để bắt sự kiện khi bấm chọn một phần tử và bấm vào nút bấm để xoá phần tử đầu tiên. Code đầy đủ tổng hợp hoàn chỉnh lại của ứng dụng như sau:

MainActivity.java package net.xuanthulab.xtlablistview; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.view.ViewGroup; import android.widget.AdapterView; import android.widget.BaseAdapter; import android.widget.ListView; import android.widget.TextView; import android.widget.Toast; import java.util.ArrayList; public class MainActivity extends AppCompatActivity { ArrayList listProduct; ProductListViewAdapter productListViewAdapter; ListView listViewProduct; @Override protected void onCreate[Bundle savedInstanceState] { super.onCreate[savedInstanceState]; setContentView[R.layout.activity_main]; //Khoi tao ListProduct listProduct = new ArrayList[]; listProduct.add[new Product[1, "Iphone 6", 500]]; listProduct.add[new Product[2, "Iphone 7", 700]]; listProduct.add[new Product[3, "Sony Abc", 800]]; listProduct.add[new Product[4, "Samsung XYZ", 900]]; listProduct.add[new Product[5, "SP 5", 500]]; listProduct.add[new Product[6, "SP 6", 700]]; listProduct.add[new Product[7, "SP 7", 800]]; listProduct.add[new Product[8, "SP 8", 900]]; productListViewAdapter = new ProductListViewAdapter[listProduct]; listViewProduct = findViewById[R.id.listproduct]; listViewProduct.setAdapter[productListViewAdapter]; //Lắng nghe bắt sự kiện một phần tử danh sách được chọn listViewProduct.setOnItemClickListener[new AdapterView.OnItemClickListener[] { @Override public void onItemClick[AdapterView parent, View view, int position, long id] { Product product = [Product] productListViewAdapter.getItem[position]; //Làm gì đó khi chọn sản phẩm [ví dụ tạo một Activity hiện thị chi tiết, biên tập ..] Toast.makeText[MainActivity.this, product.name, Toast.LENGTH_LONG].show[]; } }]; findViewById[R.id.delete].setOnClickListener[new View.OnClickListener[] { @Override public void onClick[View v] { if [listProduct.size[] > 0] { //Xoá phần tử đầu tiên của danh sách int productpost = 0; listProduct.remove[productpost]; //Thông báo cho ListView biết dữ liệu đã thay đổi [cập nhật, xoá ...] productListViewAdapter.notifyDataSetChanged[]; } } }]; } //Model phần tử dữ liệu hiện class Product { String name; int price; int productID; public Product[int productID, String name, int price] { this.name = name; this.price = price; this.productID = productID; } } class ProductListViewAdapter extends BaseAdapter { //Dữ liệu liên kết bởi Adapter là một mảng các sản phẩm final ArrayList listProduct; ProductListViewAdapter[ArrayList listProduct] { this.listProduct = listProduct; } @Override public int getCount[] { //Trả về tổng số phần tử, nó được gọi bởi ListView return listProduct.size[]; } @Override public Object getItem[int position] { //Trả về dữ liệu ở vị trí position của Adapter, tương ứng là phần tử //có chỉ số position trong listProduct return listProduct.get[position]; } @Override public long getItemId[int position] { //Trả về một ID của phần return listProduct.get[position].productID; } @Override public View getView[int position, View convertView, ViewGroup parent] { //convertView là View của phần tử ListView, nếu convertView != null nghĩa là //View này được sử dụng lại, chỉ việc cập nhật nội dung mới //Nếu null cần tạo mới View viewProduct; if [convertView == null] { viewProduct = View.inflate[parent.getContext[], R.layout.product_view, null]; } else viewProduct = convertView; //Bind sữ liệu phần tử vào View Product product = [Product] getItem[position]; [[TextView] viewProduct.findViewById[R.id.idproduct]].setText[String.format["ID = %d", product.productID]]; [[TextView] viewProduct.findViewById[R.id.nameproduct]].setText[String.format["Tên SP : %s", product.name]]; [[TextView] viewProduct.findViewById[R.id.priceproduct]].setText[String.format["Giá %d", product.price]]; return viewProduct; } } }

Ví dụ này lưu tại //github.com/xuanthulabnet/android-listview-example, có thể tải vể bằng lệnh Git: git clone :xuanthulabnet/android-listview-example.git

Video liên quan

Chủ Đề