如何Android在设置elevation的情况下，再在上面覆盖控件

最新推荐文章于 2024-06-29 22:19:33 发布

培金

最新推荐文章于 2024-06-29 22:19:33 发布

阅读量1.3k

点赞数

分类专栏：布局 elevatioin translationZ 文章标签： android android studio

本文链接：https://blog.csdn.net/linglaoli/article/details/106675143

版权

本文介绍如何在Android中创建一个有圆角和阴影的布局，并在其上覆盖图片。通过使用ConstraintLayout、自定义Drawable实现圆角以及利用elevation属性添加阴影。遇到底层布局覆盖图片的问题时，可以通过调整TranslateZ属性解决，实现图片位于底层布局之上。

摘要由CSDN通过智能技术生成

我们产品设计师出了一个非常复杂的界面。在有圆角和阴影的布局上面覆盖一个图片，并且图片要超出下层布局。

在这里插入图片描述

设计

因为红色区域的图片要超出绿色的布局。所以我们在这2个控件的上面再添加一个布局，父布局包含这2个控件。由于他们是相对位置，使用相对布局比较合适。而RelativeLayout的替代者非ConstraintLayout莫属。绿色部分的底层布局需要圆角，我们可以自己编写一个Drawable 文件，实现圆角功能。另外需要阴影，那么使用elecation属性就可以了。黄色的文字部分直接放到绿色底层布局中。
如果按照上面的步骤编写，那么你会发现，绿色底层布局会覆盖红色图片。解决这个问题是我们使用TranslateZ属性，此属性是表示布局再Z周方向上的位置。我们设置一个正数，让他再绿色底层布局的上面。

在这里插入图片描述
大概能做出上面的效果。

代码

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