layui 卡片式列表_CardView實現卡片式列表展示

前言

在实现列表展示的时候，偶尔我们想在item下面加点阴影，让每个item看起来更立体些，那么这种效果的实现，让我联想到了卡片控件CardView,那么这篇文章就让我们来学习下CardView的基本使用吧。

今天涉及到的内容有：

ImageView 缩放属性的讲解

CardView的基本讲解

首先来波效果图：

1.gif

2.png

本篇文章实现的是一个图片列表的卡片式展示效果。接下来就进行具体的讲解。

一.ImageView 缩放属性的讲解

由于实现的是图片列表的展示，于是使用到了ImageView这个控件，ImageView在设置图片的时候，涉及到图片缩放的问题，ImageView的scaleType分以下几种类型：

center：将图片按原本大小居中显示在控件上，若图片长/宽大于控件宽/高，则将图片中间位置显示到控件上。

centerCrop：将图片按比例缩放到控件上展示，图片的长/宽 大于或等于 控件宽/高

centerInside：将图片按比例缩放到控件上展示，图片的长/宽 小于或等于控件宽/高

fitCenter：将图片按比例缩放到控件宽度，居中显示

fitStart：将图片按比例缩放到控件宽度，靠近view顶部显示

fitEnd：将图片按比例缩放到控件宽度，靠近view底部显示

fitXY：不按比例缩放图片，目标是把图片塞满整个View，可能会导致图片变形

二. CardView的基本讲解

CardView继承自FrameLayout，源码如下：

public class CardView extends FrameLayout {

如此看来，CardView算是一个布局控件了。

CardView引用

android v4或v7包引用如下：

implementation 'com.android.support:cardview-v7:25.3.1'

androidx 包引用如下：

implementation 'androidx.cardview:cardview:1.0.0-beta01'

CardView属性介绍