Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Button Border Color

I am making Android Button, using following XML.

The output on Preview of Design, shows as below. enter image description here

However when I run on Device, Samsung Duos. It shows totally different. enter image description here

How can I set border.

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

    <stroke
        android:width="3dp"
        android:color="#d78d79" />

</shape>

I also get an error in XML, but its working fine. Nothing shown when I mouse hover on error.

enter image description here

Can any one help?

like image 346
Sam Shaikh Avatar asked Nov 21 '15 19:11

Sam Shaikh


People also ask

How to give border to button Android?

We cannot add a border to an Android button using Button view attributes, to do so we need to create an XML file in the drawable folder and set this drawable XML as background to the Button view.

How do you change the color of the border on Android?

To add a border to Android TextView we need to create an XML containing shape as a rectangle file under the drawable's folder and set it as background to the TextView. <stroke> tag is used to set the border width and color.


2 Answers

Add <solid android:color="@android:color/transparent" /> as an child element in your shape element

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <solid android:color="@android:color/transparent" />
    <stroke
        android:width="3dp"
        android:color="#d78d79" />

</shape>
like image 108
michal.luszczuk Avatar answered Sep 28 '22 00:09

michal.luszczuk


I usually do something like this!

You can do all this in one XML but I will show the long way for you to understand better.

simple_button.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:state_pressed="true"
        android:drawable="@drawable/button_pressed"/>

    <item
        android:state_enabled="false"
        android:drawable="@drawable/button_disabled"/>
    <item
        android:state_enabled="true"
        android:drawable="@drawable/button_enabled"/>

</selector>

button_pressed.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="2dp" />
    <solid android:color="#20FF5252" />
    <padding
        android:bottom="0dp"
        android:left="0dp"
        android:right="0dp"
        android:top="0dp" />
    <size
        android:width="100dp"
        android:height="35dp" />
    <stroke
        android:width="1dp"
        android:color="#1DE9B6" />
</shape>

button_disabled.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
    <corners
        android:radius="14dp"
        />
    <solid
        android:color="@android:color/transparent"
        />
    <padding
        android:left="0dp"
        android:top="0dp"
        android:right="0dp"
        android:bottom="0dp"
        />
    <stroke
        android:width="8dp"
        android:color="#1DE9B6"
        />
</shape>

button_enabled.xml

  <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
    <corners
        android:radius="2dp"
    />
    <solid
        android:color="@android:color/transparent"
    />
    <padding
        android:left="0dp"
        android:top="0dp"
        android:right="0dp"
        android:bottom="0dp"
    />
    <size
        android:width="260dp"
        android:height="50dp"
    />

    <stroke
        android:width="1dp"
        android:color="#1DE9B6"
    />
</shape>

styles.xml

 <style name="Widget.Button.Simple" parent="android:Widget">
        <item name="android:gravity">center_vertical|center_horizontal</item>
        <item name="android:background">@drawable/simple_button</item>
        <item name="android:textAppearance">?android:textAppearanceMedium</item>
        <item name="android:textColor">#1DE9B6</item>
        <item name="android:textStyle">bold</item>

    </style>

Usage

  <Button
        android:id="@+id/btn_simple"
        style="@style/Widget.Button.Simple"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_margin="20dp"
        android:text="Button" />

I hope it helps!

like image 21
Erik Jhordan Rey Avatar answered Sep 28 '22 00:09

Erik Jhordan Rey