Standard Android Button With a Different Color

Standard Android Button with a different color

I discovered that this can all be done in one file fairly easily. Put something like the following code in a file named custom_button.xml and then set background="@drawable/custom_button" in your button view:

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

    <item android:state_pressed="true" >
        <shape>
            <gradient
                android:startColor="@color/yellow1"
                android:endColor="@color/yellow2"
                android:angle="270" />
            <stroke
                android:width="3dp"
                android:color="@color/grey05" />
            <corners
                android:radius="3dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>

    <item android:state_focused="true" >
        <shape>
            <gradient
                android:endColor="@color/orange4"
                android:startColor="@color/orange5"
                android:angle="270" />
            <stroke
                android:width="3dp"
                android:color="@color/grey05" />
            <corners
                android:radius="3dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>

    <item>        
        <shape>
            <gradient
                android:endColor="@color/blue2"
                android:startColor="@color/blue25"
                android:angle="270" />
            <stroke
                android:width="3dp"
                android:color="@color/grey05" />
            <corners
                android:radius="3dp" />
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
</selector>

How to change the color of a button?

You can change the colour two ways; through XML or through coding. I would recommend XML since it's easier to follow for beginners.

XML:

<Button
    android:background="@android:color/white"
    android:textColor="@android:color/black"
/>

You can also use hex values ex.

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

Coding:

//btn represents your button object

btn.setBackgroundColor(Color.WHITE);
btn.setTextColor(Color.BLACK);

Button with two colors on each side

You could do it in more sophisticated way using LinearLayout as a button.
The simple example:

XML file with the LinearLayout button:

<LinearLayout android:id="@+id/sophisticated_button"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="150dp">

    <LinearLayout
        android:background="#333333"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:gravity="center"
        android:layout_weight="1">

        <ImageView
            android:layout_width="66dp"
            android:layout_height="66dp"
            android:src="@drawable/present"/>

    </LinearLayout>

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="2"
        android:gravity="center"
        android:text="SEND A GIFT \n TO A FRIEND"/>

</LinearLayout>

where present represents the Image located in your drawable directory.

The Activity where the button is located looks like this:

public class MainActivity extends Activity implements View.OnClickListener {

    private LinearLayout buttonLinearLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.skuska);

        buttonLinearLayout = (LinearLayout)findViewById(R.id.sophisticated_button);
        buttonLinearLayout.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.sophisticated_button:
                Toast.makeText(getApplicationContext(), "Sophisticated Button Pressed", Toast.LENGTH_LONG).show();
                break;
        }
    }
}

And the output:

Change default button style

If the button is a MaterialButton you will need to specify:

<item name="materialButtonStyle">@style/mainButtonStyle</item>

Different color on private device than virtual device android studio

It is because of the app's theme. You can change it in app/res/values/themes/themes.xml file. Dont forget to change the both of the night and normal version of the themes file.

---

Related Topics