如何将 imageView 放在 cardview 前面？当两者都是相对布局的孩子时答案

【问题标题】：How to bring imageView in front of cardview ? When both are of Relative Layout childs如何将 imageView 放在 cardview 前面？当两者都是相对布局的孩子时
【发布时间】：2016-04-04 02:15:50
【问题描述】：

我有一个布局 XML：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/containor"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff6da"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.vats.vatishs.cardviewprogrammatically.MainActivity">

        <FrameLayout
            android:id="@+id/card"
            android:layout_width="220dp"
            android:layout_marginTop="10dp"
            android:layout_height="wrap_content">

            <TextView
                android:background="@color/white"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:padding="10dp"
                android:text="Hello I am a text View." />

        </FrameLayout>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="210dp"
        android:background="@drawable/select_delete_chim" />

</RelativeLayout>

效果很好。结果将是框架布局上方的图像视图，但是当我使用以下 xml 时，我已将框架布局替换为 CardView：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/containor"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff6da"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.vats.vatishs.cardviewprogrammatically.MainActivity">

        <android.support.v7.widget.CardView
            android:id="@+id/card"
            android:layout_width="220dp"
            android:layout_marginTop="10dp"
            android:layout_height="wrap_content">

            <TextView
                android:background="@color/white"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:padding="10dp"
                android:text="Hello I am a text View." />

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

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="210dp"
        android:background="@drawable/select_delete_chim" />
</RelativeLayout>

那么结果会是：CardView后面的ImageView。

有什么解决办法吗？

还有一件事，它在棒棒糖之前的设备上可以正常工作，但在棒棒糖上它不起作用。

Output with CardView on pre-lollipop devices (required output)

Output with CardView on lollipop devices

【问题讨论】：

标签： android android-cardview android-elevation

【解决方案1】：

CardView -> app:cardElevation ="4dp"

ImageView -> android:translationZ="6dp"

将 CardView 发送到后面。

【讨论】：

如果你的card和imageview在同一个位置，那么card会覆盖imageView。因此，如果您使用 translationZ 将 imageView 拉到 cardview 上，那么您将看到结果。此外，如果您不想使用高程，则只需增加 translationZ 值。

【解决方案2】：

你可以使用这个属性

  app:cardElevation="0dp"

到 XMl 中的 CardView 。

像这样

   <android.support.v7.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        app:cardElevation="0dp"
        app:cardUseCompatPadding="true">

这将使CardView前面的其他视图

【讨论】：

【解决方案3】：

一个简单的方法是使用这样的东西：

<RelativeLayout  
android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">  

<LinearLayout
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="wrap_content">

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
....
</android.support.v7.widget.CardView>
</LinearLayout>

<ImageView
android:layout_width="wrap_parent"
    android:layout_height="wrap_content">

注意，这是因为cardview的海拔。它的默认高度大于 ImageView。这样，您可以使用 LinearLayout 将 CardView 放入其中。那么就可以使用RelativeLayout在CardView之上制作ImageView了！

【讨论】：

【解决方案4】：

将app:cardElevation="-1dp" 添加到您的xml 中的CardView 将解决此问题。

【讨论】：

【解决方案5】：

这里是您问题的完整答案您可以使用 FrameLayout 包装 CardView 并将 ImageView 放在 CardView 的父级之外

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout ...>
    <FrameLayout...>
        <android.support.v7.widget.CardView...>
            <Content/>
        </android.support.v7.widget.CardView>
    </FrameLayout>
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        ... />
</RelativeLayout>

或者这里是支持棒棒糖以下和之后的Android版本的Java代码

image.bringToFront();
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
     image.setElevation(10);
}

这会将图像带到前面

【讨论】：

【解决方案6】：

CardView 的默认高程大于 ImageView，所以我们必须在 ImageView 中添加比 CardView 的高程更大的高程。

例如imageView.setElevation(10); 和 cardView.setElevation(5);

现在，它在所有设备上都能正常工作。

【讨论】：

您也可以在您的 xml 中执行上述操作，如下所示：android:elevation="10dp" 用于您的 ImageView 和 card_view:cardElevation="5dp" 用于您的 CardView。

【解决方案7】：

这样做，

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/myCardView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    card_view:cardBackgroundColor="@android:color/transparent"
    card_view:cardElevation="0dp">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_edit"
            android:background="@android:color/transparent"/>

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

它将ImageView 带到前面。

【讨论】：

添加高程为“0dp”。
我不希望 imageView 成为 cardView 的子项，因为 imageView 是一个十字图标，我必须将其显示在 cardview 的角落，使其在 cardView 中显示为 1/4并在 cardView 之外休息。
编辑了答案。 imageView 位于具有透明背景的单独卡片视图中。你可以把它放在任何需要的地方。
我想把它一半放在卡片视图上方，一半放在卡片视图外面。所以在cardview中添加imageview是不可能的。
如果你想把一个视图一半放在海拔（CardView）上，一半没有海拔，怎么可能？要将某物放置在升高的表面上，只需升高视图即可。

【解决方案8】：

在cardview上面写Image view，希望能解决问题

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/containor"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff6da"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.vats.vatishs.cardviewprogrammatically.MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="210dp"
        android:src="@drawable/select_delete_chim" />

        <android.support.v7.widget.CardView
            android:id="@+id/card"
            android:layout_width="220dp"
            android:layout_marginTop="10dp"
            android:layout_height="wrap_content">

            <TextView
                android:background="@color/white"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:padding="10dp"
                android:text="Hello I am a text View." />

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

    </RelativeLayout>

【讨论】：

不，它不起作用。如果我更改 xml 中的图像视图位置，即使我的第一个 xml 即框架布局也会失败
也使用 src 代替背景

【解决方案9】：

在初始化 ImageView 之后在你的 java 代码中写下这一行。

imageView.bringToFront();

【讨论】：

代码没什么特别的，只有 onCreate() 方法，我在其中调用了 setContentView()
主要问题是它应该适用于所有设备，但不适用于棒棒糖。