I have a date picker dialog that I use in spinner mode. This is the theme used by the date picker dialog.
<style name="CustomDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.DatePicker">
<item name="android:datePickerMode">spinner</item>
This works fine when I use it when "Dark Mode = off". But it does not reverse the colors when "Dark Mode = on". Irrespective of the Dark Mode this is how the dialog looks like
I tried changing the parent theme to Theme.AppCompat.DayNight.Dialog. Now the dialog looks like this when "Dark Mode = on"
How do I make the DatePickeDialog (in spinner mode) compatible with Dark Mode?
Please try without specifying the parent theme, this works for me. but your dialog will be full screen for this in your theme add android: windowIsFloating = true. this to center the dialog on the screen and it becomes like a normal Dialog
this is my theme :
<style name="CustomDatePickerDialogTheme">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
<item name="android:windowIsFloating">true</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.DatePicker" tools:targetApi="lollipop">
<item name="android:datePickerMode">spinner</item>
</style>
just need to change the theme color setting as per your requirement do the below changes and do comment if not work. do your code in your parent theme this is general style
<style name="MyMaterialTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorAccent">#FC6C2D</item> ---> I used orange color here to display the picker dialog in orange color.
<item name="android:textColorPrimary">#000000</item>
<item name="android:textColorSecondary">#000000</item>
</style>
Related
I'm trying to fix a bug in our React Native application where in dark mode, the native android Alert dialog is displaying a very dark gray background with black text on the buttons, making it unreadable:
unreadable android Alert dialog in dark mode
The solution looks like applying a custom style to the Alert is the right way to go. I have my main styles in android/app/src/main/res/values/styles.xml:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:textColor">#000000</item>
</style>
<style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:statusBarColor">#color/splashscreen_bg</item>
<item name="android:background">#drawable/background_splash</item>
</style>
</resources>
which produces the following result in light mode (unmodified):
normal Android alert dialog
To fix the dark mode issue, I've added another file in android/app/src/main/res/values-night/styles.xml with the following contents:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:textColor">#000000</item>
<item name="android:alertDialogTheme">#style/AlertTheme</item>
</style>
<style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:statusBarColor">#color/splashscreen_bg</item>
<item name="android:background">#drawable/background_splash</item>
</style>
<style name="AlertTheme" parent="Theme.AppCompat.Dialog.Alert">
<item name="android:textColor">#FFFFFF</item>
<item name="android:background">#000000</item>
<item name="android:colorAccent">#000000</item>
</style>
</resources>
Which seems to fix the color issue, producing the following result in dark mode:
custom dark mode Android alert dialog
But now it looks like the padding or gravity on the buttons is messed up, like the space is below the buttons instead of above (like in the light mode screenshot).
Any ideas? Is there a better way to do this that I'm not aware of?
wallpicker app
I was actually trying to make an overlay theme that override my settings and other apps, I've somehow successfully make it transparent and change the font color but one thing i couldn't change is the header of it, in the image you'll see a "Settings" which isn't white color, that's my current problem, it also happened on other header apps just like "wallpaper picker app" and more apps
Already tried:
<item name="android:colorBackground">#android:color/primary_dark_device_default_settings</item>
<item name="android:windowBackground">#40000000</item>
<item name="android:windowShowWallpaper">true</item>
<item name="android:textColor">#ffffff</item>
adding a textColor but it didn't change the header text color or was it called an action bar?
also textColorPrimary doesn't do anything at all? and im on api 33
https://i.stack.imgur.com/3jsNN.jpg
https://i.stack.imgur.com/0Jsly.png
Try this.. In your original theme
<style name="Theme.MyApplication" parent="Theme.MaterialComponent.DayNight.NoActionBar">
<item name="toolbarStyle">#style/CustomToolbar</item>
</style>
your theme settings as follow:
<style name="CustomToolbar" parent="#style/Widget.MaterialComponents.Toolbar">
<item name="android:textColorPrimary">#android:color/white</item>
<item name="android:textColorSecondary">#android:color/white</item>
</style>
I've changed the default theme of the MaterialDatePicker that link below, but I cannot change color in keyboard mode of the date selection & also it is possible to hide that mode?
How to change Theme of "MaterialDatePicker" in Android?
About the TextInputLayout in MaterialDatePicker.INPUT_MODE_TEXT.
It is a standard TextInputLayout which inherits from the textInputStyle attribute defined in your app theme. In the default Material Components theme it is defined by Widget.MaterialComponents.TextInputLayout.FilledBox and it is based on:
background color(boxBackgroundColor attribute): colorOnSurface
underline color (boxStrokeColor attribute) colorPrimary(focused) and colorOnSurface (other states)
Starting from 1.3.0-alpha03 you can use a theme:
setTheme(R.style.ThemeOverlay_App_MaterialCalendar)
with:
<style name="ThemeOverlay.App.MaterialCalendar" parent="#style/ThemeOverlay.MaterialComponents.MaterialCalendar">
<item name="textInputStyle">#style/Widget.App.TextInputLayout</item>
</style>
<style name="Widget.App.TextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
<item name="boxBackgroundColor">#color/....</item>
</style>
Before the 1.3.0-alpha03 you can only change the default style of all TextInputLayouts in your app using the textInputStyle in your app theme.
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
....
<item name="textInputStyle">#style/My_FilledBox</item>
</style>
<style name="My_FilledBox" parent="#style/Widget.MaterialComponents.TextInputLayout.FilledBox">
...
</style>
There isn'a method to hide the toggle in the header, but there is a workaround (it can stop to work in the future releases):
builder.setTheme(R.style.MyMaterialCalendarTheme);
with:
<style name="MyMaterialCalendarTheme" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
<!-- HeaderToggleButton -->
<item name="materialCalendarHeaderToggleButton">#style/HeaderToggleButton1</item>
</style>
<style name="HeaderToggleButton1" parent="#style/Widget.MaterialComponents.MaterialCalendar.HeaderToggleButton">
<item name="android:visibility">gone</item>
</style>
I am trying to change the different colors auf my datepicker dialog in android. I am using AppCompat. I could already change the background color of the header and the color that marks the currently selected year. I tried a lot to change the color of the 'cancel' and 'ok' button as well as the the color of the bubble that marks the currently selected day.
At the moment it looks like this:
Current date picker style
I have styled my datepicker this way:
<style name="AppTheme" parent="Theme.AppCompat">
<item name="android:datePickerDialogTheme">#style/MyDatePickerDialogTheme</item></style><style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Dialog">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
</style>
<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Dialog">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.DatePicker">
<item name="android:headerBackground">#color/green</item>
<item name="android:yearListSelectorColor">#color/green_transparent</item>
</style>
Does anyone have a solution or workaround for my problem?
I have already tried to change the text color and different button attributes but nothing could change the buttons.
By default, it uses the colorAccent property. So, include it in your theme as below.
<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Dialog">
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
<item name="colorAccent">button_color</item>
</style>
I am customizing my android app by defining theme in styles.xml. I would like to apply a basic text color to all text of my app, but I want to keep the appearance of AlertDialog as default (Holo.Light).
styles.xml
<resources>
<style name="AppTheme" parent="android:Theme.Holo.Light.NoActionBar">
<item name="android:windowNoTitle">true</item>
<item name="android:textColor">#android:color/holo_red_dark</item>
<item name="android:alertDialogTheme">#style/AlertDialogStyle</item>
</style>
<style name="AlertDialogStyle" parent="#android:style/Theme.Holo.Light.Dialog">
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowTitleStyle">#style/DialogWindowTitle</item>
</style>
<style name="DialogWindowTitle">
<item name="android:maxLines">1</item>
<item name="android:scrollHorizontally">true</item>
<item name="android:textAppearance">#style/DialogWindowTitleAppearance</item>
</style>
<style name="DialogWindowTitleAppearance" parent="#android:style/TextAppearance.Holo.DialogWindowTitle">
<item name="android:textColor">#android:color/holo_purple</item>
</style>
</resources>
However, the color defined in AppTheme overrides the purple color:
If I remove the line <item name="android:textColor">#android:color/holo_red_dark</item> in AppTheme, the text color of the title changes correctly.
So my question is: How can I define a text color for my app theme, while setting another color (or preserving system default color) to the dialog title text?
define
<item name="android:textAppearanceLarge">...</item>
in your AlertDialogStyle
in Your AndroidManifest.xml set another style to your Activity
<activity
android:name="com.my.sample.Activity"
android:theme="#android:style/Theme.Holo.Light.Dialog"
android:configChanges="keyboardHidden|orientation|screenSize"
android:label="#string/my_activity_name">
</activity>
Great work with drilling down to the specific text you want to change. The fact it isn't working looks like a bug to me. If you want a built-in alert dialog window instead of a custom themed one, you can use this function when you build an alert box:
AlertDialog.Builder(Context context, int theme)
"theme" can be AlertDialog.ThemeTraditional or some other AlertDialog theme constant. I imagine you've moved on by now, maybe making your own alert dialog activity to replace it, but the above was an adequate workaround for me (I had white text on light grey background, so I had to do something).