如何在 ConstraintLayout 中将 ImageView 放在 CardView 之上
How to put ImageView on top of CardView in ConstraintLayout
我想创建这样的布局,但我不知道如何将 CardView 背景放在 ImageView 下,然后将 TextView 设置在图像下方。图片的高度应为 300dp,宽度应为 200dp。
将第一个卡片的底部和顶部与第二个 CardView 的顶部约束在一起,这样您就可以将第一个卡片视图的中心与第二个 CardView 的顶部对齐。
因此,第一个 CradView 位于上方,只需添加一个高于下方卡片的高度即可
例如:
<?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=".MainActivity2">
<androidx.cardview.widget.CardView
app:cardCornerRadius="15dp"
android:id="@+id/bottomCard"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_margin="20dp"
app:cardElevation="9dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias=".7">
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
app:cardElevation="10dp"
app:cardBackgroundColor="@color/purple_700"
app:cardCornerRadius="15dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="@id/bottomCard"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/bottomCard">
<ImageView
android:id="@+id/image"
android:layout_width="250dp"
android:layout_height="300dp"
android:background="@drawable/ic_android_black_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
这是输出
你必须对卡片视图使用 app:cardElevation
attr,对其他视图使用 android:elevation
attr
我想创建这样的布局,但我不知道如何将 CardView 背景放在 ImageView 下,然后将 TextView 设置在图像下方。图片的高度应为 300dp,宽度应为 200dp。
将第一个卡片的底部和顶部与第二个 CardView 的顶部约束在一起,这样您就可以将第一个卡片视图的中心与第二个 CardView 的顶部对齐。 因此,第一个 CradView 位于上方,只需添加一个高于下方卡片的高度即可
例如:
<?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=".MainActivity2">
<androidx.cardview.widget.CardView
app:cardCornerRadius="15dp"
android:id="@+id/bottomCard"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_margin="20dp"
app:cardElevation="9dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias=".7">
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
app:cardElevation="10dp"
app:cardBackgroundColor="@color/purple_700"
app:cardCornerRadius="15dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="@id/bottomCard"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/bottomCard">
<ImageView
android:id="@+id/image"
android:layout_width="250dp"
android:layout_height="300dp"
android:background="@drawable/ic_android_black_24dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
这是输出
你必须对卡片视图使用 app:cardElevation
attr,对其他视图使用 android:elevation
attr