ListView + ArrayAdapter + 接口回调

       众所周知，ListView是安卓最为频繁使用的控件，但是，随着人们审美观的提高，一些初级的ListView已经满足不了需求了，于是，我们必须为自己定制一套专属的ListView,这就需要用到适配器，ArrayAdapter可以满足大部分需求，在自己定制适配器的过程中，我遇到了许许多多的问题，希望把我的心得交给大家，免得大家再重蹈覆辙，下面进入实战。

        我们的终极界面是这样的:

此图是静态截面图

此图是点击ID为1的整行信息后的效果图

此图是点击ID为1中的按钮后的效果图

下面开始步入正题

完成这整个项目需要完成以下条目：

1.为每个ListView中的元素编写一个通用界面。

2.为每个元素写一个通用适配器。

3.在主界面中添加一个ListView。

4.实例化元素并与ArrayAdapter绑定，并添加全局和内部点击事件。

1.开始编写元素布局（这里叫Node）

<?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="120px"
    android:orientation="horizontal"
    android:descendantFocusability="blocksDescendants">            //如果不写这句代码，会使最外层元素点击无效

    <TextView
        android:id="@+id/order"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_gravity="center"
        android:textSize="30dp"
        android:textColor="@color/theme"
        android:gravity="center"
        />

    <ImageView
        android:id="@+id/logo"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_gravity="center"
        />

    <LinearLayout
        android:id="@+id/info"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center_vertical"
        android:layout_gravity="center"
        android:orientation="vertical">

        <TextView
            android:id="@+id/car_order"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/theme"
            />

        <TextView
            android:id="@+id/name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/theme"
            />

    </LinearLayout>

    <TextView
        android:id="@+id/money"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center_vertical"
        android:textColor="@color/black"
        android:textSize="20dp"
        />

    <CheckBox
        android:id="@+id/jud"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_gravity="center"
        />

    <Button
        android:id="@+id/delta"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_gravity="center"
        android:text="冲值"/>

</LinearLayout>

    需要在values的布局下的colors布局界面中添加如下代码:

    

<color name="black">#080000</color>
<color name="theme">#282626</color>

    还需要在drawble目录下放一张50 * 50（推荐大小）的名为Logo.png的图片

2.为元素写一个管理类（Node类）。

public class Node {

    private int order;
    private int logo;
    private String car_order;
    private String name;
    private int money;
    private CheckBox jud;
    private Button delta;

    public Node(int order,int logo,String name,int money){

        this.order = order;
        this.logo = logo;
        this.car_order = "辽A1000" + order;
        this.name = name;
        this.money = money;

    }

    public int getorder(){

        return order;
    }

    public String getcar_order(){

        return car_order;
    }

    public int getlogoID(){

        return logo;
    }

    public String getname(){

        return name;
    }

    public int getmoney(){

        return money;
    }

}

2.为元素写一个适配器.

public class NodeAdapter extends ArrayAdapter<Node>{

    private int resourceId;

    public NodeAdapter(Context context, int resourceId, List<Node> objects){

        super(context,resourceId,objects);
        this.resourceId = resourceId;
    }

    @Override
    public View getView(final int position, View convertView, ViewGroup parent) {

        Node node = getItem(position);
        //View view = LayoutInflater.from(getContext()).inflate(resourceId, null);
        View view;
        ViewHolder holder;

        if(convertView == null){

            view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false);
            holder = new ViewHolder();
            holder.order = (TextView)view.findViewById(R.id.order);
            holder.logo = (ImageView)view.findViewById(R.id.logo);
            holder.car_order = (TextView)view.findViewById(R.id.car_order);
            holder.name = (TextView)view.findViewById(R.id.name);
            holder.money = (TextView)view.findViewById(R.id.money);
            holder.jud = (CheckBox)view.findViewById(R.id.jud);
            holder.delta = (Button)view.findViewById(R.id.delta);

            view.setTag(holder);
        }else{

            view = convertView;
            holder = (ViewHolder)view.getTag();
        }

        holder.order.setText(node.getorder() + "");
        holder.logo.setImageResource(node.getlogoID());
        holder.car_order.setText(node.getcar_order());
        holder.name.setText(node.getname() + "");
        holder.money.setText(node.getmoney() + "");

        holder.jud.setTag(position);
        holder.delta.setTag(position);

        holder.delta.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                itemSelect.seleId(position);
            }
        });

        return view;
    }

    public interface onItemSelect{                //回调接口

        void seleId(int i);
    }

    private onItemSelect itemSelect;

    public void setOnItemSelectListener(onItemSelect listener){

        this.itemSelect = listener;
    }

    class ViewHolder{

        TextView order;
        ImageView logo;
        TextView car_order;
        TextView name;
        TextView money;
        CheckBox jud;
        Button delta;

    }

}

3,写主界面布局代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

</LinearLayout>

4.为主界面完成代码。

public class MainActivity extends AppCompatActivity {

    private List<Node> nodeList = new ArrayList<Node>();
    private ListView nodeview;

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

        initNode();

        NodeAdapter adapter = new NodeAdapter(getApplicationContext(),R.layout.node,nodeList);
        nodeview.setAdapter(adapter);

        nodeview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

                Node node = nodeList.get(position);
                Toast.makeText(getApplicationContext(),"您要查看" + node.getorder() + "号车主的全部信息",Toast.LENGTH_SHORT).show();
            }
        });

        adapter.setOnItemSelectListener(new NodeAdapter.onItemSelect() {
            @Override
            public void seleId(int i) {

                int order = i + 1;
                Toast.makeText(getApplicationContext(),"您正在为" + order + "号车主充值",Toast.LENGTH_SHORT).show();
            }
        });
    }

    private void initNode(){

        nodeview = (ListView)findViewById(R.id.nodeview);
        Node node1 = new Node(1,R.drawable.logo,"胡海",100);
        Node node2 = new Node(2,R.drawable.logo,"蓝月",200);
        nodeList.add(node1);
        nodeList.add(node2);
    }
}

5.整个项目框架如下:

到此，这个项目就完成了.效果上面已经有图了。