palatok
palatok

Reputation: 1034

Android: drawable with perfect round corner

I'm trying to make a drawable like belowenter image description here:

I've made this by the following code:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:background="@color/white"
    android:padding="10dp"
    android:orientation="vertical">

<View
    android:layout_width="40dp"
    android:layout_height="match_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:background="@drawable/bg_round_button_green"/>

<View
    android:layout_width="40dp"
    android:layout_height="match_parent"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:background="@drawable/bg_round_button_green"/>

<TextView
    android:layout_width="match_parent"
    android:layout_height="36dp"
    android:text="Text"
    android:textColor="@color/white"
    android:textSize="22sp"
    android:gravity="center"
    android:layout_centerVertical="true"
    android:background="@color/siam_green3"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"/>

</RelativeLayout>  

bg_round_button_green.xml

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

I also tried this:
bg_round_button_green.xml

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

But it displays,
enter image description here

Is it possible to do this with a single shape drawable (without creating three Views) ?

Upvotes: 6

Views: 4876

Answers (2)

Hemanth
Hemanth

Reputation: 2737

Try this. Works perfectly for me.

<?xml version="1.0" encoding="utf-8"?>
  <shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <solid android:color="#A5000000"/>
    <stroke android:width="0dp"
      android:color="#00FFFFFF"/>
    <padding android:left="0dp"
      android:top="0dp"
      android:right="0dp"
      android:bottom="0dp"/>
    <corners android:bottomRightRadius="10dp"
      android:bottomLeftRadius="10dp"
      android:topLeftRadius="10dp"
      android:topRightRadius="10dp"/>
  </shape>

Upvotes: 8

Gaskoin
Gaskoin

Reputation: 2485

If you will do one drawable with corners set to some big value:

<corners android:radius="100dp" />

You will get what you want without 3 views

Upvotes: 2

Related Questions