How to achive this style of buttons corners in android

Question

I want to make buttons like ios lock screen buttons in android. I can make round buttons but can any body tell me how to make stroke color invisible like this?

I believe the best way would be creating those buttons in photoshop and importing them to your project, adding image views and setting the src property to each image view, and then using onClick on those image views so they have functionality — Antonios Tsimourtos, Jul 05 '16 at 11:04
give transparent color to it. using `@android:color/transparent` — Vivek Mishra, Jul 05 '16 at 11:07
if you look at the color of round ring of each button it shows the background of the main layout. i am surprise for that in photo shop i can achieve this but it will not work if i change background — Xäiñ Ul Abideen, Jul 05 '16 at 11:14

score 2 · Answer 1 · answered Jul 05 '16 at 11:12

You should try below code:

roundbutton.xml :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="rectangle" >
<corners
android:topLeftRadius="100dp"
android:topRightRadius="100dp"
android:bottomLeftRadius="100dp"
android:bottomRightRadius="100dp"
/>
<solid
android:color="#ffffff"
/>
<padding
android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="100dp"
android:height="100dp"
/>
<stroke
android:width="3dp"
android:color="#878787"
/>

 <gradient android:angle="-90" android:startColor="#8dbab3" android:endColor="#58857e" />      
</shape>

You can chage color as per your need. And put this class as a background of button.

You can also try with changing angle value of Gradient for proper look.

Hope it would help you.

score 0 · Answer 2 · edited May 23 '17 at 11:44

0

You can achieve this effect by creating a gradient border.

Check this answer for more details

Android shape border with gradient

edited May 23 '17 at 11:44

Community

1
1

answered Jul 05 '16 at 11:05

Vladimir Atanasov

169
1
8

Narendra Sorathiya · Accepted Answer · 2016-07-05T11:27:23.240

bg_button.xml

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

<solid android:color="@android:color/transparent" />

<stroke android:color="#80(yourcolor)"
    android:width="1dp"/>
</shape>

layout.xml

<Button
android:width="40dp"
android:height="40dp"
android:gravity="center"
android:text="1"
android:padding="10dp"
android:background="@drawable/bg_button"/>

How to achive this style of buttons corners in android

3 Answers3