How can I play with the buttons color and size?

Question

How can I play with the buttons size? for example, here is a button

<Button
    android:id="@+id/button1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:textSize="12sp"
    android:text="About" />

It looks like this: http://oi58.tinypic.com/2irayky.jpg

And when I put my finger to it, it changes to: http://oi61.tinypic.com/2hzu3if.jpg

How can I change the gray color and the orange color of the button/rectangle to #123456 for example?

Another question.. How can I change the rectangle height so the button will become smaller?

A simple search brought up alot of results for this [Example](http://stackoverflow.com/questions/3882064/how-to-change-color-of-button-in-android-when-clicked) — InitLipton, Jun 04 '14 at 10:42

Farouk Touzi · Accepted Answer · 2014-06-05T16:30:32.480

You can make a custom background for your button. In this example, we will make a gradient one. In res/drawable, create an XML file btn_blue_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape>
            <solid
                android:color="#449def" />
            <stroke
                android:width="1dp"
                android:color="#2f6699" />
            <corners
                android:radius="3dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient
                android:startColor="#449def"
                android:endColor="#2f6699"
                android:angle="270" />
            <stroke
                android:width="1dp"
                android:color="#2f6699" />
            <corners
                android:radius="4dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
</selector>

Return now to your button, and add android:background specification.

<Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="150dp"
    android:gravity="center"
    android:background="@drawable/btn_blue_bg"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:textSize="12sp"
    android:text="About" />

You can also "play" with width and height attribute if you want.

score 0 · Answer 2 · edited May 23 '17 at 10:32

0

I hope I understand what you are asking about.

Basically, you put an xml into the res/drawable/ folder, rather than a .png.

In this xml, you can specify a list of drawables for different states. See e.g. https://stackoverflow.com/a/14397453/755804

To make a button visually smaller, you can use the transparent color while preserving the same png size.

edited May 23 '17 at 10:32

Community

1
1

answered Jun 04 '14 at 10:49

18446744073709551615

16,368
4
94
127

score 0 · Answer 3 · answered Jun 04 '14 at 10:49

You can create a xml to fully personalize your button: create an item for each state (state_pressed=true in this case) like this:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape>
            <solid
                android:color="#BABABA" />
            <stroke
                android:width="1dp"
                android:color="#ABABAB" />
            <corners
                android:radius="12dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
            <size
                android:width="10dp"
                android:height="10dp"
            />
        </shape>
    </item>
</selector>

Then add this xml to your button background. android:background="@drawable/your.xml" Hope be helpful.

you're welcome. feel free to upvote all answers you see usefull for your question — PedroHawk, Jun 05 '14 at 10:13

How can I play with the buttons color and size?

3 Answers3