Android Jetpack Preferences

Nowadays we can observe that in almost all applications we use, a settings screen is available from where users can change their preferences according to them. For example apps like WhatsApp have options for dark mode and light mode, users can change the theme for an app with one click. Implementing a settings screen is a very good way we can provide a better user experience and it’s also kind of a trend. So that’s why we should implement the Preferences in your application by using the best possible and easiest way. In this article, we will be looking at the following points.

• Getting Started with
• Basic preferences
• Dialogues
• Widgets

Getting started with jetpack preferences

Before getting started we should know that there are two ways of implementing preferences in our app:

• The XML way: In the XML way we declare all our preferences in an XML file and use this file in our activity.
• The coding way: Apart from XML, we can also write codes for the Preferences in our activity. If we want to build an Android app without writing so many lines of code, then we shouldn’t use this.

Now we know the ways of user preferences in our app, now let’s add the library for jetpack preferences but before that create a project.

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.

Step 2: Add dependencies

Copy the following Jetpack Preference dependency and paste it into your App-level build.gradle file.

implementation ‘androidx.preference:preference:1.1.0-alpha05’

Basic Preferences

We can perform many tasks using the Settings Screen of our application, but the easiest and the most common are Simple Text, Simple Text with any summary, Simple Text with icon, and Simple Text with some styles or text-decoration as well. For using a simple text Preference, add the below code in your XML file in PreferenceScreen:

XML

<Preference
    app:key="preference_example"
    app:title="@string/title_preference"
    app:summary="@string/summary_preference"/>

We have used three properties in the code above. We will learn about each property of the <Preference> tag we used.

• app : key is used to uniquely identify a preference just like android : id tag we normally use.
• app : title is used to give a title to the preference 
• app : summary is used to give some summary to a certain preference

Just adding a simple text is not enough so you can also add some style to the preferences. For that, you have to make a string in strings.xml and use that string in your activity XML file inside <preference> tag. For example, we create two strings in strings.xml

XML

<string name="title_preference"><b>bold</b> <i>italic</i> <u>Underlined word</u></string>
<string name="summary_preference">You can use some styles in your preferences just the way its done hear.</string>

After adding strings in strings.xml your preference will look like 

XML

<Preference
    app:key="styled_example"
    app:title="@string/title_preference"
    app:summary="@string/summary_preference"/>

You can also add an icon to a preference by using app : icon property like shown below

XML

<Preference
    app:key="icon"
    app:title="@string/title_preference"
    app:summary="@string/summary_preference"
    app:icon="@drawable/ic_android"/>

Output for above preferences:

For using preferences by writing code you have to make an object of preference and apply all the properties as shown below. 

Kotlin

val simplePreference = Preference(context).apply {
    // to set the KEY
    key = "simple_preference"

    // to set the TITLE
    title = "Titie of Preference"

    // to set the SUMMARY
    summary = "Summary of Preference"

    // to add ICON
    icon = ContextCompat.getDrawable(context, R.drawable.ic_android)

    // to set one line title
    isSingleLineTitle = true
}

Dialogues

We can also add dialogues to our preferences. We can use the dialogue of any type as a simple alert dialogue with only text giving a message or a dialogue with EditText for taking input or dialogue which displays multiple select list preferences.

EditText Dialogue:

Add the following code which will create a text and after clicking on it, it will open a Dialogue without writing any code at the backend.

XML

<EditTextPreference
    app:key="edittext_example"
    app:title="@string/title_preference"
    app:useSimpleSummaryProvider="true"
    app:dialogTitle="@string/dialog_title_preference"/>

By using Kotlin it can be done as shown below

val editTextPreference = EditTextPreference(context).apply {
    key = "edittext_example"
    ...
}

List Preferences:

Now we will add list preferences but before that add the following lines in your strings.xml file.

XML

<string-array name="entries">
    <item>First Value</item>
    <item>Second Value</item>
    <item>Third Value</item>
</string-array>

<string-array name="entry_values">
    <item>1</item>
    <item>2</item>
    <item>3</item>
</string-array>

Now add the following code for Listpreference in your mainactivity.xml

XML

<ListPreference
    app:key="list_example"
    app:title="@string/title_preference"
    app:useSimpleSummaryProvider="true"
    app:entries="@array/entries"
    app:entryValues="@array/entry_values"
    app:dialogTitle="@string/dialog_title_preference"/>

Output:

Adding List preferences by using Kotlin code could be easier because in XML you have to declare items separately in string.xml

Kotlin

val listPreference = ListPreference(context).apply {
    key = "list_example"
    title = "@string/title_preference"
    entries = arrayOf("First Value", "Second Value", "Third Value")
    entryValues = arrayOf("1", "2", "3")
}

The list preferences we built above are just able to select only 1 option from multiple options but now we will create a multi-select list preference from which we would be able to select multiple options. The code is as shown below.

XML

<MultiSelectListPreference
    app:key="multi_select_list"
    app:title="@string/title_preference"
    app:summary="@string/summary_preference"
    app:entries="@array/entries"
    app:entryValues="@array/entry_values"
    app:dialogTitle="@string/dialog_title_preference"/>

Its Kotlin code is as below

Kotlin

val multiSelectListPreference = MultiSelectListPreference(context).apply {
    key = "multi_select_list"
    title = "@string/title_preference"
    summary = "@string/summary_preference"
    entries = arrayOf("First Value", "Second Value", "Third Value")
    entryValues = arrayOf("1", "2", "3")
}

Output:

Widgets

Now we will learn how to use widgets in preference. We can use the following widgets in our Preference.

• Checkbox
• SeekBar

We will make another activity that will use all of the widgets above as shown in the below code.

XML

<CheckBoxPreference
        android:key="checkbox_example"
        android:title="@string/title_preference"
        android:summary="@string/summary_preference"/>

<SeekBarPreference
        android:key="seekbar_example"
        android:title="@string/title_preference"
        android:defaultValue="20"/>

Output: