LIstVIew
- ListView是一种多个可滑动项列表的ViewGroup
- 需要使用Adapter(适配器)将集合数据和每一个Item所对应的布局动态适配到ListView中显示
例图.1
使用Adapter显示文本内容
/**
- ArrayAdapter:
-
1)、当数据源是一个数组,可以使用ArrayAdapter适配器
-
2)、默认情况下,ArrayAdapter创建一个视图,每个阵列项目的每个项目上调用toString()并放置在TextView
- ArrayAdapter使用步骤:
-
1)、准备ListView
-
2)、准备ItemLayout
-
3)、准备数据源
-
4)、创建适配器对象
-
5)、设置适配器 (setAdapter)
*/
直接上代码:
1、页面xml文件(activity_array_adapter.xml)
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".ArrayAdapterActivity">
<!-- 1、准备ListView -->
<ListView
android:id="@+id/lv_array_adapter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>
2、item项xml文件 (item_array_adapter.xml)
<?xml version="1.0" encoding="utf-8"?>
<!-- 2、准备Item项 -->
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="60dp"
android:gravity="center_vertical"
android:paddingLeft="20dp"
android:textSize="20sp"
android:textColor="@color/black">
</TextView>
3、页面java代码 (
/**
* ArrayAdapter:
* 1)、当数据源是一个数组,可以使用ArrayAdapter适配器
* 2)、默认情况下,ArrayAdapter创建一个视图,每个阵列项目的每个项目上调用toString()并放置在TextView
*
* ArrayAdapter使用步骤:
* 1)、准备ListView
* 2)、准备ItemLayout
* 3)、准备数据源
* 4)、创建适配器对象
* 5)、设置适配器 (setAdapter)
*/
/**
* Description: 测试ArrayAdapter适配器
* ProjectName: ${PROJECT_NAME}
* Package: com.example.listviewtest
* ClassName: ArrayAdapterActivity
* Author: 菜菜
* CreateDate: 2021/7/21 21:46
*/
public class ArrayAdapterActivity extends AppCompatActivity {
private ListView lv_array_adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_array_adapter);
// 初始化视图对象
lv_array_adapter = findViewById(R.id.lv_array_adapter);
// 3、准备数据源
String[] item = {"ListView","ArrayAdapter适配器","SimpleAdapter适配器","BaseAdapter适配器"};
// 4、创建ArrayAdapter对象
ArrayAdapter<String> adapter = new ArrayAdapter<>(this,R.layout.item_arraay_adapter,item);
/**
* 下面是此构造函数的参数:
* 第一个参数 this 是应用程序上下文。在大多数的情况下使用this 。
* 第二个参数是定义在XML文件中的布局,它是 TextView 数组中的每个字符串。
* 最后一个参数是一个数组,字符串将被填充到文本视图。
*/
// 5、设置适配器
lv_array_adapter.setAdapter(adapter);
}
}
效果图·1
使用SimpleAdapter 显示图文列表
/**
- SimpleAdapter:
-
1)、当数据源是List<Map<String,Object>> 的时候可以使用,可以使用 SimpleAdapter适配器
- SimpleAdapter使用步骤:
-
1)、准备ListView
-
2)、准备ItemLayout
-
3)、准备数据源
-
4)、创建适配器对象
-
5)、设置适配器 (setAdapter)
*/
下面直接上代码:
1、页面xml文件(activity_simple_adapter.xml)
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".SimpleAdapterActivity">
<!-- 1、准备ListView -->
<ListView
android:id="@+id/lv_simple_adapter"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
2、item项xml文件 (item_simple_adapter.xml)
<?xml version="1.0" encoding="utf-8"?>
<!-- 2、准备item项 -->
<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:id="@+id/iv_item_icon"
android:layout_width="60dp"
android:layout_height="60dp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="@+id/tv_item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="@+id/tv_item_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
3、页面java代码(SimpleAdapterActivity.java)
/**
* SimpleAdapter:
* 1)、当数据源是List<Map<String,Object>> 的时候可以使用,可以使用 SimpleAdapter适配器
* SimpleAdapter使用步骤:
* 1)、准备ListView
* 2)、准备ItemLayout
* 3)、准备数据源
* 4)、创建适配器对象
* 5)、设置适配器 (setAdapter)
*/
public class SimpleAdapterActivity extends AppCompatActivity {
private ListView lv_simple_adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_simple_adapter);
// 初始化ListView视图
lv_simple_adapter = findViewById(R.id.lv_simple_adapter);
// 3、准备数据源
List<Map<String,Object>> data = new ArrayList<>();
Map<String,Object> map = new HashMap<>();
map.put("icon",R.drawable.f);
map.put("name","name-1");
map.put("content","content-1");
data.add(map);
for(int i = 2;i <= 12;i++) {
map = new HashMap<>();
map.put("icon",R.drawable.f);
map.put("name","name-" + i);
map.put("content","content-" + i);
data.add(map);
}
// 创建适配器之前的准备工作
// from是map中key的数组
String[] from = {"icon","name","content"};
// to 是item中视图id的数组要和from一一对应
int[] to = {R.id.iv_item_icon,R.id.tv_item_name,R.id.tv_item_content};
// 4、创建SimpleAdapter适配器
SimpleAdapter adapter = new SimpleAdapter(this,
data,R.layout.item_simple_adapter,from,to);
// 5、设置适配器
lv_simple_adapter.setAdapter(adapter);
}
}
使用BaseAdapter 显示图文列表
这里直接上代码
1、页面xml文件(avtivity_base_adapter.xml)
<?xml version="1.0" encoding="utf-8"?>
<!-- 2、准备item项 -->
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".BaseAdapterActivity">
<!-- 准备ListView -->
<ListView
android:id="@+id/lv_base_adapter"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
2、item项xml文件 (item_base_adapter)
<?xml version="1.0" encoding="utf-8"?>
<!-- 2、准备item项 -->
<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:id="@+id/iv_base_icon"
android:layout_width="60dp"
android:layout_height="60dp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="@+id/tv_base_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:id="@+id/tv_base_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</LinearLayout>
3、 每行item的数据信息封装类 (UserInfo.java)
package com.example.listviewtest;
/**
* Description: 每行item的数据信息封装类
* ProjectName: ${PROJECT_NAME}
* Package: com.example.listviewtest
* ClassName: UserInfo
* Author: 菜菜
* CreateDate: 2021/7/21 23:19
*/
public class UserInfo {
private int icon;
private String name;
private String content;
/**
* Description: 无参构造器
* MethodName: UserInfo
* date: 2021/7/21 23:21
* Author: 菜菜
*/
public UserInfo() {
}
/**
* Description: 全参构造器
* MethodName: UserInfo
* date: 2021/7/21 23:22
* Author: 菜菜
*/
public UserInfo(int icon, String name, String content) {
this.icon = icon;
this.name = name;
this.content = content;
}
/**
* Description: 获取icon
* MethodName: getIcon()
* date: 2021/7/21 23:23
* Author: 菜菜
*/
public int getIcon() {
return icon;
}
/**
* Description: 获取name
* MethodName: getName()
* date: 2021/7/21 23:23
* Author: 菜菜
*/
public String getName() {
return name;
}
/**
* Description: 获取content
* MethodName: getContent()
* date: 2021/7/21 23:23
* Author: 菜菜
*/
public String getContent() {
return content;
}
/**
* Description: 设置icon
* MethodName: setIcon
* date: 2021/7/21 23:24
* Author: 菜菜
*/
public void setIcon(int icon) {
this.icon = icon;
}
/**
* Description: 设置name
* MethodName: setName
* date: 2021/7/21 23:24
* Author: 菜菜
*/
public void setName(String name) {
this.name = name;
}
/**
* Description: 设置content
* MethodName: setContent
* date: 2021/7/21 23:24
* Author: 菜菜
*/
public void setContent(String content) {
this.content = content;
}
@Override
public String toString() {
return "UserInfo{" +
"icon=" + icon +
", name='" + name + '\'' +
", content='" + content + '\'' +
'}';
}
}
4、页面逻辑代码(BaseAdapterActivity.java)
/**
* Description: 测试BaseAdapter
* ProjectName: ${PROJECT_NAME}
* Package: com.example.listviewtest
* ClassName: BaseAdapterActivity
* Author: 菜菜
* CreateDate: 2021/7/22 0:40
*/
public class BaseAdapterActivity extends AppCompatActivity {
private ListView lv_base_adapter;
private List<UserInfo> data;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_base_adapter);
// 初始化视图对象
lv_base_adapter = findViewById(R.id.lv_base_adapter);
// 准备数据
data = new ArrayList<>();
for(int i = 1;i <= 15;i++) {
data.add(new UserInfo(R.drawable.f,"name-" + i,"content-" + i));
}
// 创建自定义适配
MyBaseAdapter adapter = new MyBaseAdapter();
// 給列表设置适配器
lv_base_adapter.setAdapter(adapter);
}
/**
* Description: 自定义适配器
* ProjectName: ${PROJECT_NAME}
* Package: com.example.listviewtest
* ClassName: BaseAdapterActivity
* Author: 菜菜
* CreateDate: 2021/7/21 23:31
*/
class MyBaseAdapter extends BaseAdapter {
/**
* Description: 获取数据源数量
* MethodName: getCount()
* date: 2021/7/21 23:31
* Author: 菜菜
*/
@Override
public int getCount() {
return data.size();
}
/**
* Description: 通过下标获取item(就是一项数据源)
* MethodName: getItem
* date: 2021/7/21 23:32
* Author: 菜菜
*/
@Override
public Object getItem(int position) {
return data.get(position);
}
@Override
public long getItemId(int position) {
return 0;
}
/**
* Description: 动态加载item页,得到view对象,并返回
* MethodName: getView
* date: 2021/7/21 23:34
* Author: 菜菜
*/
@Override
public View getView(int position, View convertView, ViewGroup parent) {
// 动态加载页面布局获取view对象
View view = View.inflate(BaseAdapterActivity.this,
R.layout.item_base_adapter, null);
// 根据position设置item的值
UserInfo userInfo = data.get(position);
// 得到item中的视图对象
ImageView imageView = view.findViewById(R.id.iv_base_icon);
TextView name = view.findViewById(R.id.tv_base_name);
TextView content = view.findViewById(R.id.tv_base_content);
// 设置item值
imageView.setImageResource(userInfo.getIcon());
name.setText(userInfo.getName());
content.setText(userInfo.getContent());
return view;
}
}
}