An Android application often includes settings that allow the user to modify features of the app. For example, SUSI Android app allows users to specify whether they want to use in built mic to give speech input or not. Different settings in SUSI Android app and their purpose are given below
| Setting | Purpose |
| Enter As Send | It allows users to specify whether they want to use enter key to send message or to add new line. |
| Mic Input | It allows users to specify whether they want to use in built mic to give speech input or not. |
| Speech Always | It allows users to specify whether they want voice output in case of speech input or not. |
| Speech Output | It allows users to specify whether they want speech output irrespective of input type or not. |
| Language | It allows users to set different query language. |
| Reset Password | It allows users to change password. |
| Select Server | It allows users to specify whether they want to use custom server or not. |
Android provides a powerful framework, Preference framework, that allows us to define the way we want preferences. In this blog post, I will show you how Settings UI is created using Preference framework and Kotlin in SUSI Android.
Advantages of using Preference are:
- It has own UI so we don‘t have to develop our own UI for it
- It stores the string into the SharedPreferences so we don’t need to manage the values in SharedPreference.
First, we will add the dependency in build.gradle(project) file as shown below.
| compile ‘com.takisoft.fix:preference-v7:25.4.0.3’ |
To create the custom style for our Settings Activity screen we can set
| android:theme=“@style/PreferencesThemeLight” |
as the base theme and can apply various other modifications and colour over this. By default, it has the usual Day and Night theme with NoActionBar extension.
Layout Design
I used PreferenceScreen as the main container to create UI of Settings and filled it with the other components. Different components used are following:
- SwitchPreferenceCompat: This gives us the Switch Preference which we can use to toggle between two different modes in the setting.
| <com.takisoft.fix.support.v7.preference.SwitchPreferenceCompat
android:defaultValue=”true” |
- PreferenceCategory: It is used for grouping the preference. For example, Chat Settings, Mic Settings, Speech Settings etc are different groups in settings.
- ListPreference: This preference display list of values and help in selecting one. For example in setLanguage option ListPreference is used to show a list of query language. List of query language is provided via xml file array.xml (res/values). Attribute android:entries point to arrays languagentries and android:entryValue holds the corresponding value defined for each of the languages.
| <ListPreference
android:title=“@string/Language” android:entries=“@array/languagentries” android:entryValues=“@array/languagentry” </ListPreference> |
Implementation in SUSI Android
All the logic related to Preferences and their action is written in ChatSettingsFragment class. ChatSettingsFragment extends PreferenceFragmentCompat class.
| class ChatSettingsFragment : PreferenceFragmentCompat() |
Fragment populate the preferences when created. addPreferencesFromResource method is used to inflate view from xml.
| addPreferencesFromResource(R.xml.pref_settings) |
Reference
- Main site link of PreferenceScreen by Google: https://developer.android.com/reference/android/preference/PreferenceScreen.html
- Main site link of PreferenceFragmentCompat: https://developer.android.com/reference/android/support/v7/preference/PreferenceFragmentCompat.html
- Article with example on android settings using PreferenceFragmentCompat: https://storiesandroid.wordpress.com/2015/10/06/android-settings-using-preference-fragments/
- Article by Jakob Ulbrich on building the setting screen in Android:https://medium.com/@JakobUlbrich/building-a-settings-screen-for-android-part-1-5959aa49337c