android 使用ImageView填充自定义RelativeLayout且不超出其限制

41ik7eoe  于 2023-04-10  发布在  Android
关注(0)|答案(2)|浏览(112)

我试图创建一个对象来填充一个列表视图,这样如果我传递给它一个特定的图像,它会填充它的限制,而不会超过它定义的区域。为了做到这一点,我创建了一个可绘制的文件,所以如果我引用它作为背景,我的相对布局会转换为圆形。问题是,对于我的本Map像,显然没有问题,或者至少设计师没有表现出任何问题填充它。这是我希望每个项目看起来像任何图像尺寸:
Ideal image shape
但是每当我尝试用一个外部图像填充它时,位于Firebase中,图像超越了这个形状,只是填充了由相对布局定义的整个区域,显示如下:
How it looks atm
我已经尝试了许多不同的imageview设置后,定义cliptooutline在relativelayout,高度,宽度,规模类型,甚至给它的背景形状已经定义。有人可以帮助我纠正我的xml或找到一种方法,使我的代码行为如预期的请?
我的xml代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/white">

    <RelativeLayout
        android:id="@+id/relLayout1"
        android:layout_width="match_parent"
        android:layout_marginTop="10dp"
        android:layout_height="170dp"
        android:background="@drawable/event_shape"
        android:clipToOutline="true">

        <ImageView
            android:id="@+id/evento_banner"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitXY"
            android:src="@drawable/evento_banner"/>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_alignTop="@+id/relLayout1"
        android:layout_marginTop="60dp"
        android:background="@drawable/event_shape">

        <TextView
            android:id="@+id/evento"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:layout_marginLeft="30dp"
            android:layout_marginTop="27dp"
            android:text="Evento"
            android:textColor="@color/black"
            android:textSize="16sp"
            android:textStyle="bold">

        </TextView>
        <TextView
            android:id="@+id/fechainicio"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="30dp"
            android:text="20/10/2023"
            android:textColor="@color/black"
            android:textSize="13sp">

        </TextView>

        <TextView
            android:id="@+id/rating"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginTop="27dp"
            android:layout_toLeftOf="@id/ratingstar"
            android:text="4,7"
            android:textColor="@color/black"
            android:textSize="16sp"
            android:textStyle="bold"></TextView>

        <ImageView
            android:id="@+id/ratingstar"
            android:layout_width="23dp"
            android:layout_height="23dp"
            android:layout_alignParentTop="true"
            android:layout_alignParentRight="true"
            android:layout_marginTop="27dp"
            android:layout_marginRight="30dp"
            android:src="@drawable/baseline_star_24" />
        <TextView
            android:id="@+id/lineaseparacion"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_centerHorizontal="true"
            android:text="-"
            android:textColor="@color/black"
            android:textSize="20sp"/>

        <ImageView
            android:id="@+id/locationicon"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_alignParentLeft="true"

            android:layout_alignParentBottom="true"
            android:layout_marginLeft="27dp"
            android:layout_marginBottom="25dp"
            android:src="@drawable/baseline_location_on_24" />

        <TextView
            android:id="@+id/localizacion"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginTop="15dp"
            android:layout_marginBottom="25dp"
            android:layout_toRightOf="@id/locationicon"
            android:text="Madrid"
            android:textColor="@color/black"
            android:textSize="14sp"></TextView>
        <TextView
            android:id="@+id/fechafin"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="25dp"
            android:text="27/10/2023"
            android:textColor="@color/black"
            android:textSize="13sp"/>

        <TextView
            android:id="@+id/precio"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentBottom="true"
            android:layout_marginTop="15dp"
            android:layout_marginRight="38dp"
            android:layout_marginBottom="25dp"
            android:text="Gratis"
            android:textColor="#4CAF50"
            android:textSize="14sp">

        </TextView>

    </RelativeLayout>
</RelativeLayout>

背景形状:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape>
            <solid android:color="#9C27B0">
            </solid>
            <stroke android:color="@color/black"
                android:width="1dp">
            </stroke>
            <corners android:radius="50dp">
            </corners>
        </shape>
    </item>
    <item>
        <shape>
            <solid android:color="@color/grey">
            </solid>
            <stroke android:color="#FFFFFF"
                android:width="2dp">
            </stroke>
            <corners android:radius="50dp">
            </corners>
        </shape>
    </item>
</selector>

更新:根据第一个答案,我尝试使用cardview,但即使在调整它以获得相同的预览后,图像也超过了cardview区域。有没有一种方法可以调整xml或至少调整部分后端的图像,使其不会超过定义的区域?

4uqofj5v

4uqofj5v1#

尝试这样的事情

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/white">

    <!-- give a desired cardCornerRadius to CardView -->
    <com.google.android.material.card.MaterialCardView
        android:id="@+id/relLayout1"
        android:layout_width="match_parent"
        android:layout_marginTop="10dp"
        android:layout_height="170dp"
        app:cardCornerRadius="50dp">

        <!-- margin and padding to 0dp (may not be neccessary) -->
        <ImageView
            android:id="@+id/evento_banner"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="fitXY"
            android:margin ="0dp"
            android:padding = "0dp"
            android:src="@drawable/evento_banner"/>
    </com.google.android.material.card.MaterialCardView>

<!-- rest of your tags -->

</RelativeLayout>

我希望像这样的东西是你正在寻找的

dwbf0jvd

dwbf0jvd2#

如果我没理解错的话,你想要的是如下的

如果是这样,请使用以下内容更新xml

**请不要说我使用了背景色,而不是一个图像,在您的情况下使用android:src="@drawable/your_drawable"。我已经尝试过它,它与图像太

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/white">

    <!-- give a desired cardCornerRadius to CardView -->
    <com.google.android.material.card.MaterialCardView
        android:id="@+id/relLayout1"
        android:layout_width="match_parent"
        android:layout_marginTop="10dp"
        android:layout_height="170dp"
        app:cardCornerRadius="50dp">

    <!-- margin and padding to 0dp (may not be neccessary) -->
    <!-- I also have not included the image here. I just used a background color -->
    <ImageView
        android:id="@+id/evento_banner"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:margin ="0dp"
        android:padding = "0dp"
        android:background="@color/Neon"/>
    </com.google.android.material.card.MaterialCardView>
    <com.google.android.material.card.MaterialCardView
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_alignTop="@+id/relLayout1"
        android:layout_marginTop="60dp"
        app:cardBackgroundColor="@color/white"
        app:cardCornerRadius="50dp"
        app:strokeColor="@color/lightGrey"
        app:strokeWidth="3dp">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/super_lightGrey"
            android:padding="5dp">
            <TextView
                android:id="@+id/evento"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_alignParentTop="true"
                android:layout_marginLeft="30dp"
                android:layout_marginTop="27dp"
                android:text="Evento"
                android:textColor="@color/black"
                android:textSize="16sp"
                android:textStyle="bold">

            </TextView>
            <TextView
                android:id="@+id/fechainicio"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:layout_marginTop="30dp"
                android:text="20/10/2023"
                android:textColor="@color/black"
                android:textSize="18sp">

            </TextView>

            <TextView
                android:id="@+id/rating"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="30dp"
                android:layout_marginTop="27dp"
                android:layout_toLeftOf="@id/ratingstar"
                android:text="4,7"
                android:textColor="@color/black"
                android:textSize="16sp"
                android:textStyle="bold"/>

            <ImageView
                android:id="@+id/ratingstar"
                android:layout_width="23dp"
                android:layout_height="23dp"
                android:layout_alignParentTop="true"
                android:layout_alignParentRight="true"
                android:layout_marginTop="27dp"
                android:layout_marginRight="30dp"
                android:src="@drawable/calendar" />
            <TextView
                android:id="@+id/lineaseparacion"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_centerHorizontal="true"
                android:text="-"
                android:textColor="@color/black"
                android:textSize="20sp"/>

            <ImageView
                android:id="@+id/locationicon"
                android:layout_width="20dp"
                android:layout_height="20dp"
                android:layout_alignParentLeft="true"

                android:layout_alignParentBottom="true"
                android:layout_marginLeft="27dp"
                android:layout_marginBottom="25dp"
                android:src="@drawable/settings" />

            <TextView
                android:id="@+id/localizacion"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_marginTop="15dp"
                android:layout_marginBottom="25dp"
                android:layout_toRightOf="@id/locationicon"
                android:text="Madrid"
                android:textColor="@color/black"
                android:textSize="14sp"/>
            <TextView
                android:id="@+id/fechafin"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:layout_marginBottom="25dp"
                android:text="27/10/2023"
                android:textColor="@color/black"
                android:textSize="13sp"/>

            <TextView
                android:id="@+id/precio"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_alignParentBottom="true"
                android:layout_marginTop="15dp"
                android:layout_marginRight="38dp"
                android:layout_marginBottom="25dp"
                android:text="Gratis"
                android:textColor="#4CAF50"
                android:textSize="14sp">

            </TextView>
        </RelativeLayout>
    </com.google.android.material.card.MaterialCardView>
</RelativeLayout>

相关问题