Border on the left side of the button only

Question

Here is my button_style.xml which i am including with my button. However, I still can't seem to get the border on the left. Can anyone help me here please?

ps - My background should be transparent

<?xml version="1.0" encoding="utf-8"?>
<selector  xmlns:android="http://schemas.android.com/apk/res/android" >
    <layer-list>
            <item android:left="2dp">
                <shape android:shape="rectangle"> 
                    <stroke
                        android:width="1dp"
                        android:color="#999999"/>
                </shape>
        </item>
    </layer-list>

</selector>

Solution 1

Try this

<?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="@android:color/transparent" />
        </shape>
    </item>
    <item
        android:bottom="-2dp"
        android:right="-2dp"
        android:top="-2dp">
        <shape>
            <solid android:color="@android:color/transparent" />

            <stroke
                android:width="2dp"
                android:color="#FFF" />
        </shape>
    </item>

</layer-list>

Solution 2

There is some inherit problem with the borders of the button. But I found the best way to do it. Let say if you want a border only on the left side of the button. In the MainActivity xml file where the button is placed do it like this -

  <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/newstyle"
        android:orientation="vertical" >

                <Button
                    android:id="@+id/button3"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@null"
                    android:gravity="center_vertical"
                    android:paddingLeft="10sp"
                    android:text="Button"
                    android:textAllCaps="false"
                    android:textColor="#939393"
                    android:textSize="20sp" />
   </LinearLayout>

For the newstyle.xml file which will be located in the drawable use this code -

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

    <item
        android:bottom="0sp"
        android:left="-2sp"
        android:right="-2sp"
        android:top="-2sp">
        <shape android:shape="rectangle" >
            <solid android:color="#ffffff" />

            <stroke
                android:width="1sp"
                android:color="#d6d6d6" />
        </shape>
    </item>
</layer-list>

So the whole idea is - Keep the background of the button as @null and keep the button in the linera layout. Give the background to the liner layout and voila its done..:)..

Solution 3

Try this

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
       <shape>
           <padding android:left="1dp" />
           <solid android:color="#999999" />
       </shape>
   </item>
 <item>
    <shape android:shape="rectangle">
           <solid android:color="@android:color/transparent" />
    </shape>
  </item>
</layer-list>

Comments

[SleepNot]

This is not working, although there is a border that appears on the left, there is also a border that appears on the bottom even though bottom="0dp"

[Syn3sthete]

did you try on a real device sometimes it may not show on simulator

[Ram Patra]

can anyone tell me the purpose of android:shape attribute as i got same results after removing it?