項目目錄
一、項目概述
隨着網絡的發展、手機等電子產品的普及和電商的崛起，人們越來越傾向於足不出戶的網上購物，網購已經成爲一種趨勢，在我們的日常消費模式當中已經佔據了很大一部分，幾乎生活當中能見到的東西在購物平臺上都可以買到。
那麼這些購物平臺是如何顯示這些商品列表的呢？當我們去瀏覽商品列表時這些信息是怎麼添加上去的呢？帶着這些疑問，本次項目就帶大家來學習ListView的使用。
二、開發環境
三、詳細設計
1、商品列表的搭建
首先搭建商品列表的layout文件，最外層採用的是LinearLayout（線性佈局），orientation（方向）選擇的是vertical（垂直），這樣界面內的控件就是從上至下垂直排列了。
接下來放置一個TextView控件，width設爲math_parent，即填充滿父容器，寬度和父容器一樣；高度設置的爲45dp，文本內容text是"購物商城"，字體大小textSize設爲18sp，字體顏色textColor設爲白色，背景background設爲橙色，gravity（文字位置）顯示爲center（水平居中）。
最後放置一個ListView控件，即列表，寬度填充滿屏幕，高度自適應。預覽效果如圖：
代碼如下：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="45dp"
android:text="購物商城"
android:textSize="18sp"
android:textColor="#FFFFFF"
android:background="#FF8F03"
android:gravity="center"/>
<ListView
android:id="@+id/lv"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
2、商品條目的搭建
有ListView一定要有item，因爲光有列表不行，還必須給列表添加內容，而item就是列表裏面每一行顯示的內容，兩者相輔相成，共同組成列表。
商品條目界面的搭建只需要搭建第一行的item，其他item格式一樣，只需要在主文件MainActivity中定義一個數組，寫好商品內容，然後自動生成。所以先來搭建好第一行的item。
最外層佈局選擇的是RelativeLayout（相對佈局），頂端放置了一個ImageView控件，用於顯示商品的圖片，寬度和高度自己設定，位置選擇的是垂直居中。
接下來放置了一個子佈局RelativeLayout，使用android:layout_toRightOf="@+id/iv"語句將子佈局整個放置在剛剛圖片的右側，內容依舊是垂直居中。
在這個子佈局中，先放置了一個TextView控件，用於顯示商品名稱。文本id 設爲 title，寬度和高度都是設定爲依據內容大小調整的，文本內容爲“桌子”，文本大小爲20sp，文本顏色選擇的是黑色。
又放置了一個TextView，主要用於顯示價格。id設爲tv_price，寬和高自適應，文本內容爲“價格”，使用android:layout_below="@+id/title" 語句將它放到商品名稱的TextView下方。
最後放置了一個TextView，主要用於顯示價格的數字。具體屬性設定同上，使用android:layout_toRightOf="@+id/tv_price"語句將它放在價格的TextView右方，上邊距設爲10dp。
界面預覽效果如圖：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp">
<ImageView
android:id="@+id/iv"
android:layout_width="150dp"
android:layout_height="120dp"
android:layout_centerVertical="true"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_toRightOf="@+id/iv"
android:layout_centerVertical="true">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="桌子"
android:textSize="20sp"
android:textColor="#000000"/>
<TextView
android:id="@+id/tv_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="價格："
android:textSize="20sp"
android:layout_marginTop="10dp"
android:layout_below="@+id/title"
android:textColor="#FF8F03"/>
<TextView
android:id="@+id/price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1000"
android:textSize="20sp"
android:layout_below="@+id/title"
android:layout_toRightOf="@+id/tv_price"
android:textColor="#FF8F03"
android:layout_marginTop="10dp"/>
</RelativeLayout>
</RelativeLayout>
3、數據適配器的搭建
3.1、常用數據適配器（Adapter）
3.2、BaseAdapter的方法
3.3、定義數據適配器
搭建完列表後，現在在MainActivity中要定義數據適配器，將數據轉換爲我們可以看到的視圖。
先定義了MyBaseAdapter繼承於BaseAdapter，包含四個方法：
（1）getCount方法獲取item的總數，返回ListView Item條目代表的對象；
（2）getItem方法，參數爲item的下標，返回item的數據對象；
（3）getItemId方法，參數爲item的下標，返回item的id；
（4）View getView方法，爲獲取相應position對應的Item視圖。position是當前Item的位置，convertView用於複用舊視圖，parent用於加載XML佈局。
定義一個ViewHolder類，聲明三個成員變量。 緊接着將商品名稱title、價格price和金額iv和相應的控件id進行綁定，若convertView爲null,則找到控件並加載視圖，不爲空則直接顯示商品信息。適配器MyBaseAdapter 的代碼如下：
class MyBaseAdapter extends BaseAdapter{
@Override
public int getCount(){ //得到item的總數
return titles.length; //返回ListView Item條目代表的對象
}
@Override
public Object getItem(int position){
return titles[position]; //返回item的數據對象
}
@Override
public long getItemId(int position){
return position; //返回item的id
}
@Override
public View getView(int position, View convertView, ViewGroup parent){//獲取item中的View視圖
ViewHolder holder;
if(convertView==null){
convertView=View.inflate(MainActivity.this,R.layout.list_item, null);
holder=new ViewHolder();
holder.title=convertView.findViewById(R.id.title);
holder.price=convertView.findViewById(R.id.price);
holder.iv=convertView.findViewById(R.id.iv);
convertView.setTag(holder);
}else{
holder=(ViewHolder)convertView.getTag();
}
holder.title.setText(titles[position]);
holder.price.setText(prices[position]);
holder.iv.setImageResource(icons[position]);
return convertView;
}
}
3.4、優化數據適配器
剛剛的代碼是使用使用ViewHolder類和複用convertView優化過的代碼，不僅減少了耗時操作，而且防止了數據量過大導致內存溢出的問題，一舉兩得。
class ViewHolder{
TextView title;
TextView price;
ImageView iv;
}
4、適配的數據和圖片集合
在MainActivity類中定義了三個數組，分別是titles數組，用於顯示商品列表；prices數組，用於顯示金額單價；icons集合，用於顯示drawable裏面導入的商品圖片。然後使用onCreate方法初始化控件，創建並設置了Adapter，代碼如下：
public class MainActivity extends AppCompatActivity {
//需要適配的數據
private String[] titles={"桌子","蘋果","蛋糕","線衣","獼猴桃","圍巾"};
private String[] prices={"1800元","10元/kg","300元","350元","10元/kg","280元"};
//圖片集合
private int[] icons={R.drawable.table,R.drawable.apple,R.drawable.cake,
R.drawable.wearclothes,R.drawable.kiwifruit,R.drawable.scarf};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化ListView控件
ListView listView=findViewById(R.id.lv);
//創建一個Adapter的實例
MyBaseAdapter mAdapter=new MyBaseAdapter();
//設置Adapter
listView.setAdapter(mAdapter);
}
至此,項目詳細設計介紹完畢。（碼字不易，腰痠背痛ing）
四、項目效果
打開模擬器運行，商品列表界面如圖，可以上下拖動。
五、項目總結
本次購物商城項目主要考驗學生對於ListView和基本控件的使用，希望大家可以熟練掌握，這些知識點在Android項目中會經常使用，因此希望大家能夠熟練掌握上述知識點的使用，方便後續開發項目。項目的百度網盤鏈接和提取碼如下：百度網盤鏈接 提取碼：n5lz
任何事情都應該去嘗試一下，因爲你無法知道，什麼樣的事或者什麼樣的人將會改變你的一生。