Change App Background Colour in the Android Studio
In this tutorial, we will take about how you can change app background colour in the android studio using the Radio Button inside Radio Group.
Developing boring Apps and publishing them just the sake for it won’t help you to gain many downloads for your App and maybe you would end up having bad ratings for your App on the Google Play Store.
People love dynamic Apps, not just static Apps. If your app is just a display -show type App people would just download it and would delete it eventually as the app would seem too plain.
Change App background colour in the Android Studio
I would give you full code below at the end of the post including XML file along with the main Java file.
In this tutorial, we would put three radio buttons with each labelled with different colour names. Once a user clicks on a particular Radio button. The background of the App would change according to the colour mentioned beside the radio button.
Read More: Google Login And Registration For Android Using Firebase Authentication
Activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/mainlayout" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#FFFFFF" tools:context=".MainActivity"> <TextView android:layout_width="298dp" android:layout_height="wrap_content" android:layout_alignParentStart="true" android:layout_alignParentTop="true" android:layout_alignParentEnd="true" android:layout_marginStart="60dp" android:layout_marginTop="219dp" android:layout_marginEnd="60dp" android:text="ANDROIDHIRE.COM" android:textAlignment="center" android:textSize="24sp" /> <RadioGroup android:id="@+id/rmain" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" > <RadioButton android:id="@+id/r_red" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Red" /> <RadioButton android:id="@+id/r_blue" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Blue" /> <RadioButton android:id="@+id/r_orange" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Orange" /> </RadioGroup> </RelativeLayout>
As stated above in the post that we are going to put three radio buttons, I have included three RadioButton tags each one having its text color set to different ones.
You have to put RadioButton inside the RadioGroup Tags.
Also, note that we have given android:id within the tag of RadioButton, as well as layout_width and layout_height, is also set to wrap_content.
How To Change App Background Colour Using Java
So now coming to MainActivity file. In order to initiate color change, we have used a switch case (having three cases .. one for each color respectively).
As you can see from the code I have mentioned color codes in Hexa format
- #EC4849 for RED
- #3498DB for BLUE
- #f39c12 for ORANGE
In order to change the color of the background once the radio button is activated, we have used onCheckedChanged function and setOnCheckedChangeListener on radioGroup.
MainActivity.Java
package androidhire.com.bgchanger;
import android.graphics.Color;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.RadioGroup;
import android.widget.RelativeLayout;
public class MainActivity extends AppCompatActivity {
RelativeLayout layout; RadioGroup radioGroup;
// androidhire.com
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
layout = findViewById(R.id.mainlayout);
radioGroup = findViewById(R.id.rmain);
radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch (checkedId) {
case R.id.r_red:
layout.setBackgroundColor(Color.parseColor("#EC4849"));
break;
case R.id.r_blue:
layout.setBackgroundColor(Color.parseColor("#3498DB"));
break;
case R.id.r_orange:
layout.setBackgroundColor(Color.parseColor("#f39c12"));
break;
}
}
});
}
}
How To Change App Background Colour Using Kotlin
What you have to do to just make a kotlin file and import the kotlin plugin to do the configuration. After the import of the kotlin plugin make kotlin file. Right-click on a package and click on NEW -> Kotlin File. Copy and paste below code in your kt file.
MainActivity.kt
package androidhire.com.myapplication
import android.graphics.Color
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.widget.RadioGroup
import android.widget.RelativeLayout
class MainActivity : AppCompatActivity() {
internal lateinit var layout: RelativeLayout
internal lateinit var radioGroup: RadioGroup
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
layout = findViewById(R.id.mainlayout)
radioGroup = findViewById(R.id.rmain)
radioGroup.setOnCheckedChangeListener { group, checkedId ->
when (checkedId) {
R.id.r_red -> layout.setBackgroundColor(Color.parseColor("#EC4849"))
R.id.r_blue -> layout.setBackgroundColor(Color.parseColor("#3498DB"))
R.id.r_orange -> layout.setBackgroundColor(Color.parseColor("#f39c12"))
}
}
}
}
ScreenShot
Result
Thus you can see that upon clicking on different radio buttons the background colour is changing accordingly. This would make your App look attractive if you are a beginner in Android Development. Do try these on your own.
Thanks a lot guys for following our series on Android Tutorials. If you want a tutorial on any topic do let us know in the comments section below. We would try to upload it here on AndroidHire.