如何在图像视图上放置一个 trasperant 叠加层，其中图像视图高度将是动态的答案

【问题标题】：How to place a trasperant overlay over an imageview, where the image view height will be dynamic如何在图像视图上放置一个 trasperant 叠加层，其中图像视图高度将是动态的
【发布时间】：2015-08-20 06:51:56
【问题描述】：

我有一个图像视图，我想用透明覆盖覆盖整个图像视图。我有这个代码sn-p

       <RelativeLayout
        android:id="@+id/photoLayout"
        android:layout_below="@id/view_invites_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        >

        <ImageView
            android:id="@+id/photo"
            android:layout_width="360dp"
            android:layout_height="162dp"
            android:gravity="center"
            android:scaleType="fitXY"/>



        <RelativeLayout
            android:id="@+id/layoutOverlay"
            android:layout_width="360dp"
            android:layout_height="162dp"
            android:layout_gravity="center"
            android:layout_centerInParent="true"
            android:background="@color/white_transperent80"
            android:visibility="visible"
            android:orientation="horizontal">

            <Button
                android:id="@+id/btnAccept"
                android:layout_width="94dp"
                android:layout_height="36dp"
                android:layout_marginLeft="13dp"
                android:layout_marginTop="20dp"
                android:layout_centerInParent="true"
                android:text="ACCEPT"
                android:textColor="@color/white"
                android:textStyle="bold"
                android:textSize="14sp"
                android:layout_gravity="center_vertical"
                android:background="@color/colorAccent"
                android:scaleType="fitXY"/>

            <TextView
                android:id="@+id/txtRSVP"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/btnAccept"
                android:layout_marginTop="8dp"
                android:layout_centerHorizontal="true"
                android:text="RSVP by Jul 15,2015"
                android:textSize="18sp"
                android:textStyle="bold"
                android:textColor="@color/txtRsvp"></TextView>

        </RelativeLayout>

</RelativeLayout>

这对我来说适用于固定 image view size 。但是，如果我动态更改 Imageview 大小，即使我将“layoutOverlay”的宽度和高度更改为“fil_parent”或“match_parent”，它也不起作用。请帮忙！

【问题讨论】：

不确定是否有帮助，但也许您可以查看新的 CoordinatorLayout。它允许您在视图之间添加依赖关系并定义行为，以便视图可以在另一个视图更改时做出反应。我相信您可以在背景图像更改大小时更改叠加层的位置。自己没用过，得自己摸索。希望对您有帮助:)
虽然我没试过，反正我会试一试的。谢谢

标签： android android-layout android-relativelayout

【解决方案1】：

更新

这可能是不可能的。我尝试了几种方法。我发现的一个可怕的快捷方式是将具有不同 id 的 imageView 放在 layoutOverlay 中，并将可见性设置为不可见。您必须将图像设置为两个视图。

<RelativeLayout
        android:id="@+id/photoLayout"
        android:layout_below="@id/view_invites_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        >

        <ImageView
            android:id="@+id/photo"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:scaleType="fitXY"/>



        <RelativeLayout
            android:id="@+id/layoutOverlay"
            android:layout_width="360dp"
            android:layout_height="162dp"
            android:layout_gravity="center"
            android:layout_centerInParent="true"
            android:background="@color/white_transperent80"
            android:visibility="visible"
            android:orientation="horizontal">
         <ImageView
            android:id="@+id/photo_two"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:visibility="invisible"
            android:gravity="center"
            android:scaleType="fitXY"/>

            <Button
                android:id="@+id/btnAccept"
                android:layout_width="94dp"
                android:layout_height="36dp"
                android:layout_marginLeft="13dp"
                android:layout_marginTop="20dp"
                android:layout_centerInParent="true"
                android:text="ACCEPT"
                android:textColor="@color/white"
                android:textStyle="bold"
                android:textSize="14sp"
                android:layout_gravity="center_vertical"
                android:background="@color/colorAccent"
                android:scaleType="fitXY"/>

            <TextView
                android:id="@+id/txtRSVP"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/btnAccept"
                android:layout_marginTop="8dp"
                android:layout_centerHorizontal="true"
                android:text="RSVP by Jul 15,2015"
                android:textSize="18sp"
                android:textStyle="bold"
                android:textColor="@color/txtRsvp"></TextView>

        </RelativeLayout>

</RelativeLayout>

旧答案 将imageView移入layoutOverlay，将RelativeLayout的宽高设置为wrap_content。按钮和文本应该出现在图像上。让我知道它是否有效。祝你有美好的一天

【讨论】：

叠加层不会一直可见。所以如果叠加层是单独的布局会很方便。
将 layoutOverlay 高度更改为 fill_parent。如果不起作用，请分享屏幕截图
这可能是不可能的。我尝试了几种方法。我发现的一个可怕的快捷方式是将具有不同 id 的 imageView 放在 layoutOverlay 中，并将可见性设置为不可见。更新答案

【解决方案2】：

将layoutOverlayRelativeLayout 的宽度/高度从固定大小更改为 wrap_content 并添加以下内容：

android:layout_alignBottom="@id/photo"
android:layout_alignTop="@id/photo"
android:layout_alignEnd="@id/photo"
android:layout_alignRight="@id/photo"
android:layout_alignStart="@id/photo"
android:layout_alignLeft="@id/photo"

【讨论】：