2017年7月9日 星期日

Android:使用BaseAdapter客製化ListView中的Item

在Android裡,ListView可以說是非常常用的一個元件,要使用ListView、Spinner、GridView這類清單元件,就必須使用Adapter,如果清單資料不需要很複雜時,可以使用ArrayAdapter和SimpleAdapter,但是如果清單元件如果有客製化需求時,就必須使用BaseAdapter


例如:此篇範例想要做出listView中的每一列的最前面都有圖片,並且偶數列給它顏色


BaseAdapter的特性就是可以重用View來節省資源,滑出去的View會被從新拿來使用,這樣就不必使用太多的資源了。
要使用BaseAdapter就必須讓一個類別來繼承它,並且實做四個方法,分別為:getCount()getItem()getItemId()getView()

  • getCount():會回傳View中的個數。

  • getItem(int postition):會回傳position所對應的資料。

  • getItemId(int position):會回傳position所對影的id值,可供辨識。

  • getView(int position , View convertView , ViewGroup parent):當欲展示一個項目給使用者時,會自動呼叫此方法,會把實體化過的view傳回去給listview。


程式碼:

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="com.example.user.baseadapter.MainActivity">

    <ListView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/listview"></ListView>
    
</RelativeLayout>

list_row.xml:listview中每一列要顯示的元件的布局檔(一張圖片和文字)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
    <ImageView
        android:layout_width="10dp"
        android:layout_height="20dp"
        android:id="@+id/image"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textview"
        android:paddingLeft="30dp"/>

</LinearLayout>

Encapsulation.java:

public class ListName {
    private String name;

    public void setName(String name){
        this.name = name;
    }
    public String getName(){
        return this.name;
    }
}

BaseAdapter.java:

public class BaseAdapter extends android.widget.BaseAdapter{

        private ArrayList<ListName> listData;
        private LayoutInflater layoutInflater;
        public BaseAdapter(Context context, ArrayList<ListName> listData) {
            this.listData = listData;
            layoutInflater = LayoutInflater.from(context);  //獲得LayoutInflater
        }
        @Override
        public int getCount() {
            return listData.size();
        }
        @Override
        public Object getItem(int position) {
            return listData.get(position);
        }
        @Override
        public long getItemId(int position) {
            return position;
        }
        public View getView(int position, View convertView, ViewGroup parent) {

            ViewHolder holder;

            if (convertView == null) {  //判斷是否被使用過,如果沒有就初始化它
                convertView = layoutInflater.inflate(R.layout.list_row, null); //LayoutInflater.inflate來載入xml文件布局檔
                holder = new ViewHolder();  //實體化holder
                holder.image = (ImageView)convertView.findViewById(R.id.image);
                holder.textview = (TextView) convertView.findViewById(R.id.textview);

                convertView.setTag(holder);  //把convertView塞入holder裡,下次convertView不是空的條件下 就可以直接把holder拿出來用
            } else {
                holder = (ViewHolder) convertView.getTag();
            }

            ListName encapsulation = listData.get(position);

            holder.image.setBackgroundColor(Color.parseColor("#f6565a"));  //給image設定顏色
//            convertView.setBackgroundColor(Color.WHITE);

            if (position%2==0){   //判斷是不是偶數列,是的話就把那列設定顏色
                convertView.setBackgroundColor(Color.parseColor("#0ce8e2"));
            }

            holder.textview.setText(encapsulation.getName());
            return convertView;
        }
        static class ViewHolder {  //用來裝在listview裡每一列要顯示的元件
            TextView textview;
            ImageView image;

        }

}

MainActivity.java:

public class MainActivity extends AppCompatActivity {

    private ListView listview;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        String[] s={"Jack","Mary","William","Micheal","Tom","Watson","Alice","Anna","Eve","Jane","Amanda","Laura","Diana","Lydia","Ivy","Vanessa","Ashley","Jennifer","Stephanie","Bella","Catherine","Eileen"};

        listview = (ListView)findViewById(R.id.listview);
        ArrayList<ListName> list = new ArrayList<>();

        for(int i=0;i<s.length;i++){
            ListName encapsulation = new ListName();
            encapsulation.setName(s[i]);
            list.add(encapsulation);
        }
        listview.setAdapter(new BaseAdapter(this,list));


    }
}

沒有留言:

張貼留言