1. 程式人生 > >ListView高階控制元件的使用

ListView高階控制元件的使用

activity_main.xml 檔案(配置檔案)

<?xml version="1.0" encoding="utf-8"?>
    <android.support.constraint.ConstraintLayout 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">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello World!"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />


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

    </android.support.constraint.ConstraintLayout>

listview_item.xml檔案(項資源)

<?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="wrap_content"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/iv_listviewitem_image"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="3"
        android:padding="10dp"
        android:scaleType="fitXY"
        android:src="@drawable/book1" />

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="6"
        android:orientation="vertical"
        android:padding="10dp" >

        <TextView
            android:id="@+id/tv_listviewitme_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="狂人攝影日記"
            android:textColor="@color/red"
            android:textSize="20sp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:text="書本作者:"
                android:textColor="@color/black" />

            <TextView
                android:id="@+id/tv_listviewitme_author"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:text="阿劉" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:text="書本價格:"
                android:textColor="@color/black" />

            <TextView
                android:id="@+id/tv_listviewitme_price"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:text="$123"
                android:textColor="@color/black" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:text="    出版社:"
                android:textColor="@color/black" />

            <TextView
                android:id="@+id/tv_listviewitme_publish"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:text="電子出版社"
                android:textColor="@color/black" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:text="書本簡介:"
                android:textColor="@color/black" />

            <TextView
                android:id="@+id/tv_listviewitme_remark"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:ellipsize="end"
                android:maxLines="2"
                android:text="很冷的一個冬天很冷的一個冬天很冷的一個冬天很冷的一個冬天很冷的一個冬天很冷的一個冬天很冷的一個冬天很冷的一個冬天很冷的一個冬天很冷的一個冬天"
                android:textColor="@color/black" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="20dp"
            android:orientation="horizontal" >

            <ImageButton
                android:id="@+id/bt_listviewitme_btn1"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_weight="1"
                android:src="@drawable/btn_shopping" />

            <ImageButton
                android:id="@+id/bt_listviewitme_btn2"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_weight="1"
                android:src="@drawable/btn_accounts" />
        </LinearLayout>
    </LinearLayout>

大致步驟如下:

1.在程式入口定義好ListView控制元件 分析器(BaseAdapter介面卡需要解析項資源) 介面卡(Adapter) 資料來源(資料來源這裡使用固定資料)
2.在 onCreate方法中獲取控制元件
3.進行介面卡三部曲

  • 第一步獲取資料來源
  • 第二部初始化介面卡(這裡我們寫了一個內部類名為MyBaseAdapter中寫了一個有參構造器負責載入解析器)
  • 第三步繫結高階控制元件

下面有詳情程式碼:

package com.example.baseadapter;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;

import java.util.List;

public class MainActivity extends AppCompatActivity {

    /**
     * 定義  控制元件   資料    解析器    自定義介面卡
     * @param savedInstanceState
     */

    private ListView  lv_main_lv1;
    private List<Book> data;
    private LayoutInflater layoutInflater;
    private myBaseAdapter myBaseAdapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        lv_main_lv1=this.findViewById(R.id.lv_main_lv1);
        data=new BookDao().list();
        layoutInflater = (LayoutInflater) getSystemService(this.LAYOUT_INFLATER_SERVICE);//獲取解析器
        myBaseAdapter = new myBaseAdapter(layoutInflater);//內部初始化
        lv_main_lv1.setAdapter(myBaseAdapter);//繫結高階控制元件
    }

    /**
     * 自定義介面卡
     */
    public class myBaseAdapter extends BaseAdapter{
        //提供有參構造例項化時獲取解析器
        private LayoutInflater layoutInflater;
        public myBaseAdapter(LayoutInflater layoutInflater) {
            this.layoutInflater=layoutInflater;
        }

        @Override
        public int getCount() {
            return data.size();//決定你展示多少資料
        }

        @Override
        public Object getItem(int position) {
            return data.get(position);//當前第幾條資料
        }

        @Override
        public long getItemId(int position) {
            return position;//下標
        }

        /**
         * 定義內部類   簡化獲取元件
         *
         * @return
         */
        public class viewHold{
            private ImageView iv_listviewitem_image;
            private TextView  tv_listviewitme_title;
            private TextView  tv_listviewitme_author;
            private TextView  tv_listviewitme_price;
            private TextView  tv_listviewitme_publish;
            private TextView  tv_listviewitme_remark;

        }
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            //效能優化
            View view = convertView;
            if(view==null){
                viewHold viewHold = new viewHold();
                //頁面展示幾個則會載入幾次這裡錯一個判斷,當進行下一次迴圈則會採用上一次檢視
                view=layoutInflater.inflate(R.layout.listview_item,null);//將項資源解析成可讀的view
                viewHold.iv_listviewitem_image=view.findViewById(R.id.iv_listviewitem_image);//獲取view中的控制元件
                viewHold.tv_listviewitme_title=view.findViewById(R.id.tv_listviewitme_title);
                viewHold.tv_listviewitme_author=view.findViewById(R.id.tv_listviewitme_author);
                viewHold.tv_listviewitme_price=view.findViewById(R.id.tv_listviewitme_price);
                viewHold.tv_listviewitme_publish=view.findViewById(R.id.tv_listviewitme_publish);
                viewHold.tv_listviewitme_remark=view.findViewById(R.id.tv_listviewitme_remark);
                view.setTag(viewHold);//儲存上一次的控制元件
            }
                viewHold viewHold= (viewHold) view.getTag();
            //此時控制元件並沒有值所以要給他賦值
            Book book = data.get(position);
            viewHold.iv_listviewitem_image.setImageResource(book.getImage());
            viewHold.tv_listviewitme_title.setText(book.getTitle());
            viewHold.tv_listviewitme_author.setText(book.getAuthor());
            viewHold.tv_listviewitme_price.setText(book.getPrice()+"");
            viewHold.tv_listviewitme_publish.setText(book.getPublish());
            viewHold.tv_listviewitme_remark.setText(book.getRemark());
            return view;
        }
    }
}

BaseAdapter:是所有介面卡類的父類,可以對列表項進行最大限度的定製

1.1 自定義介面卡中的方法
getCount
getView
getItem
getItemId
1.2 LayoutInflater(佈局解析器)
–LayoutInflater有三種獲得方式,資料中有詳細介紹
用來把layout佈局檔案解析成一個View物件,不可以new,需要使用系統服務獲得
inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);

效果圖:

ListView配合BaseAdapter