1

So I have two button styled pretty close to what i want but i need a little help getting it all the way. What I currently have is the first screen show, what I want is the second. Anyone have any ideas? I've attached the relevant code.

enter image description here enter image description here

layout xml:

....
<Button
            android:id="@+id/sched_button"
            style="?android:attr/buttonBarButtonStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/sync"
            android:layout_alignParentTop="true"
            android:background="@drawable/round_left_corner_active"
            android:text="@string/headersched"
            android:layout_toLeftOf="@+id/placeholder"
            android:paddingRight="@dimen/scheduleheadermargin"
            android:paddingLeft="@dimen/scheduleheadermargin" />

        <Button
            android:id="@+id/sched_fav_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/sched_button"
            android:layout_alignParentTop="true"
            android:layout_toRightOf="@+id/placeholder"
            android:background="@drawable/round_right_corner"
            android:paddingLeft="@dimen/scheduleheadermargin"
            android:paddingRight="@dimen/scheduleheadermargin"
            android:text="@string/headerfav" />
...

round_left_corner_active:

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

    <item>
        <shape android:shape="rectangle" >
            <solid android:color="@color/active" />

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

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle" >
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" />

            <solid android:color="@color/active" />
        </shape>
    </item>
</layer-list>

round_right_corner

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

    <item>
        <shape android:shape="rectangle" >
            <solid android:color="@color/active" />

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

            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle" >
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" />

            <solid android:color="@color/base" />
        </shape>
    </item>
</layer-list>
jcaruso
  • 2,364
  • 1
  • 31
  • 64

1 Answers1

3

For the left button:

<corners
    android:radius="5dip"
    android:topRightRadius="0dip"
    android:bottomRightRadius="0dip" />  

And the right one:

<corners
    android:radius="5dip"
    android:topLeftRadius="0dip"
    android:bottomLeftRadius="0dip" />  

This should do the trick.

However, android:bottomRightRadius and android:bottomLeftRadius have a bug in API lower than 12 (Android 3.1 Honeycomb). You should set the radius inside dimens.xml and create a new folder values-v12. See this solution: Something's wrong in Corner radius.
Then, you should do:

drawable button left

... 
<corners
    android:radius="5dip"
    android:topRightRadius="0dip"
    android:bottomRightRadius="@dimen/right_bottom_leftbutton"
    android:bottomLeftRadius="@dimen/left_bottom_leftbutton" /> 

drawable button right

... 
<corners
    android:radius="5dip"
    android:topLeftRadius="0dip"
    android:bottomRightRadius="@dimen/right_bottom_rightbutton"
    android:bottomLeftRadius="@dimen/left_bottom_rightbutton" /> 

values/dimens.xml

<!-- left button -->
<dimen name="right_bottom_leftbutton">5dip</dimen>
<dimen name="left_bottom_leftbutton">0dip</dimen>
<!-- right button -->
<dimen name="right_bottom_rightbutton">5dip</dimen>
<dimen name="left_bottom_rightbutton">0dip</dimen>

values-v12/dimens.xml

<!-- left button -->
<dimen name="right_bottom_leftbutton">0dip</dimen>
<dimen name="left_bottom_leftbutton">5dip</dimen>
<!-- right button -->
<dimen name="right_bottom_rightbutton">5dip</dimen>
<dimen name="left_bottom_rightbutton">0dip</dimen>
Community
  • 1
  • 1
Blo
  • 11,903
  • 5
  • 45
  • 99
  • Perfect... and i'll look into that bug in 3.1 what Sdk Version is that? – jcaruso Apr 16 '14 at 21:50
  • @jcaruso Android 3.1 Honeycomb (API level 12). Thanks for pointing me this stupid mistake, I'll correct it. – Blo Apr 16 '14 at 21:52
  • What stupid mistake is that? I'm only targeting `minSdkVersion="14"` so i wouldn't need it correct? – jcaruso Apr 16 '14 at 21:57
  • @jcaruso It's API 12 and SDK version 3.1. I wrote the inverse (API 3.1... that's a beautiful mistake) ;) – Blo Apr 16 '14 at 21:59
  • If you have the min version to 14, you don't need to set the values inside dimens file, just use the first codes. However, I'll let my complete answer for other users, it might help someone who wants the same behaviour in lower api. @jcaruso – Blo Apr 16 '14 at 22:14
  • Great call, i'm sure someone else will find this very useful. – jcaruso Apr 17 '14 at 13:40