Create circle inside another circle in Android

Question

I need to create image for my camera app. I create a circle inside another circle it look fine when I see it on android studio but when run it on real device it was not same as it is. Here is image of both first one from real device and second from android studio.

Here is my code that I'm using to create it.

 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Larger circle in white-->
<item>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
        <padding android:top="5dp" android:bottom="5dp" android:right="5dp" android:left="5dp"/>
        <stroke
            android:width="1dp"
            android:color="#ffffff"/>
    </shape>
</item>
<!-- Smaller white circle in front -->
<item>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
        <solid
            android:color="#ffffff"/>
    </shape>
</item>
 </layer-list>

What's the problem why it show different.

Possible duplicate of [How to draw a circle inside a circle using Android xml shapes?](http://stackoverflow.com/questions/21613308/how-to-draw-a-circle-inside-a-circle-using-android-xml-shapes) — Sean Barbeau, Apr 10 '17 at 12:10

score 7 · Accepted Answer · edited Jun 19 '20 at 05:51

7

Everything seems good, just add size property. Hope after that it will work for you.

<size android:height="40dp" android:width="40dp"/>

Example:

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

    <item>
        <shape android:shape="oval">
            <size
                android:width="40dp"
                android:height="40dp" />
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" />
            <stroke
                android:width="1dp"
                android:color="#ffffff" />
        </shape>
    </item>

    <item>
        <shape android:shape="oval">
            <size
                android:width="40dp"
                android:height="40dp" />
            <solid android:color="#ffffff" />
        </shape>
    </item>
</layer-list>

I used 40dp as size of width and height. You can change it as per your requirement.

edited Jun 19 '20 at 05:51

Tomas Kral

3
2

answered Apr 10 '17 at 12:09

Ganesh Katikar

2,460
1
21
27

1

Would be nice if you credited the original answer, instead of copying / pasting http://stackoverflow.com/questions/21613308/how-to-draw-a-circle-inside-a-circle-using-android-xml-shapes/27569549#27569549 – Sean Barbeau Apr 10 '17 at 12:12
@SeanBarbeau Its not copy paste, Its change in solution provided in question. :) – Ganesh Katikar Apr 10 '17 at 12:15
@GaneshKatikar what is the best way creating shapes or load image for like that case. – Fiverr Projects Apr 10 '17 at 12:17
Its always better to use drawable xml for shape, but it's again depends. For image I didn't get what you want exactly? – Ganesh Katikar Apr 10 '17 at 12:23

score 0 · Answer 2 · answered Apr 10 '17 at 12:10

0

I think it's because your device's OS doesn't support attributes like "android:top" "android:bottom".

answered Apr 10 '17 at 12:10

W.Dan

86
1
3

Create circle inside another circle in Android

2 Answers2