在XML Android中为形状添加背景图片

Question

如何给形状添加背景图片？我尝试了下面的代码但没有成功：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
//here is where i need to set the image
<solid android:color="@drawable/button_image"/>
    <corners
     android:bottomRightRadius="5dp"
     android:bottomLeftRadius="5dp"
     android:topLeftRadius="5dp"
     android:topRightRadius="5dp"/>
 </shape>

- DevC

---

你需要扩展并创建一个自定义形状的类。可以参考RoundedImageView的例子，它创建了一个圆形的ImageView，所以无论你将什么图片设置为其背景，它都会呈现为圆形。 - Rahul Gupta

Answer 1

请使用以下layerlist：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape android:shape="rectangle" android:padding="10dp">
            <corners
                 android:bottomRightRadius="5dp"
                 android:bottomLeftRadius="5dp"
                 android:topLeftRadius="5dp"
                 android:topRightRadius="5dp"/>
         </shape>
   </item>
   <item android:drawable="@drawable/image_name_here" />
</layer-list>

- vipul mittal

---

谢谢，这个确实有效，但是边缘不再是圆角了？ - DevC

你想要圆角的图片吗？因为看起来你的形状没有任何颜色。 - vipul mittal

我的形状原来是白色并且有圆角。我以为如果我去掉了颜色并使用一张图片，那么圆角依旧会保留。如果这不可行也没关系。 - DevC

所以，带有圆角的图像，不可能吗？ - bvsss

当图像是矢量资产（XML）时，它无法工作。 - Anubhav Malik

Answer 2

我使用了以下代码来创建一个带圆形背景的可绘制图像。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <solid android:color="@color/colorAccent"/>
        </shape>
    </item>
    <item
        android:drawable="@drawable/ic_select"
        android:bottom="20dp"
        android:left="20dp"
        android:right="20dp"
        android:top="20dp"/>
</layer-list>

这是它的外观

- Ray Hunter

---

有没有什么方法可以设置图像的重力。 - Sagar Devanga

在上面的代码中，您是针对可绘制对象进行@SagarDevanga操作还是在布局中包含图像时进行操作？ - Ray Hunter

首先，我尝试使用高度和宽度将内部图标设置为24dp（其实际大小）。这在AS的预览中完美地调整了大小，但对平板电脑没有影响。因此，我使用了您的方法。我将形状的高度和宽度设置为40dp，然后将图标项的顶部、底部、左侧和右侧分别设置为8dp。（40-24）/2=8。然而，生成的图像看起来大小正确，但是模糊不清，我怀疑这是由于PNG的某种重新调整大小导致的。有什么建议吗？ - Luke Allison

简而言之，您如何创建上面的图像，其中包含一个直径为40dp的圆形和一个24dp的图标，而不会失去图像质量？ - Luke Allison

这个东西如果加上阴影会看起来非常棒。 - DJphy

Answer 3

这是一个带有图标的圆形：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/ok_icon"/>
    <item>
        <shape
                android:shape="oval">
            <solid android:color="@color/transparent"/>
            <stroke android:width="2dp" android:color="@color/button_grey"/>
        </shape>
    </item>
</layer-list>

- anagaf

---

更完美的适合想要展示插入符图像和边框的人。 - Md. Rashidul Hasan

Answer 4

这是一个角落的图像：

1- 通过描边覆盖可绘制对象

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:drawable="@drawable/img_main_blue"
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />

    <item>
        <shape
            android:padding="10dp"
            android:shape="rectangle">
            <corners android:radius="10dp" />
            <stroke
                android:width="5dp"
                android:color="@color/white" />
        </shape>

    </item>
</layer-list>

2- 将图像隐藏在角落背景中

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <corners android:radius="5dp" />
            <solid android:color="#1D1D19" />
        </shape>

    </item>
    <item
        android:drawable="@drawable/movie_card_place_holder"
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp" />
</layer-list>

- mohsen

---

这只是对可绘制项进行颜色叠加。对于需要带描边的图像，这是完美的解决方案。 - Yohanim

Answer 5

我用以下代码创建了一个带边框的可绘制图像。

首先，在drawable文件夹中创建一个包含以下代码的.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="oval">
        <solid android:color="@color/orange"/>
    </shape>
</item>
<item
    android:top="2dp"
    android:bottom="2dp"
    android:left="2dp"
    android:right="2dp">
    <shape android:shape="oval">
        <solid android:color="@color/white"/>
    </shape>
</item>
<item
    android:drawable="@drawable/messages" //here messages is my image name, please give here your image name.
    android:bottom="15dp"
    android:left="15dp"
    android:right="15dp"
    android:top="15dp"/>

第二步，在layout文件夹中创建一个视图.xml文件，并使用以下方式调用上面的.xml文件

<ImageView
   android:id="@+id/imageView2"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:src="@drawable/merchant_circle" />  // here merchant_circle will be your first .xml file name

- Masum

Answer 6

这里有另一种最简单的方法来为您的图像（Image View）获取自定义形状。它可能对某些人有帮助。只需要一行代码即可实现。

首先，您需要添加一个依赖项：

dependencies {
    compile 'com.mafstech.libs:mafs-image-shape:1.0.4'   
}

然后只需编写这样一行代码：

Shaper.shape(context, 
       R.drawable.your_original_image_which_will_be_displayed, 
       R.drawable.shaped_image_your_original_image_will_get_this_images_shape,
       imageView,
       height, 
       weight);   

- Mafujul