CODEWITHSUNDEEP
xamarin.androidandroid-preferencespreferenceactivityandroiddesignsupportpreferencescreen
pedzer
pedzer

Reputation: 172

How to remove the padding between preference title and the following preference?

I would like to remove the purple gap in my preference screen: preference

so that it should look like this: Google Play Store example

I'm using Xamarin Android and c# to develop my app. The preference screen is an PreferenceFragmentCompat from Android.Support.V7.Preferences library. The material style is set in my custom theme:

<style name="Theme.DarkTheme" parent="Theme.AppCompat.NoActionBar">
   <item name="colorPrimary">#673AB7</item>
   <item name="colorPrimaryDark">#512DA8</item>
   <item name="colorAccent">#039be5</item><!--#FF4081-->
   <item name="colorControlHighlight">#242424</item>
   <item name="android:listDivider">@style/android:drawable/divider_horizontal_dim_dark</item> 
   <item name="preferenceTheme">@style/PreferenceThemeOverlay.v14.Material</item>

Here is how my xml resource file looks like, which I call by AddPreferencesFromResource(Resources.Id.preference_screen) in my PreferenceFragmentCompats OnCreatePreferences() function:

<android.support.v7.preference.PreferenceScreen 
   xmlns:android="http://schemas.android.com/apk/res/android">
   <android.support.v7.preference.PreferenceCategory
    android:title="App">
        <Preference
            android:key="advsettings_preference"
            android:title="Erweiterte Einstellungen" />
        <Preference
            android:key="license_preference"
            android:title="Rechtliche Hinweise" />
   </android.support.v7.preference.PreferenceCategory>
</android.support.v7.preference.PreferenceScreen>

I already tried to fix it myself by adding padding attributes to PreferenceScreen, but nothing changed.

All the latest NuGet Packages from Xamarin Android are installed (v27.0.2). Thanks in advance.

Upvotes: 1

Views: 602

Answers (2)

Elvis Xia - MSFT
Elvis Xia - MSFT

Reputation: 10841

Please try set the style like this;

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    ...
    <!-- Customize your theme here. -->
    <item name="preferenceTheme">@style/MyPreferenceStyle</item>
</style>

<style name="MyPreferenceStyle" parent="@style/PreferenceThemeOverlay.v14.Material">
    <item name="preferenceCategoryStyle">@style/MyPreferenceCategoryStyle</item>
    <item name="android:paddingLeft">10dp</item>
    <item name="android:paddingRight">10dp</item>
</style>

<style name="MyPreferenceCategoryStyle" parent="@style/Preference.Category.Material">
    <item name="android:layout">@layout/preference_category</item>
</style>

And preference_category.axml:

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+android:id/title"
    android:textColor="?android:attr/colorAccent"
    android:textSize="14dp"
    android:fontFamily="sans-serif-medium"
    android:paddingStart="16dp"
    android:singleLine="true"
    android:paddingTop="16dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

And AppSettings:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.preference.PreferenceScreen
    xmlns:android="http://schemas.android.com/apk/res/android">
    <android.support.v7.preference.PreferenceCategory
        android:title="App">
        <Preference
            android:key="advsettings_preference"
            android:title="Erweiterte Einstellungen"
            android:summary="BenachRichtigung"/>
    </android.support.v7.preference.PreferenceCategory>
</android.support.v7.preference.PreferenceScreen>

It will resolve the gap issue. And also look similar to your screenshot of Google Play Store. Well, not exactly the same from the Layout Inspector, but similar:

enter image description here

Upvotes: 3

Raimo
Raimo

Reputation: 1536

The purple area when looking at your layout with "use layout bounds" in the developer options enabled represent margins, not padding as far as I know.

I suggest trying to make a custom layout for your PreferenceCategory and your Preference's and setting them in your above axml using the android:layout attribute as such:

android:layout="@layout/layout_name"

(Might need to play around with both android:layout and android:widgetLayout attributes)

Upvotes: 0

Related Questions