在android中创建对cardview的视图答案

【问题标题】：create view over cardview in android在android中创建对cardview的视图
【发布时间】：2015-11-20 09:39:43
【问题描述】：

我想创建这个布局

这是我使用此代码的卡片视图（灰色视图）和图像视图（蓝色视图）

<FrameLayout 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="match_parent"
android:background="@color/abc_search_url_text_normal"
android:orientation="vertical">

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_alignParentBottom="true"
    android:layout_gravity="bottom"
    android:layout_marginBottom="3dp"
    android:paddingTop="5dp"
    app:cardBackgroundColor="@color/abc_input_method_navigation_guard">


</android.support.v7.widget.CardView>

<ImageView
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_gravity="bottom"
    android:layout_marginBottom="30dp"
    android:layout_marginRight="10dp"
    android:scaleType="fitXY"
    android:src="@drawable/abc_ratingbar_full_material" />

</FrameLayout>

但结果我的图像视图转到 cardview 的后面，我尝试使用 relativelayout 而不是 framelayout，但结果相同。

【问题讨论】：

标签： android xml android-layout android-cardview

【解决方案1】：

API 21+ 中 CardView 默认具有高程，您可以将高程控制为小于 ImageView 的高程

    <android.support.v7.widget.CardView  xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:cardElevation="1dp"/>

 <ImageView
        android:id="@+id/image_view_user"
        android:layout_width="48dp"
        android:layout_height="48dp"
         android:elevation="2dp"/>

在 Pre 21 中你可以使用

overlayView.bringToFront();
root.requestLayout();
root.invalidate();

如果您有不同的海拔，这在 21 岁以上将不起作用

【讨论】：

【解决方案2】：

只需将 CardView 放在其他视图中，如 FrameLayout 中。如下所示：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_marginStart="10sp"
android:layout_marginEnd="10sp"
>
<FrameLayout
    android:layout_marginTop="15sp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="100sp"
        app:cardCornerRadius="5sp"
        app:cardBackgroundColor="@color/colorPrimary">
    <!--other view items -->
    </android.support.v7.widget.CardView>
</FrameLayout>
     <de.hdodenhof.circleimageview.CircleImageView
        android:layout_width="90sp"
        android:layout_height="90sp"
        app:civ_border_width="2dp"
        android:layout_marginStart="10sp"
        app:civ_border_color="@color/colorPrimaryDark"
        android:id="@+id/profileImg"
        android:background="@drawable/ic_if_profle_1055000"
        xmlns:app="http://schemas.android.com/apk/res-auto"/>

截图：

【讨论】：

【解决方案3】：

试试：

使用相对布局
将 ImageView 与父级右/端对齐并添加右/端边距
将 FAB 与卡片视图顶部对齐并添加负边距

<RelativeLayout
    ...>
    <CardView
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="120dp"
    />

   <ImageView
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_alignTop="@id/cardView"
    android:layout_marginTop="-32dp"
    android:layout_marginRight="20dp"
   />

</RelativeLayout>

【讨论】：

我也这样做，但有趣的事情是在这里，这不适用于 cardview 我以前用另一种类型的视图和工作，但 cardview 没有
最后一次尝试，用线性布局包裹你的卡片视图
@cwfei 请也回答这个问题：stackoverflow.com/questions/36393540/…

【解决方案4】：

只需将高程添加到 ImageView 大于 CardView 高程

<FrameLayout 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="match_parent"
android:background="@color/abc_search_url_text_normal"
android:orientation="vertical">

<androidx.cardview.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:layout_alignParentBottom="true"
    android:layout_gravity="bottom"
    android:layout_marginBottom="3dp"
    android:paddingTop="5dp"
    app:cardBackgroundColor="@color/white">


</androidx.cardview.widget.CardView>

<ImageView
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_gravity="bottom"
    android:layout_marginBottom="30dp"
    android:layout_marginRight="10dp"
    android:scaleType="fitXY"
    android:elevation="8dp"
    android:src="@drawable/ic_launcher_background" />

【讨论】：

谢谢，海拔确实改变了视图的顺序

【解决方案5】：

您可以将 CardView 包装在 FrameLayout 中，但随后会裁剪阴影。设置 android:clipChildren="false" 来修复它

<android.support.constraint.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="wrap_content"
    android:clipChildren="false"
    android:layout_height="140dp">

<FrameLayout
    android:id="@+id/frameLayout4"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="16dp"
    android:clipChildren="false">

    <android.support.v7.widget.CardView
        app:cardCornerRadius="@dimen/card_radius"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </android.support.v7.widget.CardView>
</FrameLayout>
</android.support.constraint.ConstraintLayout>

【讨论】：

【解决方案6】：

另一种解决方法是将图像视图包装在卡片视图中。只要确保背景是透明的，包含高度和宽度的内容，它将位于前一个卡片视图的顶部。

【讨论】：