Styling custom dialog fragment not working

Question

I'm trying to style all my dialog fragments to look the same in my app. The dialogs coming from my settings fragment are styled exactly the way I want it. For my custom dialog fragments, the style is similar but not exactly the same. For some reason the spinner, timepicker, datepicker, radiobuttons, and edittext widgets inside my custom dialog fragments don't pick up the same style. In fact, the widgets blend in with the white background and you can't see that they are there. What am I doing wrong?

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"/>

<style name="Theme.Base" parent="AppTheme">
    <item name="colorPrimary">@color/PrimaryBackgroundColor</item>
    <item name="colorPrimaryDark">@color/SecondaryBackgroundColor</item>
    <item name="colorAccent">@color/ColorBackgroundAccent</item>
    <item name="android:textColorPrimary">@color/PrimaryTextColor</item>
    <item name="android:alertDialogTheme">@style/AppTheme.DialogStyle</item>
</style>
    <style name="AppTheme.DialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:textColorPrimary">@color/PrimaryBackgroundColor</item>
    <item name="colorAccent">@color/ColorBackgroundAccent</item>
</style>

I'm applying the theme to my custom dialog fragment like this:

 AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), R.style.AppTheme_DialogStyle);

As you can see, the radio button selected color red and you can't see the unselected radio button.

Hoffman

Both the screenshots you provided look similar apart from the radio button accent color. What exactly do you want to change in the custom dialog? – Fisch

I want the color of the radio buttons to match and also, my other dialogfragment with timepicker, datepicker, and spinner are blending in with the background for some reason, so the user won't be able to see them. – Hoffman

Answer 1

Finally got an answer!!!

It's an issue or bug with AppCompat 22+. Check out link here

Apparently this was a bug with fragments and widgets weren't getting the material themed in a fragment. It seems they fixed this issue, but the issue still holds in a dialog fragment based on what I'm going through. The problem comes when you use the inflater instance passed to Fragment#onCreateView(). The workaround for now is to instead used the LayoutInflater from getActivity().getLayoutInflater() according to google.

So I changed my code to:

View view = getActivity().getLayoutInflater().inflate(R.layout.dialog, null);

from:

View view = LayoutInflater.from(getActivity().getApplicationContext()).inflate(R.layout.dialoge, null);

All my widgets are now themed. Thanks everyone. Hopes this helps someone else.

Hoffman

ugh...can't believe it's still not fixed in the 23.4.0 support libs :-( – Lamellirostral

I'm going to print out this question and answer and wallpaper my room with it. Thank you for getting back! I'm glad I found this after an hour, not three days... – Lassiter

Issue is still not fixed and the workaround you specified worked. Although I would suggest to use inflater from Activity directly instead of using Application wise inflator. – Assurbanipal

Answer 2

I believe you need to set the theme on the actual Dialog and not the Fragment

Use this constructor to create your AlertDialog:

AlertDialog.Builder(Context context, int theme)

ie

AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), theme)

Ornery

Florian, that's exactly what I have in my post AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), R.style.AppTheme_DialogStyle); – Hoffman

I've facing the same issue when i was trying to make a custom dialog with a ratingBar. (if i good remember there is somethink special under the dialog and maybe u'll have to custom the ratingBar, i'll check this out) – Ornery

Thanks a lot. Let me know. – Hoffman

Answer 3

I think you need to add one more item in style of your dialog. android:textColorSecondary will show color of un selected checkbox.

in your style add it.

</style>
    <style name="AppTheme.DialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:textColorPrimary">@color/PrimaryBackgroundColor</item>
    <item name="colorAccent">@color/ColorBackgroundAccent</item>
     <item name="android:textColorSecondary">#000000</item>
</style>

It will make un Checked checkbox or toggle button edge color black. you need to change #000000 to color your want to show.

Woodhead

try to add it in AppTheme and check. – Woodhead

No good. It seems that nothing in my apptheme applies to any of the widgets in my custom dialog fragment – Hoffman

Answer 4

See if this helps - Android appcompat-v7:21.0.0 change material checkbox colors

In short, try setting android:textColorSecondary.

Looselimbed

I did try that. I put that in my dialogtheme and apptheme, but didn't work. It seems that my appTheme doesn't apply to any widgets in my custom dialog fragment – Hoffman

How about android:textColorSecondaryInverse? – Looselimbed

Nothing unfortunately :( – Hoffman

Just in case, are you using appcompat 22.1 or later, and import from android.support.v7.app.AlertDialog? – Looselimbed

com.android.support:appcompat-v7:23.0.1 and yes I'm importing from v7 – Hoffman

Perhaps you can try your luck with the answer by neoteknic #29797634 (use xml rather than the second parameter to style Dialog)? – Looselimbed

I'm thinking because I'm using a custom view for my dialog fragment, I may need to style each of the widgets inside the layout. Thanks for the help :) – Hoffman