I'm having the same issue as this thread: Android Material Design Inline Datepicker issue, but I am not using an XML layout, instead I'm building the DatePicker programmatically.
This is the code I am using but is not working
DatePicker dpView = new DatePicker(ctx);
dpView.setCalendarViewShown(false);
dpView.setSpinnersShown(true);
how can I make it work?
If you have to set it up programmatically in a DatePickerFragment just set this:
DatePickerDialog dialog = new DatePickerDialog(getActivity(),android.R.style.Theme_Holo_Dialog_MinWidth, this, year, month, day);
with whatever style you like.
The problem in Android 5.0 is the "mode" which determines whether to use a calendar or not is read at construct time, and in code you can't set the mode until after it has been constructed, thus it's too late. (Source is here: DatePicker Source Code)
My solution was to create my own reusable DatePicker layout that specifies the "no calendar" mode, and construct my DateTimes programmatically with that layout instead of Android's default.
Bottom line is, create a "DatePicker.axml" file, put it in the resources folder, and paste the following as its contents:
<?xml version="1.0" encoding="utf-8"?>
<DatePicker xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:calendarViewShown="false"
android:datePickerMode="spinner"/>
and declare it wherever you need in code like this:
LayoutInflater inflater = LayoutInflater.From( Activity );
DatePicker datePicker = (DatePicker)inflater.Inflate( Resource.Layout.DatePicker, null );
Adding to the answer from user Luismi:
The theme Theme.Holo.Dialog or Theme.Holo.Dialog.MinWidth might cause problems like two boxes drawn around the date picker.
Instead you should the theme Theme.Holo.Dialog.NoFrame to prevent this. The theme might not be accessable from your code, so just create your own theme:
<style name="DatePickerDialogTheme" parent="android:Theme.Holo.Light.Dialog">
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowFrame">#null</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowAnimationStyle">#null</item>
<item name="android:backgroundDimEnabled">false</item>
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowCloseOnTouchOutside">false</item>
</style>
Edit: The better way to fix this problem is to use the SpinnerDatePicker library that recreates the old design.
I simply changed my AppTheme(v21) style and worked:
<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="colorControlActivated">#color/colorPrimary</item>
<item name="android:timePickerDialogTheme">#style/PickerDialogCustom</item>
<item name="android:datePickerDialogTheme">#style/PickerDialogCustom</item>
<item name="alertDialogTheme">#style/AlertDialogCustom</item>
</style>
<style name="PickerDialogCustom" parent="AlertDialogCustom">
<item name="android:textColor">#color/colorPrimary</item>
<item name="android:textColorPrimary">#color/colorPrimaryDark</item>
<item name="colorControlNormal">#color/greyLight500</item>
<item name="android:layout_margin">2dp</item>
<item name="android:datePickerMode">spinner</item>
</style>
<style name="AlertDialogCustom" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorAccent">#color/colorPrimary</item>
<item name="android:positiveButtonText">#color/colorPrimary</item>
<item name="android:negativeButtonText">#color/greyDark200</item>
<item name="buttonBarNegativeButtonStyle">#style/negativeButton</item>
<item name="android:datePickerStyle">#style/PickerDialogCustom</item>
</style>
Related
I'm currently working on creating a custom theme for a datePicker and I'm having some difficulty with setting the headerBackground and the circle around the selected date separately. I've set my theme up like this:
<style name="State0DatePickerTheme" parent="AppTheme">
<item name="colorAccent">#color/state0Dark</item>
<item name="android:headerBackground">#color/state0Primary</item>
</style>
App theme looks like this:
<style name="AppTheme" parent="State0BaseTheme">
<item name="colorPrimary">#color/state0Primary</item>
<item name="colorPrimaryDark">#color/state0Dark</item>
<item name="android:statusBarColor">#color/state0Primary</item>
<item name="android:colorControlNormal">#color/colorAccent</item>
<item name="android:background">#color/state0Primary</item>
<item name="android:textColorPrimary">#color/colorAccent</item>
</style>
And last but not least, State0BaseTheme looks like this:
<style name="State0BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/state0Primary</item>
<item name="colorPrimaryDark">#color/state0Dark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:statusBarColor">#color/state0Primary</item>
<item name="android:colorControlNormal">#color/colorAccent</item>
<item name="android:background">#color/state0Primary</item>
<item name="android:textColorPrimary">#color/colorAccent</item>
</style>
I had thought that overriding colorAccent, and setting headerBackground would work just fine, but I guess not? Here's what it looks like with all these styles:
If I set android:headerBackground in the xml of the datePicker, everything works great. However, I want to be able to change the theme for all screens of the app based on user input. Thoughts as to why this isn't working?
I read the link posted by #DasserBasyouni and found that making the parent of my datePickerTheme #android:style/Widget.Material.Light.DatePicker and setting android:datePickerStyle to #style/State0DatePickerTheme in State0BaseTheme worked perfectly
As you can see from the image below, I'm using the time picker in my app.
I need to change the color but don't know how...
Thanks for the help.
This can be easily achieved from xml (5.0+ only)
v21/themes.xml
<style name="Theme"
parent="MyTheme.Base">
<item name="android:dialogTheme">#style/Theme.Dialog</item> <!-- TimePicker dialog -->
<item name="android:alertDialogTheme">#style/Theme.Dialog</item> <!-- Alert dialog -->
</style>
<style name="Theme.Dialog"
parent="android:Theme.Material.Light.Dialog">
<item name="android:colorAccent">#color/...</item>
<item name="android:colorPrimary">#color/...</item>
<item name="android:colorPrimaryDark">#color/...</item>
</style>
Edit
Please note that as of Android Support Library 22.1.0 there is a new AppCompatDialog available! http://android-developers.blogspot.de/2015/04/android-support-library-221.html
Try this code
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="TimePicker" parent="Theme.AppCompat.Light.Dialog">
<item name="android:windowIsFloating">true</item>
<item name="colorAccent">#color/primary</item>
<item name="colorControlActivated">#color/secondary</item>
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorPrimaryDark">#color/primary</item>
<item name="android:buttonBarNegativeButtonStyle">#style/DatePickerTheme.ButtonBarButtonStyle</item>
<item name="android:buttonBarPositiveButtonStyle">#style/DatePickerTheme.ButtonBarButtonStyle</item>
</style>
<style name="DatePickerTheme.ButtonBarButtonStyle" parent="Widget.MaterialComponents.Button.TextButton.Dialog">
<item name="android:textColor">#color/primary</item>
</style>
</resources>
The first one is colorAccent, the second is colorControlActivated and the last one does not belong to the timepicker, it belongs to dialog so you should apply the an style similar to this post
So in the app I am making, I have both a dark and light theme. The light theme works fine, but the alert dialogs I have still show the background the same as the light theme. Since it is dark, the text changes to light and the user can't see anything. Is there a certain attribute I need to change?
Here is the styles.xml:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#E53935</item>
<item name="colorPrimaryDark">#C62828</item>
<item name="android:navigationBarColor">#E53935</item>
<item name="android:colorAccent">#1565C0</item>
<item name="android:colorForeground">#color/foreground_material_light</item>
<item name="android:colorBackground">#color/background_material_light</item>
<!-- Other attributes -->
</style>
<style name="Dark" parent="#style/AppTheme" >
<item name="android:colorForeground">#color/foreground_material_dark</item>
<item name="android:colorPrimary">#color/primary_material_dark</item>
<item name="android:colorPrimaryDark">#color/primary_dark_material_dark</item>
<item name="android:colorAccent">#color/accent_material_dark</item>
<item name="android:navigationBarColor">#color/primary_material_dark</item>
<item name="android:colorBackground">#color/background_material_dark</item>
<item name="android:textColorPrimary">#android:color/primary_text_dark</item>
<item name="android:textColorPrimaryInverse">#android:color/primary_text_light</item>
<item name="android:textColorSecondary">#android:color/secondary_text_dark</item>
<item name="android:textColorSecondaryInverse">#android:color/secondary_text_light</item>
<item name="android:textColorTertiary">#android:color/tertiary_text_dark</item>
</style>
Here is what it shows up as:
Solved: You need to create your own xml like this:
<item name="alertDialogTheme">#style/DarkAlertDialog</item>
With this being your custom dialog:
<style name="DarkAlertDialog" parent="Theme.AppCompat.Dialog">
<item name="background">#color/background_material_dark</item>
</style>
Use the parent AppCompat and then use colorPrimary and colorAccent properties (without an Android prefix) to theme things.
Right now the styles are coming from a dialog subtheme and not being affected by these style definitions.
In my app in setings I use EditTextPreference , and on android API uder 11 edittext field has black background and black text color.
How can I chenge EditTextPreferences background color ?
I tried:
in theme :
<item name="android:editTextPreferenceStyle">#style/EditTextAppTheme</item>
in style:
<style name="EditTextAppTheme" parent="android:Widget.EditText">
<item name="android:background">#drawable/edit_text_holo_light</item>
<item name="android:textColor">#000000</item>
</style>
If I set style to :
<style name="EditTextPreferences" parent="android:Preference.DeviceDefault.DialogPreference.EditTextPreference">
<item name="android:background">#drawable/edit_text_holo_light</item>
<item name="android:textColor">#FF0000</item>
</style>
And theme to :
<item name="android:editTextPreferenceStyle">#style/EditTextPreferences</item>
I got error:
error: Error retrieving parent for item: No resource found that matches the given name 'android:Preference.DeviceDefault.DialogPreference.EditTextPreference'.
I have been trying to figure this out as well for the past couple of days. I've found that all the EditTextPrefence extends is AlertDialog and EditText. So if you can style both of those in your theme, you will find the result you are looking for in a EditTextPreference. Here's what I'm working with:
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="LightTheme" parent="android:Theme.Light">
<item name="android:windowNoTitle">true</item>
<item name="android:background">#color/greyscale2</item>
<item name="android:textColor">#color/greyscale16</item>
<item name="android:textViewStyle">#style/LightTextView</item>
<item name="android:buttonStyle">#style/LightButton</item>
<item name="android:editTextStyle">#style/LightEditText</item>
<item name="android:alertDialogTheme">#style/LightDialog</item>
<item name="android:dialogPreferenceStyle">#style/LightDialog</item>
<item name="android:colorBackground">#color/greyscale2</item>
<item name="android:colorBackgroundCacheHint">#color/greyscale1</item>
</style>
<!-- TextView -->
<style name="LightTextView" parent="android:Widget.TextView">
<item name="android:textColor">#color/greyscale16</item>
<item name="android:background">#android:color/transparent</item>
</style>
<!-- Button -->
<style name="LightButton" parent="android:Widget.Button">
<item name="android:textColor">#color/greyscale16</item>
<item name="android:background">#drawable/light_button_background</item>
<item name="android:gravity">center_vertical|center_horizontal</item>
</style>
<style name="LightCheckBox" parent="android:Widget.CompoundButton.CheckBox">
<item name="android:background">#color/greyscale2</item>
</style>
<style name="LightEditText" parent="android:style/Widget.EditText">
<item name="android:background">#color/greyscale1</item>
<item name="android:editTextBackground">#color/greyscale2</item>
<item name="android:textColor">#color/greyscale16</item>
<item name="android:button">#style/DarkButton</item>
<item name="android:inputType">number</item>
</style>
<style name="LightDialog" parent="#android:style/Theme.Dialog">
<item name="android:background">#color/greyscale2</item>
<item name="android:textColor">#color/greyscale16</item>
<item name="android:textViewStyle">#style/LightTextView</item>
<item name="android:buttonStyle">#style/LightButton</item>
<item name="android:divider">#color/greyscale14</item>
</style>
Notice the
<item name="android:dialogPreferenceStyle">#style/LightDialog</item> attribute in my base theme. I found the styleable resource here, more specifically alertDiaolg here (Note: These can also be found in your SDK directory on your computer)
I hope this at least heads you in the right direction, I have been struggling to figure this out (my first theme in my apps). Happy Coding!
I think the effect you've observed is a bug in the Gingerbread emulator.
After changing the activity's theme and restarting the emulator the EditTextPreference appeared as above.
First extend EditTextPreference and override onPrepareDialogBuilder, inverting background color for versions below Honeycomb:
public class CustomEditTextPreference extends EditTextPreference {
/**
* Prepares the dialog builder to be shown when the preference is clicked.
* Use this to set custom properties on the dialog.
* <p>
* Do not {#link AlertDialog.Builder#create()} or
* {#link AlertDialog.Builder#show()}.
*/
#Override
protected void onPrepareDialogBuilder(AlertDialog.Builder builder) {
builder.setInverseBackgroundForced(Build.VERSION.SDK_INT < Build.VERSION_CODES.HONEYCOMB);
}
}
Then replace in your preferences.xml all
<EditTextPreference ... />
with
<your.package.CustomEditTextPreference ... />
I had this exact issue when I switched to the API v21 AppCompat (I think - it previously used to work just fine at least).
My solution was to define the style for android:editTextStyle explicitly in my theme - here is my complete styles.xml:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
<item name="android:editTextStyle">#android:style/Widget.EditText</item>
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
</resources>
The result is an editText that looks the same as in #Jesse Webb's screenshot.
How can i apply a custom ActiobbarSherlock to my activities. I am looking for something like this this. I know the four square application uses the SherlockActionBar how can i do this?
This is my current style ...
<style name="Widget.Styled.ActionBar" parent="Widget.Sherlock.ActionBar">
<item name="android:background">#449def</item>
<item name="background">#0099CC</item>
<item name="android:titleTextStyle">#style/Theme.ActionBar.TitleTextStyle</item>
<item name="icon">#drawable/ic_launcher</item>
<item name="backgroundSplit">#drawable/gray_seprator</item>
<item name="android:displayOptions">showTitle|homeAsUp</item>
<item name="displayOptions">showTitle|homeAsUp</item>
</style>
Kind Regards