如何使白色按钮在白色图像上可见

Question

我有一些文本和按钮显示在图像视图上，其中图像视图可以包含任何颜色的图像，但如果图像视图上的文本和按钮是白色的，则白色图像会出现问题图像也是白色的，文本和按钮将不可见，但我想使用白色的文本和按钮颜色，是否有任何解决方案我已经添加了高度但它不起作用

例子

1 这是一张色彩丰富的图片，因此几乎可以正确看到按钮 SS

2 这是一张颜色最白的图片，所以根本看不到按钮 SS

我知道我在问一个愚蠢的问题，白色按钮或文本如何在白色图像上可见，对此感到抱歉，但我现在无法更改布局

If you want more references of the code please tell me I will update the question

imagepost_buttons.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/relativeLayoutImagePost"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/userName_Search_10List"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginStart="15dp"
        android:layout_marginBottom="15dp"
        android:elevation="50dp"
        android:fontFamily="@font/roboto"
        android:text="@string/iansomerhalder"
        android:textColor="@color/white"
        android:textSize="15sp"
        android:textStyle="bold"
        tools:ignore="RelativeOverlap" />


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_marginTop="5dp"
        android:layout_marginEnd="20dp"
        android:contentDescription="@string/todo"
        android:elevation="50dp"
        android:src="@drawable/ic_baseline_post_option_icon_24" />

    <ImageView
        android:id="@+id/fav"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="10dp"
        android:layout_marginBottom="19dp"
        android:contentDescription="@string/todo"
        android:elevation="50dp"
        android:src="@drawable/ic_baseline_save_border_24" />

    <ImageView
        android:id="@+id/comment"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="20dp"
        android:layout_toStartOf="@+id/fav"
        android:contentDescription="@string/todo"
        android:elevation="50dp"
        android:src="@drawable/ic_icons8_comment_icon" />


    <ImageView
        android:id="@+id/unPressedLike"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="20dp"
        android:layout_toStartOf="@+id/comment"
        android:contentDescription="@string/todo"
        android:elevation="50dp"
        android:src="@drawable/ic_baseline_heart_border_24"
        android:visibility="visible" />

    <ImageView
        android:id="@+id/likePressed"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="20dp"
        android:layout_toStartOf="@+id/comment"
        android:contentDescription="@string/todo"
        android:elevation="50dp"
        android:src="@drawable/ic_baseline_heart_red_24"
        android:visibility="invisible" />

    <TextView
        android:id="@+id/comentcount"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="9dp"
        android:layout_marginBottom="6dp"
        android:layout_toStartOf="@id/fav"
        android:elevation="50dp"
        android:fontFamily="@font/roboto"
        android:text="@string/_125"
        android:textColor="@color/white"
        android:textSize="10sp"
        android:textStyle="bold|normal"
        tools:ignore="RelativeOverlap,SmallSp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="9dp"
        android:layout_marginBottom="6dp"
        android:layout_toStartOf="@+id/comment"
        android:elevation="50dp"
        android:fontFamily="@font/roboto"
        android:text="@string/_1_2k"
        android:textColor="@color/white"
        android:textSize="10sp"
        android:textStyle="bold|normal"
        tools:ignore="RelativeOverlap,SmallSp" />


</RelativeLayout>

Answer 1

您可以在图片底部设置一些深色渐变，以确保白色文本可见。创建渐变可绘制对象：

gradient.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#FF000000"
        android:endColor="#00000000"
        android:angle="90" />    
</shape>

然后将其添加到您的布局中：

<?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/relativeLayoutImagePost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/gradient">

    ...

</RelativeLayout>

您可以尝试将这种类型的渐变添加到图像本身，但这可能需要您稍微缩放渐变。

如何使白色按钮在白色图像上可见

How to make white buttons visible on a white image

android

user-interface

android-imageview