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);
My settings dialog looks like this (Exactly how I want it):
Settings Dialog Fragment
My custom dialog fragment looks like this:
Custom Dialog Fragment
As you can see, the radio button selected color red and you can't see the unselected radio button.
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.
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)
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.
See if this helps -
Android appcompat-v7:21.0.0 change material checkbox colors
In short, try setting android:textColorSecondary.
Related
I have found some similar questions on this topic but it works for support version and not on androidx. I wasn't able to make this change on androidx. But on the previous support version there are solutions for it already. Can anyone give me some directions on how I can change the title and editetext field text color in EditTextPreference? Currently the color is white and with the background being white too, the texts are not visible.
And here are the solutions I found on stackoverflow already but I wasn't able to use.I would like to change the white text color to black. Thank you.
from adneal's solution
from Murphybro2's solution
In the thread of Murphybro2's solution we got also the solution for androidx
https://stackoverflow.com/a/58836953
You can change the AlertDialogStyle used by your app by providing a custom Theme style
<style name="AppTheme.Settings">
<!-- This will change the opening dialogs for EditTextPreference -->
<item name="alertDialogStyle">#style/Theme.example.AlertTheme</item>
</style>
<style name="Theme.example.AlertTheme" parent="">
<item name="android:textViewStyle">#style/Theme.AlertTextStyle</item>
<item name="android:textColor">#color/pink</item>
<item name="android:editTextBackground">#color/pink</item>
<item name="android:windowMinWidthMajor">#dimen/abc_dialog_min_width_major</item>
<item name="android:windowMinWidthMinor">#dimen/abc_dialog_min_width_minor</item>
<item name="android:windowIsFloating">true</item>
</style>
<style name="Theme.AlertTextStyle" parent="Theme.example">
<item name="android:textColorPrimary">#color/gray</item>
</style>
The most important one for me was "windowIsFloating">true because else the window is stuck to the top of your screen
For me somehow only adding the extra textViewStyle helped to change the top text inside the dialog, but I think its because of my example theme.
I was able to change the color of the title of the dialog box created by the androidx.preference.EditTextPreference in the way presented in that answer. But I could not change the color of the text in the EditText widget placed in that dialog in that way and I needed to use the following method.
AndroidX version of EditTextPreference allows you to set a listener on the event of binding the EditText. You can use it for example in onCreatePreferences of the androidx.preference.PreferenceFragmentCompat class to change the attributes of the EditText widget.
override fun onCreatePreferences() {
super.onCreatePreferences()
findPreference<EditTextPreference>("my_preference_key")?.let {
it.setOnBindEditTextListener { editText ->
editText.setTextColor(Color.BLACK)
}
}
}
}
I have the following in my styles.xml
<style name="dialog_style" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="colorAccent">#ffaaaa00</item>
<item name="android:background">#ff444400</item>
<item name="android:textColorPrimary">#ffa25600</item>
</style>
(The horrible colours are for testing only!)
This gives the following
What I want is a dark/black background but when I do that, the text is unreadable.
Q: How do I change the text colour of "Cut", "Copy"...?
tia,
Kevin
I think it's a little bit better solution than user3247782's,
<style name="CustomAlertDialog" parent="Theme.AppCompat.Light.Dialog.Alert">
...
<item name="android:popupBackground">#android:color/transparent</item>
</style>
You can change them by following style names:
<item name="colorAccent">#color/twoCuteSelectionHandlersColor</item>
<item name="android:textColorHighlight">#color/selectionColor</item>
Also you can set highlight color directly for pacific EditText using android:textColorHighlight attribute in xml layout or programmatically:
et.setHighlightColor(color);
For context menu you need create your own context menu. check this question for how disabling default context menu and implementing custom menu.
This isn't really an answer. The black-on-black edit menu is only generated from an EditText contained in an AlertDialog. The same code in a Fragment gives black-on-white.
So I "solved" my problem by converting the AlertDialog into a Fragment.
The original question, though, is still unanswered.
Alert Dialog and Popup Menu generaly take the color of #ColorAccent as the background. So try changing the colorAccent or just inflate a custom xml with the specifications you want.
Just change the parent of it from Theme.Material.Light to Theme.Material .
It will make the text white, there.
I fixed it by setting a background color with opacity in the style of the alertdialog
In styles.xml
<style name="AppCompatAlertDialogStyle">
...
<item name="android:background">#color/black_overlay</item>
...
</style>
In colors.xml
<color name="black_overlay">#66000000</color>
If you use MaterialAlertDialogBuilder then you can define background color through colorSurface attribute.
Then in styles you can just set background to transparent.
android:background="#android:color/transparent"
Dialog will use the one define in colorSurface and "copy/paste" will use default system colors (e.g. white).
I have created custom style for checkbox
<style name="CheckBoxtpi" parent="android:Widget.CompoundButton.CheckBox">
<item name="android:button">#drawable/tpi_btn_check_holo_light</item>
</style>
And apply it to my Theme, it works pretty, but all checkboxes in alert dialogs still standart Holo Blue color.
How can i change this?
There are two alternatives you can do;
Change your context from getApplicationContext() or any other to explicitly MyActivity.this, (whatever your activity name is) when you build your dialog.
This will probably solve the problem.
You may create a custom layout for the dialog box and call it
dialog.setContentView(R.layout.custom_dialog);
I need to run a custom dialog layout using only theme/style options. Running custom Dialog layout by code is not an option for me. I think this should be possible by mean of attributes "android:layout", "android:dialogLayout", "*android:dialogCustomTitleDecorLayout", "*android:dialogTitleIconsDecorLayout", "*android:dialogTitleDecorLayout".<br/><br/>
My Activity onCreate load layout in a Dialog Style:
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setTheme(R.style.MyDialog);
setContentView(R.layout.mydialog);
this.setTitle("A title");
}
style xml:
<style name="MyDialog" parent="android:Theme.Holo.Light.Dialog">
<item name="android:windowTitleStyle">#style/MyDialog.WindowTitle</item>
<item name="android:layout">#layout/dialog_title</item>
<item name="android:dialogLayout">#layout/dialog_title</item>
<item name="*android:dialogCustomTitleDecorLayout">#layout/dialog_title</item>
<item name="*android:dialogTitleIconsDecorLayout">#layout/dialog_title</item>
<item name="*android:dialogTitleDecorLayout">#layout/dialog_title</item>
</style>
<style name="MyDialog.WindowTitle">
<item name="android:maxLines">1</item>
<item name="android:scrollHorizontally">true</item>
<item name="android:textAppearance">#style/TextAppearance_WindowTitle</item>
</style>
<style name="TextAppearance_WindowTitle">
<item name="android:textSize">32sp</item>
<item name="android:textColor">#+color/verdeTI</item>
</style>
Please, note that Text colour of the title is correctly applied (#+color/verdeTI) so I am confident the cascading styling is right but it seems none of the layout options work at all because I continue to see the standard Dialog Layout. My "dialog_title" use a completely different ImageView for divider so I can be sure when it is loaded.
The custom divider is just the main reason because I need a different layout.
Update 15/4/2014
Android theme Guide stats:
Some style properties, however, are not supported by any View element and can only be applied as a theme. These style properties apply to the entire window and not to any type of View. For example, style properties for a theme can hide the application title, hide the status bar, or change the window's background. These kind of style properties do not belong to any View object. To discover these theme-only style properties, look at the R.attr reference for attributes that begin with window. For instance, windowNoTitle and windowBackground are style properties that are effective only when the style is applied as a theme to an Activity or application. See the next section for information about applying a style as a theme.
OK attributes starting with "window" are applied only in Themes not in Styles. What's about *Layout attributes ? When they are applied ?
You can try by passing ThemeName as argument of constructor like this way.
public class TestDialog extends Dialog{
public TestDialog(Context context) {
super(context, R.style.YourTheme);
// TODO Auto-generated constructor stub
}
}
Add window feature if you require.
Make object of this class in any Activity so you can use Dialog property.
:-
More info https://stackoverflow.com/a/18224754/942224
i was using this way. so it may be help you.
You can try by creating your required layout file and opening it with an activity class just in the manifest add this code to your activity
android:theme="#android:style/Theme. Dialog"
But you will be getting title bar in your dialog with this which is your label name for your activity. To remove it add this code before setContentView
requestWindowFeature(Window. FEATURE_NO_TITLE);
I am attempting to style a DialogFragment and, despite extensive research within SO, developer.android and elsewhere, it's just not working right.
I am sure that I have applied everything correctly; in my DialogFragment onCreateDialog, I am putting:
AlertDialog.Builder builder = new AlertDialog.Builder(new ContextThemeWrapper(getActivity(), R.style.FibroDialog));
and in values/styles.xml, I have:
<style name="FibroDialog" parent="#android:style/Theme.Dialog">
<item name="android:windowBackground">#drawable/panel_background</item>
</style>
and in values-v14/styles.xml, I have:
<style name="FibroDialog" parent="#android:style/Theme.Holo.Dialog">
<item name="android:windowBackground">#drawable/panel_background</item>
</style>
If I run that, I get the top row of dialogs in the image below, where nothing has changed at all, but I would expect the window to use my panel_background drawable. If I change windowBackground to background, I get the bottom row of dialogs in the image below, where it all goes wrong.
So how do I change this, so the entire dialogs have the purple background? I know I can use the layoutInflator and put a background colour in the layout, but that only does the middle bit.
I don't know if this is of any relevance, but the DialogFragment is launched from a SherlockFragment