Search⌘ K

Custom Styles

Explore how to refine your Android login screen by applying custom styles and colors. Learn to extend Material Component themes in Kotlin, declare reusable colors, and style individual UI elements to create a cohesive and modern user interface.

We'll cover the following...

Recap

The login screen is almost ready. It’s time to polish the user interface with some custom styles and colors.

Let’s see what we need to do before applying custom styles. First, we need to make sure that our activity extends AppCompatActivity.

Kotlin
public class LoginActivity : AppCompatActivity {
...
}

Next, we need to use one of the material component themes inside the activity or application tags in the AndroidManifest.xml file.

XML
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.travelblog">
<application
android:theme="@style/Theme.MaterialComponents.DayNight.NoActionBar"
android:label="Travel Blog">
...
</application>
</manifest>

Now, all the user interface components are going to use default styles declared in the ...