Button background as transparent

Question

I have a button. When I press the button I have to make text as bold otherwise normal. So I wrote styles for bold & normal.

<style name="textbold" parent="@android:style/TextAppearance">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textStyle">bold</item>
</style>
<style name="textregular" parent="@android:style/TextAppearance">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textStyle">normal</item>
</style>

Now I have a button_states.xml as:

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="true"
    style="@style/textbold" />
<item android:state_focused="false" android:state_pressed="true"
    style="@style/textregular" />

<item style="@style/textregular" />
</selector>

In my layout for this button, I have to make the background as transparent too...How will I do it? My layout code is :

<Button android:id="@+id/Btn" android:background="@drawable/button_states" />

How will I include background as transparent in my style?

check out [this answer here](http://stackoverflow.com/questions/12856661/how-to-make-button-transparent-in-my-app-yet-visible#answer-12856901) to make transparent button with border — Basheer AL-MOMANI, Mar 31 '16 at 22:10
' why don't you just use a TextView and call the action on onClick of it ? — Dula wnRp, May 07 '16 at 13:05

Steve Pomeroy · Answer 1 · 2011-02-10T07:02:55.473

398

To make a background transparent, just do android:background="@android:color/transparent".

However, your problem seems to be a bit deeper, as you're using selectors in a really weird way. The way you're using it seems wrong, although if it actually works, you should be putting the background image in the style as an <item/>.

Take a closer look at how styles are used in the Android source. While they don't change the text styling upon clicking buttons, there are a lot of good ideas on how to accomplish your goals there.

edited Feb 10 '11 at 07:02

answered Feb 10 '11 at 06:56

Steve Pomeroy

10,071
6
34
37

1

Take a look at my clarified answer. I misread your problem to start. The background gets set in the style. – Steve Pomeroy Feb 10 '11 at 07:03
Sorry, I'm not clear on the solution. Just setting @android:color/transparent doesn't support the on-touch styles that normal buttons have (and is equivalent to setting the background to @null). – gatoatigrado Oct 14 '12 at 21:07
@gatoatigrado: do you mean that you want a transparent area to be outlined in orange or shaded in some what? If so, you'll need to create custom 9-patch images for that. – Steve Pomeroy Oct 15 '12 at 15:28
@StevePomeroy, yes, the default button effect on Android 4.1 is for [on button press] the background to be a light blue, with an even lighter blue outline. – gatoatigrado Oct 16 '12 at 04:54
@gatoatigrado: ok. If you want that, then you can't use a transparent button. I'm not sure what you're trying to accomplish there. – Steve Pomeroy Oct 16 '12 at 05:27
In Android Studio BumbleBee only the answer by @MuhammadAamirAli seems to work – Payel Senapati Feb 25 '22 at 03:02

score 141 · Answer 2 · answered Sep 19 '15 at 08:11

141

Try new way to set background transparent

    android:background="?android:attr/selectableItemBackground"

answered Sep 19 '15 at 08:11

Muhammad Aamir Ali

20,419
10
66
57

9

This is what I would recommend using. This way, you get to keep the beautiful material design animations for your buttons =) – Ryan Newsom Feb 04 '16 at 16:59
this is better answer – Marcos Dávalos Feb 25 '19 at 02:27
If someone wants a round behavior, use: ` android:background="?android:attr/selectableItemBackgroundBorderless"` – Andrew Dec 18 '20 at 15:12

score 38 · Answer 3 · answered Oct 17 '14 at 08:28

38

You may also use: in your xml:

android:background="@null"

or in code:

buttonVariable.setBackgroundColor(Color.TRANSPARENT);

answered Oct 17 '14 at 08:28

Hunkeone

505
5
11

Upvote for giving alternatives, love to see all the options! – Burkely91 Jul 10 '16 at 11:55

score 35 · Answer 4 · edited Jan 20 '17 at 23:04

35

Add this in your Xml - android:background="@android:color/transparent"

        <Button
            android:id="@+id/button1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="Button"
            android:background="@android:color/transparent"
            android:textStyle="bold"/>

edited Jan 20 '17 at 23:04

Vinoth Vino

9,166
3
66
70

answered Aug 20 '14 at 06:32

Mohanraj

439
5
4

score 35 · Answer 5 · answered Feb 10 '11 at 07:07

35

use #0000 (only four zeros otherwise it will be considered as black) this is the color code for transparent. You can use it directly but I recommend you to define a color in color.xml so you can enjoy re-usefullness of the code.

answered Feb 10 '11 at 07:07

Prasham

6,646
8
38
55

10

Luckily this has already been defined for us as `@android:color/transparent` – Richard Le Mesurier Jan 12 '16 at 08:34

score 31 · Answer 6 · edited Jul 22 '18 at 17:19

31

I achieved this with in XML with

android:background="@android:color/transparent"

edited Jul 22 '18 at 17:19

Makyen

31,849
12
86
121

answered Dec 08 '17 at 06:08

C. Skjerdal

2,750
3
25
50

score 12 · Answer 7 · answered Jan 26 '16 at 14:36

12

I used

btn.setBackgroundColor(Color.TRANSPARENT);

and

android:background="@android:color/transparent"

answered Jan 26 '16 at 14:36

Sindri Þór

2,887
3
26
32

btn.setBackgroundColor(Color.TRANSPARENT); works fine for me – jay_mziray Sep 17 '18 at 14:00

Faraz · Answer 8 · 2018-07-01T05:33:21.690

Selectors work only for drawables, not styles. Reference

First, to make the button background transparent use the following attribute as this will not affect the material design animations:

style="?attr/buttonBarButtonStyle"

There are many ways to style your button. Check out this tutorial.

Second, to make the text bold on pressed, use this java code:

btn.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {

        switch (event.getAction()) {
            // When the user clicks the Button
            case MotionEvent.ACTION_DOWN:
                btn.setTypeface(Typeface.DEFAULT_BOLD);
                break;

            // When the user releases the Button
            case MotionEvent.ACTION_UP:
                btn.setTypeface(Typeface.DEFAULT);
                break;
        }
        return false;
    }
});

score 5 · Answer 9 · answered Jul 06 '20 at 08:57

5

We can use attribute android:background in Button xml like below.

android:background="?android:attr/selectableItemBackground"

Or we can use style

style="?android:attr/borderlessButtonStyle" for transparent and shadow less background.

answered Jul 06 '20 at 08:57

Shihab Uddin

6,699
2
59
74

score 1 · Answer 10 · answered Dec 02 '16 at 10:47

1

You can achieve that by setting the colors alpha channel.

The color scheme is like this #AARRGGBB there A stands for alpha channel(transparency), R stands for red, G for green and B for blue.

answered Dec 02 '16 at 10:47

Raphael S

7
3

score 1 · Answer 11 · answered Apr 12 '18 at 17:20

Step 1: Create a new resource file in drawable and copy paste

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

    <stroke android:color="#fff" android:width="2dp"/>
    <corners android:radius="25dp"/>
    <padding android:right="15dp" android:top="15dp" android:bottom="15dp" android:left="15dp"/>
</shape>

save it as ButtonUI(let's say)

Step 2: Apply the UI to the button xml

<Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="join the crew"
  android:background="@drawable/ButtonUI"
  android:textColor="#fff"/>

score 0 · Answer 12 · answered Nov 12 '21 at 00:32

0

I'd say extend Borderless style.

<style name="Button" parent="Widget.AppCompat.Button.Borderless">
    <item name="android:textColor">@color/blue</item>
    <item name="android:textAllCaps">true</item>
</style>

answered Nov 12 '21 at 00:32

sorry_I_wont

639
1
9
16

score -1 · Answer 13 · answered Oct 06 '16 at 08:18

-1

Code:

button.setVisibility(View.INVISIBLE);

Xml:

android:background="@android:color/transparent"

answered Oct 06 '16 at 08:18

Chief Madog

1,738
4
28
55

score -2 · Answer 14 · answered Feb 15 '18 at 12:14

-2

You can do it easily by adding below attribute in xml file. This code was tested plenty of time.

android:background="@android:color/transparent"

answered Feb 15 '18 at 12:14

Chamath Jeevan

5,072
1
24
27

4

Why add this answer? This solution is already in two other answers, including the one with the most votes. – Makyen Jul 22 '18 at 17:23

score -3 · Answer 15 · edited Jan 09 '13 at 05:18

-3

You apply the background color as transparent(light gray) when you click the button.

ButtonName.setOnClickListener()

In the above method you set the background color of the button.

edited Jan 09 '13 at 05:18

Emil Vikström

90,431
16
141
175

answered Feb 10 '11 at 06:49

Pinki

21,723
16
55
88

6

Worrying that this was upvoted. Don't do this, please. The future maintainer will curse your name. Set a background with a selector, and have one color/drawable for pressed and one for not. Don't write code to change it in the listener - that is NOT how this is done. – themightyjon Jul 17 '15 at 11:25

Button background as transparent

15 Answers15

Linked

Related