Android控件之高级控件——ListView、cardView、屏幕适配_cardview listview

一：ListView

 

1.什么是ListView

如下通过一行行列表视图展示数据的一种控件，应用场景比如通讯录、短信列表、聊天联系人、文件夹列表、评论列表、应用列表等

2.Layout中如何实现ListView

第一步：layout中创建ListView

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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">
    <ListView
        android:id="@+id/list_item"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</LinearLayout>

效果

第二步：创建每一行的Layout。item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <TextView
        android:id="@+id/list_item"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginLeft="30dp"
        android:paddingTop="12dp"
        android:text="今天是个好日子"
        android:textSize="24dp" />
 
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="24dp"
        android:text="阅读原文"
        android:layout_marginLeft="90dp"/>
</LinearLayout>

效果

第三步：使用adapter将数据填充到每一行的视图中

public class MainActivity extends AppCompatActivity {
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ListView listView = findViewById(R.id.list_item);
        List<String> list = new ArrayList<>();
        list.add("Android知识了解");
        list.add("Android开发环境搭建");
        list.add("Android控件学习");
        list.add("Android网络操作");
        listView.setAdapter(new ListAdapter(list));
    }
 
    public class ListAdapter extends BaseAdapter {
        List<String> names;
 
        public ListAdapter(List<String> list) {
            names = list;
        }
 
        @Override
        public int getCount() {//有多少条数据
            return names.size();
        }
 
        @Override
        public Object getItem(int position) {//获取当前postion位置的这条数据
            return names.get(position);
        }
 
        @Override
        public long getItemId(int position) {//获取当前postion位置的id
            return position;
        }
 
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            //xml转成java代码操作
            LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = layoutInflater.inflate(R.layout.item, null);
            TextView textView = convertView.findViewById(R.id.item_text);
            Button button = convertView.findViewById(R.id.button);
            textView.setText(names.get(position));
            return convertView;
        }
    }
}

效果

3.给ListView添加头部Header

我们要实现的需求如下，当我们向上翻动时候，顶部也会滚动

要实现以上的header效果，主要用到的方法就是ListView的addHeaderView(View view)，需要一个view对象，所以我们创建一个header.xml的layout

<?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">
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:background="@mipmap/header"
        />
</LinearLayout>

效果

java代码，只需在3中代码的onCreate方法加上以下代码

//读取layout转成View
LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View header= layoutInflater.inflate(R.layout.header, null);
listView.addHeaderView(header);

注：如果要实现翻滚列表但是顶部图片不随着翻动效果，我们只需将界面设计成顶部一个ImageView控件加上下面一个ListView控件

4.通过ListView展示手机所有应用列表

我们要实现的需求如下所示，展示所有应用列表，并且点击能够进入当前应用

这里每行的layout的xml文件发生了点变化，代码如下

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="match_parent">
 
 
 
    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="24dp"
        android:text="阅读原文"
        android:layout_marginLeft="10dp"
       />
    <TextView
        android:id="@+id/item_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginLeft="30dp"
        android:paddingTop="12dp"
        android:text="今天是个好日子"
        android:textSize="24dp" />
</LinearLayout>

整个java代码如下

 
public class MainActivity extends AppCompatActivity {
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ListView listView = findViewById(R.id.list_item);
        final List<ResolveInfo> list = getAppInfos();
        listView.setAdapter(new ListAdapter(list));
        //添加每个item的点击事件
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                String packageName = list.get(position).activityInfo.packageName;
                String className = list.get(position).activityInfo.name;
                ComponentName componentName = new ComponentName(packageName, className);
                final Intent intent = new Intent();
                intent.setComponent(componentName);
                startActivity(intent);
            }
        });
    }
 
 
    public class ListAdapter extends BaseAdapter {
        List<ResolveInfo> names;
 
        public ListAdapter(List<ResolveInfo> list) {
            names = list;
        }
 
        @Override
        public int getCount() {//有多少条数据
            return names.size();
        }
 
        @Override
        public Object getItem(int position) {//获取当前postion位置的这条数据
            return names.get(position);
        }
 
        @Override
        public long getItemId(int position) {//获取当前postion位置的id
            return position;
        }
 
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            //xml转成java代码操作
            LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = layoutInflater.inflate(R.layout.item, null);
            TextView textView = (TextView) convertView.findViewById(R.id.item_text);
            ImageView imageView = (ImageView) convertView.findViewById(R.id.image);
            textView.setText(names.get(position).activityInfo.loadLabel(getPackageManager()));
            imageView.setImageDrawable(names.get(position).activityInfo.loadIcon(getPackageManager()));
            return convertView;
        }
    }
 
    //获取所有的应用信息
    private List<ResolveInfo> getAppInfos() {
        Intent intent = new Intent(Intent.ACTION_MAIN, null);
        intent.addCategory(Intent.CATEGORY_LAUNCHER);
        return getPackageManager().queryIntentActivities(intent, 0);
    }
}

 

5.优化ListView

我们上面实现的ListView缺点就是如果数据很多的时候，我们每次翻动都会加载每个item进行渲染，我们可以通过缓存当前这个item达到优化

具体修改的代码如下

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder holder = new ViewHolder();
    if(convertView==null){
        LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = layoutInflater.inflate(R.layout.item, null);
        holder.textView  = (TextView) convertView.findViewById(R.id.item_text);
        holder.imageView  = (ImageView) convertView.findViewById(R.id.image);
        convertView.setTag(holder);
    }else{
        holder = (ViewHolder)convertView.getTag();
    }
    holder.textView.setText(names.get(position).activityInfo.loadLabel(getPackageManager()));
    holder.imageView .setImageDrawable(names.get(position).activityInfo.loadIcon(getPackageManager()));
    return convertView;
}
public  class ViewHolder{
    public TextView textView;
    public ImageView imageView;
}

 

二：CardView

 

1.CardView是什么？

CardView是Android5.0之后新增的一个继承自FrameLayout，方便作为其他控件容器添加3D阴影和圆角效果，使用的时候需要独立引入com.android.support:cardview-v7:26.1.0

如下效果

2.CardView常用属性

app:cardBackgroundColor背景色

app:cardCornerRadius圆角半径

app:contentPadding内容padding

app:cardElevation阴影大小

cardUseCompatPadding 默认false，用于5.0以上，true则添加额外的padding绘制阴影

cardPreventCornerOverlap 默认true 用于5.0以下，添加额外padding防止内容和圆角重叠

 

 

三：屏幕适配

 

让我们的app使用不同尺寸、不同分辨率的设备，完成屏幕适配主要包括布局上的适配和图片上的适配

几个概念

屏幕尺寸：是屏幕对角线的长度单位是英寸，1英寸=2.54厘米，常见尺寸2.4、2.8、3.5、3.7、4.2、5.0、5.5、6.0

屏幕分辨率：指在横纵向上像素点数，单位是px,1px=1个像素点，一般以纵向像素*横向像素如1960*1080

屏幕像素密度：尺寸不变的情况下，分辨率越高屏幕越清晰屏幕像素密度越高，即屏幕像素密度指的是每英寸上的像素点数单位是dpi（求法就是首先根据三角形求出对角线上的像素，然后除以屏幕尺寸即可），

dp的范围划分

 

布局适配

1.禁用绝度布局

2.少用px作为单位，改用dp或者dip

3.合理使用wrap_content（先按照内容的多少设定控件大小，再按照权重比例分配）、match_parent（控件大小=父容器大小+权重比例*剩余空间大小）、layout_weight（0dp，直接按照你所设定比例分配）

图片适配

1.提供不容分辨率的图

2.使用自动拉伸图

 

文章首发地址：www.javayihao.top

文章首发公众号：java一号