Styles and Themes in Android

Themes in Android

An Android theme is simply an Android style that is applied to a full Activity or the entire application rather. A style can be applied as a theme for the whole application. In that case, all the activities supporting that style will follow it. To understand the concept better, let's define a custom theme of our own and use it in an android application. 

Now, go to your themes.xml file and add the following code to it. 

themes.xml:

<resources xmlns:tools="http://schemas.android.com/tools">
    <style name= "MyCustomStyle" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <item name="colorPrimary">#332628</item>
        <item name="colorPrimaryVariant">#7EC8E3</item>
        <item name="colorOnPrimary">@color/black</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <item name="android:textSize">18pt</item>
        <item name="android:textColor">#000C66</item>/>
    </style>
</resources>

Let's apply our custom theme to the app now that we've finished it, and to do so, go to the AndroidManifest.xml file in the manifests directory. And change the attribute android:theme of the application node.  

AndroidManifest.xml:

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

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/MyCustomStyle">
        <activity
            android:name=".MainActivity"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>
Now, add a text view with the style attribute set to "MyCustomStyle" in the activity_main.xml file.

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        style = "@style/MyCustomStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello Ninjas!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Output:

In this theme, we changed the primary color of the theme, which is reflected in the output.

Frequently Asked Questions

1. What is the primary color in an android application?
   It is the color that is most frequently used across the android application.
    
2. What is the difference between a primary color and a primary color variant?
   The primary variant color is generally used to differentiate between two elements of the program that have the same primary color, such as the app bar of the application and the system app bar.
    
3. What is the theme AppCompat?
   The AppCompat library provides themes for creating Material Design-compliant apps. In order to extend AppCompatActivity for an activity, the theme must have the Theme.AppCompat as its parent theme.

Conclusion

In this article, we have extensively discussed Style and Themes in Android and its implementation in Android Studio. We discussed how a Custom Style could be created and used to style a single view or use it as a theme for the entire application.

We hope that this blog has helped you enhance your knowledge regarding Styles and Themes. All the widgets are enclosed inside a UI layout and if you would like to learn more about layouts, check out our article on Android UI layouts. And to learn in-depth about android development, check out our Android Development course on the Coding Ninjas website. Do upvote our blog to help other ninjas grow. Happy Coding!