第二章 第三节 Android高级组件 - ListView


1. AdapterView

1.1. AdapterView简介

AdapterView:容器控件,其整体效果由每一个子元素 内容决定,子元素的形式由Adapter(适配器)决定。
在这里插入图片描述

AdapterView的子视图对象:
  • ListView:以垂直滑动列表形式显示一组数据。 –
  • GridView:以网格形式显示一组数据。 –
  • Spinner:以下拉列表形式显示一组数据。 –
  • Gallery:以水平滑动列表形式显示一组数据。(已弃用)
待显示的数据如何传递给AdapterView中的Item?
  • 准备数据(数据来源于哪里?数据是什么格式?数据格 式和AdapterView视图项匹配吗?)

  • 借助Adapter来实现数据与View之间的数据传递。

  • Adapter:数据和视图之间交互的中介。

作用

Adapter:数据和视图之间交互的中介。

  • 数据改变时,不需要修改视图组件,只需更新Adapter。

• 对于同一视图组件(AdapterView子对象),数据源可能来 自不同形式。

  • 视图组件变化时,不需要修改数据,绑定相同Adapter。

• 对于同一组数据,可以显示为不同的视图形式(如ListView、 GridView或其它)。

快捷键 ctrl + H 可以打开类的继承关系窗口

常用的Adapter
  • ArrayAdapter:最简单的适配器,数据源为文本字符 串数组。
  • SimpleAdapter:简单适配器,数据源结构比较复杂, 一般为List类型对象。
  • SimpleCursorAdapter:游标适配器,数据源一般为 数据库中的数据。
  • 自定义适配器:更灵活的适配器,数据源不定(由用户 自行指定),需要继承BaseAdapter抽象类。

AdapterView使用的基本流程:

  1. 准备数据源(现在为本地数据源,今后扩展为网络)。
  2. 准备AdapterView每一个子项的视图布局。(item布局方式)
  3. 创建Adapter(连接数据源和视图布局)。
  4. 为指定AdapterView视图组件绑定适配器。
  5. 为AdapterView绑定事件监听器

2. ListView

ListView:以垂直可滑动列表形式显示子项目的视图容器, 是一种AdapterView

ListView使用的基本流程(同AdapterView):
  1. 准备ListView每一个子项的视图布局。 • 可以使用内置的布局,也可以用户自定义布局。
  2. 创建Adapter(连接数据源和视图布局)。
  3. 为ListView绑定Adapter。
  4. 为ListView绑定事件监听器。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);//引用默认外界布局文件
        //ListView使用步骤
        //1.准备数据
        String[] list={"手机","电脑","平板"};
        //2.准备item文件(sdk自带)

        //3.选择  Adapter  并绑定
        ArrayAdapter<String> myadapter=new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,list);
        //参数分别是 环境上下文,item布局文件,数据源
        //上面连数据库,下面连视图
        ListView mylistview=findViewById(R.id.listview1);
        mylistview.setAdapter(myadapter);
        //4.给绑定子项item点击事件
        mylistview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                //parent->listview对象   view->item的视图对象     position->从0开始,一般与id同数值
                Log.e("position",position+"条");
                Log.e("id",id+"条");
                view.setBackgroundColor(getResources().getColor(android.R.color.holo_green_light));
            }
        });
<?xml version="1.0" encoding="utf-8"?>


<ListView
    android:id="@+id/listview1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android" />



在这里插入图片描述

在这里插入图片描述

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);//引用默认外界布局文件
        准备数据源
        解决问题快捷键  alt + enter
        List<Map<String,String>> students=new ArrayList<>();
        Map<String,String> stu1=new HashMap<>();
        stu1.put("name","zhangsan1");
        stu1.put("stuNo","2018011710");
        Map<String,String> stu2=new HashMap<>();
        stu2.put("name","lisi");
        stu2.put("stuNo","2021810454");

        students.add(stu1);
        students.add(stu2);
        准备item布局文件(自带)
        创建adapter   ,绑定adapter
        SimpleAdapter myadapter=new SimpleAdapter(this,//环境上下文
                students,//数据源
                android.R.layout.simple_expandable_list_item_2,//item布局文件
                new String[]{"name","stuNo"},//数据源中Map的Key值
                new int[]{android.R.id.text1,android.R.id.text2});
        iten中显示的内容的控件ID,在simple_expandable_list_item_2里面

        创建ListView监听器
        ListView studentListView=findViewById(R.id.student);
        studentListView.setAdapter(myadapter);
    }
}



在这里插入图片描述




自定义ListView

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

#1

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

    <ListView
        android:id="@+id/sss"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</RelativeLayout>
 

--------------------------------------------






#2

package com.example.xueli;

public class BuyCar {
    private String name;     //名字
    private String  message; //信息
    private String money;    //价格
    private int photoId;     //照片
    private String counter;  //数量

    public BuyCar(String name, String message, String money, int photoId, String counter) {
        this.name = name;
        this.message = message;
        this.money = money;
        this.photoId = photoId;
        this.counter = counter;
    }

    public String getCounter() {
        return counter;
    }

    public void setCounter(String counter) {
        this.counter = counter;
    }

    public BuyCar() {
    }



    public String getName() {
        return name;
    }

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

    public String getMessage() {
        return message;
    }

    public void setMessage(String message) {
        this.message = message;
    }

    public String getMoney() {
        return money;
    }

    public void setMoney(String money) {
        this.money = money;
    }

    public int getPhotoId() {
        return photoId;
    }

    public void setPhotoId(int photoId) {
        this.photoId = photoId;
    }
}
 







#3



public class MainActivity extends AppCompatActivity {
    private List<BuyCar> goods=new ArrayList<>();
    private BuyCarAdapter customAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //准备数据
        initData();
        //定义item'文件
        //常见adapter,绑定adapter
        customAdapter=new BuyCarAdapter(this,goods,R.layout.newbuycar);

        ListView listview=findViewById(R.id.sss);
        listview.setAdapter(customAdapter);

        //设置监听器
    }
    public void initData(){
        BuyCar car1=new BuyCar("华为旗舰店","正品Huawei/华为 Mate 9\n全网通4G双卡双待指纹徕\n卡双摄智能4G手机","2000.0",R.drawable.phone,"3");
        BuyCar car2=new BuyCar("创意良品","iWALK三合一充电线移动\n电源一拖二可爱迷你充电\n宝苹果安卓充电线","88.0",R.drawable.erji,"9");
        goods.add(car1);
        goods.add(car2);
    }



}
------------------------------------------







#4
public class BuyCarAdapter extends BaseAdapter {
    private Context mContext;//环境上下文
    private List<BuyCar> buycars = new ArrayList<>();//数据源
    private int itemLayoutRes;//布局文件

    public BuyCarAdapter(Context mContext, List<BuyCar> buycars, int itemLayoutRes) {
        this.mContext = mContext;
        this.buycars = buycars;
        this.itemLayoutRes = itemLayoutRes;
    }

    @Override
    public int getCount() {//数据条数
        if(null != buycars){
            return buycars.size();
        }
        return 0;
    }

    @Override
    public Object getItem(int position) {//item对象
        if(null != buycars){
            return buycars.get(position);
        }
        return null;
    }

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

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


        final int[] btn_situation = {0,0};


        //获取item的视图对象,生成对象,赋值于convertView。
        if (convertView == null) {
            LayoutInflater inflater = LayoutInflater.from(mContext);//布局填充器,参数环境上下文
            convertView = inflater.inflate(itemLayoutRes, null);//负责加载文件
        }


        //现在有了视图对象
        //获取item中控件的引用
        TextView name = convertView.findViewById(R.id.text1);   //店铺名字
        ImageView photo=convertView.findViewById(R.id.img2);    //宝贝图片
        TextView message = convertView.findViewById(R.id.text2);//宝贝文字介绍
        TextView price = convertView.findViewById(R.id.text3);  //价格
        Button btnMore = convertView.findViewById(R.id.bt_more);//更多
        TextView number = convertView.findViewById(R.id.text4); //数量



        final RadioGroup btn1_farther= convertView.findViewById(R.id.btn1_farther);
        final RadioGroup btn4_farther= convertView.findViewById(R.id.btn4_farther);
        final RadioButton btn1 = convertView.findViewById(R.id.btn1);   //全选
        final RadioButton btn4 = convertView.findViewById(R.id.btn4);   //部分
        Button btn11 = convertView.findViewById(R.id.btn5);             //number--
        Button btn22 = convertView.findViewById(R.id.btn6);              //number++



        //设置控件内容
        photo.setImageResource(buycars.get(position).getPhotoId());
        name.setText(buycars.get(position).getName());
        message.setText(buycars.get(position).getMessage());
        price.setText(buycars.get(position).getMoney());
        number.setText(buycars.get(position).getCounter());



        //设置事件监听器
        btn11.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                notifyDataSetChanged();
                String message=buycars.get(position).getCounter();
                int num = Integer.valueOf(Short.valueOf(message));
                if(num>1){
                    num--;
                    buycars.get(position).setCounter(num+"");
                }else{
                    buycars.get(position).setCounter("1");
                }
                notifyDataSetChanged();
            }
        });


        btn22.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                notifyDataSetChanged();
                String message=buycars.get(position).getCounter();
                int num = Integer.valueOf(Short.valueOf(message));
                if(num>=1){
                    num++;
                    buycars.get(position).setCounter(num+"");
                }
                Log.e("按钮1","22222222222222222");
                notifyDataSetChanged();
            }
        });


//-------------------------------------------商品按钮点击选中与取消效果
        btn1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if(btn_situation[0]==0){
                    btn1.setChecked(true);
                    btn4.setChecked(true);
                    btn_situation[0] =1;
                    btn_situation[1] =1;
                }else{
                    btn1.setChecked(false);
                    btn4.setChecked(false);
                    btn_situation[0] =0;
                    btn_situation[1] =0;
                    btn1_farther.clearCheck();
                    btn4_farther.clearCheck();
                }
            }
        });

        btn4.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if(btn_situation[1]==0){
                    btn4.setChecked(true);
                    btn_situation[1] =1;
                }else{
                    btn4.setChecked(false);
                    btn_situation[1] =0;
                    btn4_farther.clearCheck();
                }
            }
        });


        return convertView;
    }
}
--------------------------------------------------------








#5

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/bigget"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:descendantFocusability="blocksDescendants">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="70dp"
    android:orientation="horizontal">



    <RadioGroup
        android:id="@+id/btn1_farther"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">


        <RadioButton
            android:id="@+id/btn1"
            android:layout_width="30dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:layout_marginTop="25dp" />
    </RadioGroup>








    <ImageView
        android:id="@+id/img1"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_marginLeft="55dp"
        android:layout_marginTop="22dp"
        android:src="@drawable/dianpu" />

    <TextView
        android:id="@+id/text1"
        android:textSize="20sp"
        android:layout_width="wrap_content"
        android:layout_marginTop="30dp"
        android:layout_toRightOf="@id/img1"
        android:layout_height="wrap_content"/>


    <Button
        android:id="@+id/bt_more"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_marginLeft="-10dp"
        android:layout_marginTop="22dp"
        android:layout_toRightOf="@id/text1"
        android:background="@drawable/jiantou" />

    <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="领劵"
            android:layout_marginLeft="350dp"
            android:layout_marginTop="30dp"
            android:textSize="20sp"/>
    </RelativeLayout>

    <LinearLayout
        android:id="@+id/btn3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="70dp">





        <RadioGroup
            android:id="@+id/btn4_farther"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <RadioButton
                android:id="@+id/btn4"
                android:layout_width="30dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="50dp" />


        </RadioGroup>





        <ImageView
            android:id="@+id/img2"
            android:layout_width="130dp"
            android:layout_marginLeft="5dp"
            android:layout_height="125dp" />

        <TextView
            android:id="@+id/text2"
            android:textSize="20sp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>





        <ImageView
            android:id="@+id/img3"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_marginTop="105dp"
            android:layout_marginLeft="-225dp"
            android:src="@drawable/yuan" />


        <TextView
            android:id="@+id/text3"
            android:textSize="20sp"
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="100dp" />






        <Button
            android:id="@+id/btn5"
            android:layout_toRightOf="@id/img3"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:background="@drawable/fangkuai"
            android:text="--"
            android:layout_marginLeft="40dp"
            android:layout_marginTop="100dp" />
        <TextView
            android:id="@+id/text4"
            android:layout_width="25dp"
            android:layout_height="20dp"
            android:textColor="#000000"
            android:background="@drawable/fangkuai"
            android:paddingLeft="6dp"
            android:layout_marginTop="99dp"/>
        <Button
            android:id="@+id/btn6"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:text="+"
            android:background="@drawable/fangkuai"
            android:layout_marginTop="100dp"/>

    </LinearLayout>
</RelativeLayout>
 


 

解决按钮事件导致页面原始的item事件覆盖的方法

  1. 在布局文件的根页面添加
    在这里插入图片描述
  2. 在按钮处添加
    在这里插入图片描述

添加增添按钮

  1. 先在activity_main里添加Button属性,设置id。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android" >

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




    <Button
        android:id="@+id/tianjia"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="添加"
        android:layout_alignParentBottom="true"/>
</RelativeLayout>
  1. 因为MainActivity引用的上述文件,所以添加的具体实现要在里面写
package com.example.xueli;

import androidx.appcompat.app.AppCompatActivity;

import android.media.session.PlaybackState;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.AdapterView;
import android.widget.Button;
import android.widget.ListView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    private List<BuyCar> goods=new ArrayList<>();
    private BuyCarAdapter customAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        准备数据
        initData();
        定义item'文件    //常见adapter,绑定adapter
        customAdapter=new BuyCarAdapter(this,goods,R.layout.newbuycar);
        ListView listview=findViewById(R.id.sss);
        listview.setAdapter(customAdapter);
        //这里也可以设计事件点击效果
        listview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                //打印商品名称
                Log.e("商品的名字",goods.get(position).getName());
            }
        });

       

        设置添加按钮
        addButton();
    }
    public void initData(){
        BuyCar car1=new BuyCar("华为旗舰店","正品Huawei/华为 Mate 9\n全网通4G双卡双待指纹徕\n卡双摄智能4G手机","2000.0",R.drawable.phone,"3");
        BuyCar car2=new BuyCar("创意良品","iWALK三合一充电线移动\n电源一拖二可爱迷你充电\n宝苹果安卓充电线","88.0",R.drawable.erji,"9");
        goods.add(car1);
        goods.add(car2);
    }






    public void addButton(){
        Button addbtn=findViewById(R.id.tianjia);
        addbtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //添加信息
                BuyCar car3=new BuyCar("店铺名","店铺信息","商品价格",R.drawable.erji,"6");
                //修改数据源
                goods.add(car3);
                //更新adapter
                customAdapter.notifyDataSetChanged();
            }
        });
    }



}

猜你喜欢

转载自blog.csdn.net/qq_44627608/article/details/104961728
今日推荐