Android preference icons not centered on devices => Lollipop

Question

I've added an icon to a ListPreference with android:icon, but on devices with Lollipop or Marshmallow, the icon is placed on the left side of the available space instead of in the center where it is on devices pre-Lollipop, and how it should be.

Devices pre-Lollipop (api 18 - JB 4.3), this is how it should be!

Post-Lollipop (api 23 - MM), icon not centered.

PreferenceScreen

<PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android">

    <PreferenceCategory android:title="@string/general">

        <ListPreference
            android:defaultValue="@string/pref_languages_default"
            android:entries="@array/languages"
            android:entryValues="@array/listLangValues"
            android:icon="@drawable/translate"
            android:key="language"
            android:title="@string/languages" />

    </PreferenceCategory>

</PreferenceScreen>

translate.xml drawable

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="24dp"
    android:width="24dp"
    android:viewportWidth="24"
    android:viewportHeight="24">
    <path android:fillColor="#fff" android:pathData="M12.87,15.07L10.33,12.56L10.36,12.53C12.1,10.59 13.34,8.36 14.07,6H17V4H10V2H8V4H1V6H12.17C11.5,7.92 10.44,9.75 9,11.35C8.07,10.32 7.3,9.19 6.69,8H4.69C5.42,9.63 6.42,11.17 7.67,12.56L2.58,17.58L4,19L9,14L12.11,17.11L12.87,15.07M18.5,10H16.5L12,22H14L15.12,19H19.87L21,22H23L18.5,10M15.88,17L17.5,12.67L19.12,17H15.88Z" />
</vector>

How can I center it on LL or MM?

Answer 1

I've spent the entire day trying to figure out the same thing. I ended up setting the layout for each preference to a modified version of the default layout. I changed the image view padding from -4dp to 0dp and icon_frame's minwidth from 60dp to 56dp.

It's definitely not ideal, but it'll work for now.

So

Add the preference layout to ListPreference in Preference screen:

<ListPreference
        android:defaultValue="@string/pref_languages_default"
        android:entries="@array/languages"
        android:entryValues="@array/listLangValues"
        android:icon="@drawable/translate"
        android:key="language"
        android:title="@string/languages"
        android:layout="@layout/my_preference"            
        />

And create layout\my_preference.xml:

<?xml version="1.0" encoding="utf-8"?><!-- Copyright (C) 2014 The Android Open Source Project

 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at

      http://www.apache.org/licenses/LICENSE-2.0

 Unless required by applicable law or agreed to in writing, software
 distributed under the License is distributed on an "AS IS" BASIS,
 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
-->

<android.support.v7.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/activatedBackgroundIndicator"
android:clipToPadding="false"
android:gravity="center_vertical"
android:minHeight="?attr/listPreferredItemHeightSmall"
android:orientation="horizontal"
android:paddingEnd="?attr/listPreferredItemPaddingRight"
android:paddingLeft="?attr/listPreferredItemPaddingLeft"
android:paddingRight="?attr/listPreferredItemPaddingRight"
android:paddingStart="?attr/listPreferredItemPaddingLeft"
tools:ignore="NewApi">

<android.support.v7.widget.LinearLayoutCompat
    android:id="@+id/icon_frame"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="0dp"
    android:layout_marginStart="0dp"
    android:gravity="start|center_vertical"
    android:minWidth="56dp"
    android:orientation="horizontal"
    android:paddingBottom="4dp"
    android:paddingEnd="12dp"
    android:paddingRight="12dp"
    android:paddingTop="4dp">

    <android.support.v7.widget.AppCompatImageView
        android:id="@+android:id/icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxHeight="48dp"
        android:maxWidth="48dp" />
</android.support.v7.widget.LinearLayoutCompat>

<RelativeLayout
    android:layout_width="0px"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:paddingBottom="16dp"
    android:paddingTop="16dp">

    <android.support.v7.widget.AppCompatTextView
        android:id="@android:id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?attr/textAppearanceListItem"
        tools:text="title" />

    <android.support.v7.widget.AppCompatTextView
        android:id="@android:id/summary"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@android:id/title"
        android:layout_alignStart="@android:id/title"
        android:layout_below="@android:id/title"
        android:textAppearance="?android:attr/textAppearanceListItemSecondary"
        android:textColor="?android:attr/textColorSecondary"
        tools:text="summary" />
</RelativeLayout>

<!-- Preference should place its actual preference widget here. -->
<android.support.v7.widget.LinearLayoutCompat
    android:id="@android:id/widget_frame"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:gravity="end|center_vertical"
    android:orientation="vertical"
    android:paddingLeft="16dp"
    android:paddingStart="16dp" />

Again, it's definitely not the right solution, but it's a solution. Hopefully it helps.