CODEWITHSUNDEEP
androidandroid-layoutandroid-emulatorandroid-widget
Kalai Selvan.G
Kalai Selvan.G

Reputation: 482

how to make a rounded corners for an image in image view using XML layout in android

I have tried many times but i know that i am missing something,could you Guys please explain it.. Following is what, i have tried

    <ImageView
        android:id="@+id/Dicimage"
        android:layout_width="130px"
        android:layout_height="100px"
        android:src="@drawable/slang"
        android:background="@drawable/corner"
        android:padding="1dp"/>

Created Corner XML in resource folder

  <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"         
    android:shape="rectangle"> 
<solid android:color="#fff"/>    

<stroke android:width="0dp"
        android:color="#ff000000"/>

<padding android:left="2dp"
         android:top="2dp"
         android:right="2dp"
         android:bottom="2dp"/> 

<corners android:radius="30px"/> 
   </shape>

What i am getting is, the border is only rounded rectangle but the image is still rectangle in shape

Upvotes: 7

Views: 41001

Answers (6)

Javad Jafari
Javad Jafari

Reputation: 135

you can add your ImageView in a CardView with attribute cardElevation=0

<android.support.v7.widget.CardView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/thumbnail_card"
                card_view:cardCornerRadius="15dp"
                card_view:cardElevation="0dp"
                android:layout_margin="10dp">


            <ImageView
                android:id="@+id/thumbnail"
                android:layout_width="110dp"
                android:layout_height="75dp"
                android:scaleType="centerCrop" />

            </android.support.v7.widget.CardView>

Upvotes: 5

Дмитрий Фоменко
Дмитрий Фоменко

Reputation: 49

You should add this code as some_foreground.xml to drawable folder.

<?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item>
            <shape android:shape="rectangle">
                <stroke
                    android:width="8dp"
                    android:color="@color/white" />
            </shape>
        </item>
        <item>
            <shape android:shape="rectangle">
                <corners android:radius="@dimen/padding_margin_8" />
                <stroke
                    android:width="8dp"
                    android:color="@color/white" />
            </shape>
        </item>
    </layer-list>

And then you can use this as foreground for your ImageView. You should add this like:

<ImageView
        android:id="@+id/event_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:foreground="@drawable/some_foreground"
        android:scaleType="centerCrop"
        android:src="@drawable/your_image" />

Upvotes: 2

Mr.O
Mr.O

Reputation: 843

Here's a super late answer but if you're trying to create a circular ImageView:

Create a drawable in drawable folder called circle:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid
        android:color="@android:color/black"/>
    <size
        android:height="60dp"
        android:width="60dp"/>
</shape>

ImageView:

<ImageView
    android:id="@+id/Dicimage"
    android:layout_width="130px"
    android:layout_height="100px"
    android:src="@drawable/slang"
    android:background="@drawable/circle"
    android:padding="1dp"/>

Upvotes: 1

Emre AYDIN
Emre AYDIN

Reputation: 734

Use that xml file as foreground

I mean, instead of

android:background="@drawable/corner"

Use this

android:foreground="@drawable/corner"

Upvotes: 2

Pongpat
Pongpat

Reputation: 13348

No, that is not possible. You have to do it programmatically.

What you are doing is create rounded corners background and draw the drawable over it.

Here's the great article of how to create rounded corners image from Romain Guy: http://www.curious-creature.org/2012/12/11/android-recipe-1-image-with-rounded-corners/

Upvotes: 4

Nibha Jain
Nibha Jain

Reputation: 8141

TRy this :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> 
    <solid android:color="#ffffff"/>    

    <stroke android:width="3dp"
            android:color="#ff000000"/>

    <padding android:left="1dp"
             android:top="1dp"
             android:right="1dp"
             android:bottom="1dp"/> 

    <corners android:radius="30px"/> 
</shape>

Taken from this Post : Android ImageView with Rounded Corners not working

Upvotes: 2

Related Questions