ndraiman
ndraiman

Reputation: 691

EditText not tinted in Accent color on lollipop devices

I'm Software Engineering student that just started learning android development a couple months ago during my spare time.

at the moment im making my first app while learning in the process and i ran into a problem.

I'm using a DialogFragment and for some reason the Accent color i use in my theme is overridden only in pre-lollipop devices (both emulator and physical).

you can notice that only the floating hint is tinted in lollipop.

For Example:

my DialogFragment layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/dialog_add_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<android.support.design.widget.TextInputLayout
    android:id="@+id/input_title_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <EditText
        android:id="@+id/input_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="16dp"
        android:hint="@string/dialog_add_title_hint"
        android:imeOptions="actionNext"
        android:inputType="text"
        android:singleLine="true" />

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

<android.support.design.widget.TextInputLayout
    android:id="@+id/input_password_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <EditText
        android:id="@+id/input_password"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="16dp"
        android:hint="@string/dialog_add_password_hint"
        android:imeOptions="actionGo"
        android:inputType="text"
        android:singleLine="true" />

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

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <Button
        android:id="@+id/input_cancel"
        style="?attr/buttonBarButtonStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="16dp"
        android:layout_weight="1"
        android:text="Cancel" />

    <Button
        android:id="@+id/input_confirm"
        style="?attr/buttonBarButtonStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="16dp"
        android:layout_weight="1"
        android:text="Add" />

</LinearLayout>

my values/styles.xml:

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="colorControlHighlight">@color/colorHighlight</item>

    <!-- Context Action Mode will Overlay Toolbar -->
    <item name="windowActionModeOverlay">true</item>

</style>

i already tried several solutions to no avail:

  1. overriding colorControlActivated and colorControlNormal - only changes floating hint tint
  2. changing the tint programmatically, but that only changes the underline while not focused:

    Drawable background = InputTextLayout.getEditText().getBackground(); DrawableCompat.setTint(background, yourColor); InputTextLayout.getEditText().setBackground(background);

using EditText alone, not wrapped in TextInputLayout, doesn't help either.

any ideas?

Thanks in Advance

Upvotes: 0

Views: 1174

Answers (1)

ndraiman
ndraiman

Reputation: 691

after a thorough search through the internet i stumbled upon a question here in stackoverflow regarding animating a DialogFragment - here

the answer in that link referred to a post by a Google Engineer saying:

...DialogFragment is just a wrapper around a Dialog to help manage its lifecycle. Dialogs are top-level windows so their animations are window animations, just like when you use Dialog in all other situations. You thus control the animations of dialogs through the theme or explicit window animation style you have set in its WindowManager.LayoutParams.

so i decided to check how to theme the DialogFragment & found this guide by CodePath - here

basically, in your App Theme, in order to override the Dialog Themes you have to add the following:

<style name="AppTheme" parent...>
    ....

    <!-- this will override DialogFragment theme -->
    <item name="android:dialogTheme">@style/MyDialogFragmentTheme</item>
    <!-- this will override AlertDialog theme -->
    <item name="android:alertDialogTheme">@style/MyAlertDialogTheme</item>
</style>

<style name="CustomAlertDialogTheme.Animation">
    ...
</style>

<style name="MyDialogFragmentTheme" parent="Theme.AppCompat.Light.Dialog">
    ...
</style>

in each of the theme you can override attributes like colorPrimary, colorAccent etc.

if using this method makes your DialogFragment appear without a title (it happend to me), then add the following to its style:

<item name="android:windowNoTitle">false</item>

Bonus - adding animations

in order to add animations to either the AlertDialog or DialogFragment, write the following in its style:

<style name="MyDialogFragmentTheme" parent="Theme.AppCompat.Light.Dialog">
        ...
        <item name="android:windowAnimationStyle">@style/MyDialogFragmentTheme.Animation</item>

</style>

then you need to create a style for the animation, for example:

<style name="MyDialogFragmentTheme.Animation">
        <item name="android:windowEnterAnimation">@anim/dialog_slide_in_up</item>
        <item name="android:windowExitAnimation">@anim/dialog_slide_out_down</item>
        <item name="android:interpolator">@android:interpolator/anticipate</item>
</style>

there's more info in the CodePath guide linked above.

note that this all takes place in values/styles.xml

hope this helps other people.

Upvotes: 1

Related Questions