XML Android에서 쉐이핑 할 배경 이미지 추가


148

도형에 배경 이미지를 어떻게 추가합니까? 아래에서 시도했지만 성공하지 않은 코드 :

<?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>

사용자 정의 모양 클래스를 확장하고 작성해야합니다. 예를 들어 RoundedImageView를 살펴보십시오. 그것은 당신이 그것에 배경으로 설정 한 iamge가 무엇이든 둥근 이미지 뷰를 생성합니다, 그것은 둥근 모양으로 나타납니다
Rahul Gupta

답변:


221

다음을 사용하십시오 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>

4
고마워, 이것은 작동했지만 가장자리가 더 이상 둥글 지 않습니까?
DevC

둥근 모서리가있는 이미지를 원하십니까? 모양에 색상이없는 것 같습니다
vipul mittal

1
내 모양은 흰색과 둥근 모서리를 가졌습니다. 색상을 제거하고 대신 이미지를 사용하면 둥근 모서리가 남아 있다고 생각했습니다. 이것이 가능하지 않다면
DevC

모서리가 둥근 이미지는 불가능합니까?
bvsss

가능하지만 프로그래밍 방식으로 이미지 모서리를 둥글게해야합니다. 이 stackoverflow.com/questions/2459916/…
vipul mittal 8:30에

199

원형 배경의 드로어 블 이미지에 다음을 사용했습니다.

<?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>

여기 어떻게 생겼는지

여기에 이미지 설명을 입력하십시오

희망은 누군가를 도와줍니다.


이미지의 중력을 설정하는 것이 있습니까?
Sagar Devanga

위 코드에서 드로어 블에 대해 또는 레이아웃에 이미지를 포함시킬 때 @SagarDevanga?
Ray Hunter

먼저 높이와 너비를 사용하여 내부 아이콘을 24dp (실제 크기)로 설정하려고했습니다. 이것은 AS의 미리보기에서 완벽하게 크기가 조정되었지만 태블릿에는 영향을 미치지 않았습니다. 따라서 나는 당신의 방법을 사용했습니다. 도형의 높이와 너비를 40dp로 설정 한 다음 아이콘 항목의 위, 아래, 왼쪽 및 오른쪽을 각각 8dp로 설정했습니다. (40-24) / 2 = 8. 그러나 결과 이미지는 올바른 크기로 보이지만 흐릿합니다 .PNG의 크기 조정으로 인한 것으로 생각됩니다. 어떤 제안?
Luke Allison

TLDR; 이미지 품질을 잃지 않고 직경 40dp의 원형과 24dp 아이콘으로 이미지를 어떻게 만들 수 있습니까?
Luke Allison

@LukeAllison UI에 아이콘을 어떻게 추가하고 타원에 배치 한 이미지의 크기가 얼마나됩니까?
Ray Hunter

21

내부에 아이콘이있는 원 모양입니다.

<?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>

캐럿 이미지 및 테두리를 표시하려는 사용자에게 더 적합
Masum

7

이것은 코너 이미지입니다

<?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>

4

테두리가있는 드로어 블 이미지에 다음을 사용했습니다.

먼저이 코드가 포함 된 .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"/>

두 번째로 레이아웃 폴더에서 .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

1

다음은 이미지에 대한 사용자 정의 모양을 얻는 가장 쉬운 방법입니다 (이미지보기). 누군가에게 도움이 될 수 있습니다. 그것은 단지 한 줄의 코드입니다.

먼저 의존성을 추가해야합니다 :

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);   
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.