CODEWITHSUNDEEP
android
Anju
Anju

Reputation: 9479

Button background as transparent

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?

Upvotes: 213

Views: 333471

Answers (16)

Nsem Confident
Nsem Confident

Reputation: 11

to apply a transparent background to a button, just set the backgroundTint property to #00FFFFFF

        android:backgroundTint="#00FFFFFF"

Upvotes: 0

sorry_I_wont
sorry_I_wont

Reputation: 658

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>

Upvotes: 0

Shihab Uddin
Shihab Uddin

Reputation: 6931

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.

Upvotes: 5

C. Skjerdal
C. Skjerdal

Reputation: 3099

I achieved this with in XML with 

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

Upvotes: 31

Faraz
Faraz

Reputation: 2154

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;
    }
});

Upvotes: 9

Viraj Singh
Viraj Singh

Reputation: 2329

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"/>

Upvotes: 1

Chamath Jeevan
Chamath Jeevan

Reputation: 5172

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

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

Upvotes: -2

Mohanraj
Mohanraj

Reputation: 439

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"/>

Upvotes: 35

Raphael S
Raphael S

Reputation: 7

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.

Upvotes: 1

Chief Madog
Chief Madog

Reputation: 1507

Code:

button.setVisibility(View.INVISIBLE);

Xml:

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

Upvotes: -1

Sindri &#222;&#243;r
Sindri &#222;&#243;r

Reputation: 2927

I used

btn.setBackgroundColor(Color.TRANSPARENT);

and 

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

Upvotes: 12

Muhammad Aamir Ali
Muhammad Aamir Ali

Reputation: 21097

Try new way to set background transparent 

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

Upvotes: 142

Hunkeone
Hunkeone

Reputation: 505

You may also use: in your xml:

android:background="@null"

or in code:

buttonVariable.setBackgroundColor(Color.TRANSPARENT);

Upvotes: 38

Pinki
Pinki

Reputation: 21929

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.

Upvotes: -3

Prasham
Prasham

Reputation: 6686

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.

Upvotes: 35

Steve Pomeroy
Steve Pomeroy

Reputation: 10129

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.

Upvotes: 402

Related Questions