当前位置: 首页 > news >正文

Android 开发问题:CardView 的阴影效果会受到父容器的裁切

  • 在 Android 开发中,CardView 的阴影效果会受到父容器的裁切(见上图),此问题下的父容器可以分为两种
  1. 无 padding 的父容器
<LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"><androidx.cardview.widget.CardViewandroid:layout_width="492px"android:layout_height="420px"app:cardCornerRadius="10px"app:cardElevation="8px"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" /></androidx.cardview.widget.CardView>
</LinearLayout>
  1. 有 padding 的父容器
<LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:padding="20px"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"><androidx.cardview.widget.CardViewandroid:layout_width="492px"android:layout_height="420px"app:cardCornerRadius="10px"app:cardElevation="8px"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" /></androidx.cardview.widget.CardView>
</LinearLayout>
处理策略
(1)针对无 padding 的父容器
  1. 禁用裁切,给祖父容器添加 android:clipChildren="false"
<?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:id="@+id/main"android:layout_width="match_parent"android:layout_height="match_parent"android:clipChildren="false"tools:context=".ViewShadowActivity"><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"><androidx.cardview.widget.CardViewandroid:layout_width="492px"android:layout_height="420px"app:cardCornerRadius="10px"app:cardElevation="8px"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" /></androidx.cardview.widget.CardView></LinearLayout></androidx.constraintlayout.widget.ConstraintLayout>
  1. 添加 CardView 的外边距,给 CardView 添加 android:layout_margin
<LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"><androidx.cardview.widget.CardViewandroid:layout_width="492px"android:layout_height="420px"android:layout_margin="20px"app:cardCornerRadius="10px"app:cardElevation="8px"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" /></androidx.cardview.widget.CardView>
</LinearLayout>
  1. 启用 CardView 的兼容模式,给 CardView 添加 app:cardUseCompatPadding="true"
<LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"><androidx.cardview.widget.CardViewandroid:layout_width="492px"android:layout_height="420px"app:cardUseCompatPadding="true"app:cardCornerRadius="10px"app:cardElevation="8px"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" /></androidx.cardview.widget.CardView>
</LinearLayout>
(2)针对有 padding 的父容器
  • 给父容器添加 android:clipToPadding="false"
<LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:clipToPadding="false"android:padding="20px"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"><androidx.cardview.widget.CardViewandroid:layout_width="492px"android:layout_height="420px"app:cardCornerRadius="10px"app:cardElevation="8px"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" /></androidx.cardview.widget.CardView>
</LinearLayout>
http://www.lryc.cn/news/571288.html

相关文章:

  • STM32 实现解析自定义协议
  • HTTP 请求中的 `Content-Type` 类型详解及前后端示例(Vue + Spring Boot)
  • 为什么您应该停止使用 1080 玻璃
  • eBPF(6)--uprobe
  • MRI学习笔记-BrainNet Viewer
  • python大学生志愿者管理系统-高校志愿者管理信息系统
  • llama_index chromadb实现RAG的简单应用
  • 基于Java的Excel列数据提取工具实现
  • React Native 搭建iOS与Android开发环境
  • leetcode_3584子序列首尾元素乘积最大值
  • phpstorm无缝切换vscode
  • 在Linux上搭建FRP服务器及Docker部署FRP实现内网穿透方案二(Nginx前置 + FRP TCP穿透)
  • C++智能指针(详细解答)
  • 多维度剖析Kafka的高性能与高吞吐奥秘
  • FPGA基础 -- Verilog语言要素之向量线网与标量线网
  • 自然语言处理(NLP)核心技术:从词嵌入到Transformer
  • 微信小程序一款不错的文字动画
  • 密度泛函涨落理论在医疗人工智能中的应用与展望:多尺度物理驱动智能的新范式
  • Spring Boot + MyBatis + Redis Vue3 Docker + Kubernetes + Nginx
  • OpenCV 视频文件读取
  • Linux核心文件(core file)详解
  • Vue 3 常用响应式数据类型详解:ref、reactive、toRef 和 toRefs
  • 【Linux系统】初识虚拟地址空间
  • Java微服务-新建demo
  • UTF-8 发展历史以及与 UTF-16/GBK 之间的差异
  • AI办公提效,Deepseek + wps生成ppt
  • 网络安全之任意文件读取利用
  • 如何在应用中实现地图关键字搜索和标记聚合功能?
  • 图扑软件 | 3D 场景视频嵌入应用
  • 【pytest进阶】Pytest之conftest详解