Search code examples
androidandroid-edittextandroid-themeandroid-styles

Android text selection handles have white background (instead of transparent)


The following screenshot shows my problem:

enter image description here

The text selection handles have a white background and overlay other UI elements. How can I make the background transparent?

Or the better question is actually: what could I possibly have done to make the background white?

Here is the style applied to the EditText:

<style name="TextInputLayout" parent="AppTheme">
    <item name="android:background">@color/grey_50</item>
    <item name="colorControlNormal">@color/grey_500</item>
    <item name="colorControlActivated">@color/grey_900</item>
    <item name="colorControlHighlight">@color/grey_900</item>
    <item name="backgroundTint">@color/grey_900</item>
    <item name="colorAccent">@color/grey_900</item>
    <item name="colorPrimary">@color/grey_900</item>
    <item name="android:textCursorDrawable">@null</item>
</style>

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/grey_500</item>
    <item name="colorPrimaryDark">@color/grey_500</item>
    <item name="colorAccent">@color/grey_700</item>
    <item name="android:colorBackground">@color/grey_50</item>
    <item name="android:colorForeground">@color/grey_900</item>
    <item name="android:textColorPrimary">@color/grey_900</item>
    <item name="android:textColorPrimaryInverse">@color/grey_50</item>
    <item name="android:textColorSecondary">@color/grey_900</item>
    <item name="android:textColorSecondaryInverse">@color/grey_50</item>
    <item name="android:windowBackground">@color/grey_50</item>
    <item name="android:textColorHint">@color/grey_700</item>
    <item name="android:colorActivatedHighlight">@color/grey_900</item>
    <item name="colorControlNormal">@color/grey_700</item>
    <item name="colorControlActivated">@color/grey_900</item>
    <item name="colorControlHighlight">@color/grey_900</item>
    <item name="android:textColorHighlight">@color/grey_500</item>
    <item name="android:colorControlNormal" tools:targetApi="lollipop">@color/grey_700</item>
    <item name="android:colorControlActivated" tools:targetApi="lollipop">@color/grey_900</item>
    <item name="android:colorControlHighlight" tools:targetApi="lollipop">@color/grey_900</item>
    <item name="android:stateListAnimator" tools:targetApi="lollipop">@null</item>
    <item name="android:statusBarColor" tools:targetApi="lollipop">@color/grey_900</item>
    <item name="android:navigationBarColor" tools:targetApi="lollipop">@color/grey_900</item>
</style>

Edit #1

The EditText's XML (note that I see the same behaviour with EditTexts and AppCompatEditTexts):

<android.support.design.widget.TextInputLayout
    android:id="@+id/input_layout_home_autocomplete"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="@dimen/activity_horizontal_margin_small"
    android:layout_marginTop="@dimen/activity_horizontal_margin_small"
    android:layout_weight="3.5"
    android:background="@null"
    android:hint="@string/location"
    android:padding="@dimen/activity_vertical_margin_medium"
    android:theme="@style/TextInputLayout"
    app:hintAnimationEnabled="true"
    app:hintEnabled="true"
    app:hintTextAppearance="@style/TextAppearance.TextInputLayout">

    <AutoCompleteTextView
        android:id="@+id/user_home_autocomplete"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="3.5"
        android:dropDownWidth="match_parent"
        android:inputType="textAutoComplete"
        android:maxLines="1"
        android:paddingTop="@dimen/activity_horizontal_margin_small" />

</android.support.design.widget.TextInputLayout>

The Phone I used for the screenshot runs Android 6.0.1 with OxygenOS 3.2.7

Getting rid of all @null elements did not work.


Solution

  • As per the android docs, the theme is applied to views used in the layouts of entire activity or application. For individual views in the layout , we need to apply styles.

    Ref: https://developer.android.com/guide/topics/ui/themes.html

    The theme is applied as a common style for all the views in an activity or application.