How to Customize List Preference Radio Button

How to replace radio button with image in List Preference Android

You have to extend ListPreference and override onPrepareDialogBuilder(Builder) and OnCreateDialogView()
see this: Ho to customize list preference radio button

How to display a RadioButton list in PreferenceScreen (not in a Dialog)

According to this Gist, you can extend CheckBoxPreference and create a layout with a radio button.

Like this:
First, create a new layout containing an only radio button let's call it

preference_widget_radiobutton.xml

<?xml version="1.0" encoding="utf-8"?>
<RadioButton xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@android:id/checkbox"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:clickable="false"
        android:focusable="false" />

then create a subclass of CheckBoxPreference:

class RadioButtonPreference : CheckBoxPreference {

    constructor(context: Context, attrs: AttributeSet, defStyle: Int) : super(context, attrs, defStyle) { setView() }

    constructor(context: Context, attrs: AttributeSet? = null) : super(context, attrs) { setView() }

    private fun setView(){
        widgetLayoutResource = R.layout.preference_widget_radiobutton
    }

    override fun onClick() {
        if (this.isChecked) 
            return

        super.onClick()
    }
}

in your app_preferences.xml screen:

    <PreferenceCategory android:title="Photo Filters">
        <Your_class_package_dirctory.RadioButtonPreference
                android:key="naturals"
                android:title="Natural" />
        <Your_class_package_dirctory.RadioButtonPreference
                android:key="boosted"
                android:title="Boosted" />
        <Your_class_package_dirctory.RadioButtonPreference
                android:key="saturated"
                android:title="Saturated" />
    </PreferenceCategory>

Now as you can see this will behave like normal CheckBox, it won't get uncheck the previous radio button, to solve this issue:

In your preference screen code:

class SettingsFragment : PreferenceFragmentCompat(), Preference.OnPreferenceClickListener{
    private val sharedPreference = AppPreferences()

    private var oldCheckedPreference: RadioButtonPreference? = null

    override fun onCreatePreferences(savedInstanceState: Bundle?, rootKey: String?) {
        setPreferencesFromResource(R.xml.app_preferences, rootKey)

        findPreference<RadioButtonPreference>("naturals")?.apply {
            /*
            You can set the defualt button to be checked by:
              updateCheckedRadioButton(this)
            */
            onPreferenceClickListener = this@SettingsFragment
        }
        findPreference<RadioButtonPreference>("boosted")?.onPreferenceClickListener = this
        findPreference<RadioButtonPreference>("saturated")?.onPreferenceClickListener = this

    }

    private fun updateCheckedRadioButton(radioButtonPreference: RadioButtonPreference) {

        //Uncheck the previous selected button if there is.
        oldCheckedPreference?.isChecked = false
        radioButtonPreference.isChecked = true
        oldCheckedPreference = radioButtonPreference

    }

    override fun onPreferenceClick(preference: Preference): Boolean {
        if (preference is RadioButtonPreference)
            updateCheckedRadioButton(preference)

        return true
    }

}

and the result is:

Custom Preference With Radio Button Issue

If you look through the logcat you can see that you need a ListView.

But you're going at this all wrong. You should basically create a Preferences.xml file in which you specify which preference widgets you want in your PreferenceActivity, e.g. RadioButtons, and then assign that xml file to your PreferenceActivity like this:

addPreferencesFromResource(R.xml.preferences);

Example of Preferences.xml from this tutorial (file goes in res/xml folder which you should create yourself)

<?xml version="1.0" encoding="utf-8"?>
<PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android" >
 <PreferenceCategory
   android:summary="Username and password information"
   android:title="Login information" >
  <EditTextPreference
     android:key="username"
     android:summary="Please enter your login username"
     android:title="Username" />
  <EditTextPreference
     android:key="password"
     android:summary="Enter your password"
     android:title="Password" />
 </PreferenceCategory>

 <PreferenceCategory
   android:summary="Username and password information"
   android:title="Settings" >
  <CheckBoxPreference
     android:key="checkBox"
     android:summary="On/Off"
     android:title="Keep me logged in" />

  <ListPreference
     android:entries="@array/listOptions"
     android:entryValues="@array/listValues"
     android:key="listpref"
     android:summary="List preference example"
     android:title="List preference" />
 </PreferenceCategory>
</PreferenceScreen>

So take a look here

Edit:

You can add a custom entry to the ListView in Preferences.xml like this:

    <Preference
        android:layout="@layout/your_custom_pref_entry"
        android:key="SOME_KEY_NAME" />

Not sure how to handle the RadioButtons selection from there though.

Change ListPreference's colors to match theme style

Changing the android:textColorSecondary attribute of the NoteCreation.Dialog did it.

How to add radio group button in preference xml in android in one row?

All EXISTING preferences can be found here. If you're not too picky on showing all the options at all times, you can use ListPreference. It will only show the currently selected option in the layout. When the user selects it, a dialog will be shown displaying the list of all options to choose from.

If you truly want it to look like the image above, you'll need to extends Preference and implement your own MultiSelectPreference. You can specify your own layout and use standard widgets to design it exactly how you want it to look.

---

Related Topics