In the image above (don't worry about the calendar positioning), the whole calendar is the correct theme color except the green of the chosen date. I've tried many things but not been able to change this last part of the theme! I'm using Theme.AppCompat.Light.DarkActionBar and have gotten to the current point by changing the DatePickerDialogTheme's colorAccent. I've also tried changing
dayOfWeekBackground
dayOfWeekTextAppearance
headerMonthTextAppearance
headerDayOfMonthTextAppearance
headerYearTextAppearance
headerSelectedTextColor
yearListItemTextAppearance
yearListSelectorColor
calendarTextColor
calendarSelectedTextColor
And those don't seem to have done it. Here's my XML, thank you in advance!
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorRed</item>
<item name="colorPrimaryDark">#color/colorRed</item>
<item name="colorAccent">#color/colorRed</item>
<item name="android:datePickerDialogTheme">#style/MyDatePickerDialogTheme</item>
</style>
<style name="MyDatePickerDialogTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:colorAccent">#color/colorRed</item>
</style>
To change the colour of the circle of the selected date, use
<item name="android:colorControlActivated">#color/your_colour</item>
use this theme
<style name="MyDatePickerDialogTheme" parent="Theme.AppCompat.Light.Dialog">
<item name="android:colorAccent">#color/colorRed</item>
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
<item name="android:colorAccent">#color/primaryDark</item>
</style>
and
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.Light.DatePicker">
<item name="android:headerBackground">#color/primary</item>
<item name="android:calendarTextColor">#color/primaryDark</item>
<item name="android:dayOfWeekBackground">#color/primaryDark</item>
<item name="android:yearListSelectorColor">#color/accent</item>
<item name="android:datePickerMode">calendar</item>
</style>
For the selected day's colour you do have to use colorAccent, here's what works me:
<style name="PopupDialogTheme" parent="Theme.AppCompat.Light.Dialog.Alert">
<!--selected day's color: define your own-->
<item name="colorAccent">#color/yourColour</item>
</style>
and in your class instantiate like this:
final AlertDialog.Builder datePickerBuilder = new AlertDialog.Builder(ProviderMainActivity.this, R.style.PopupDialogTheme);
// ... do something with your dialog, i.e. .show()
Regarding the other attributes that were mentioned in the question: look up their reference and find out what params they take (in the xml).
For example for setting the year/month/day's colour in the header, you have to define a text appearance (CodeFont) like this:
<DatePicker xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/dpPickDate"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:headerBackground="#drawable/calendar_header"
android:headerYearTextAppearance="#style/YourCodeFont"
android:headerMonthTextAppearance="#style/YourCodeFont"
android:headerDayOfMonthTextAppearance="#style/YourCodeFont"/>
note YourCodeFont, which you need to define in your styles.xml:
<style name="PopupCodeFont" parent="#android:style/TextAppearance.Medium">
<item name="android:textColor">#color/black</item>
</style>
You can't, for example do this:
android:headerYearTextAppearance="#color/black"
Also note that some of these attributes, in example headerYearTextAppearance require API 21+, so better handle and test for previous versions.
Related
I am using the material components theming for our app. Now we want a custom font, which I managed to apply almost everywhere with the theme below, which uses the various textAppearance... attributes defined by material components.
This works very well, and the theme is also applied to the AlertDialogs almost everywhere -- message text and buttons have the custom font, buttons have the correct accent colors etc.
Only the dialog title keeps the Roboto font, no matter what.
<!-- externalized font name for easier change -->
<string name="font_regular" translatable="false" tools:ignore="ReferenceType">#font/atma_regular</string>
<style name="Theme.App" parent="Theme.MaterialComponents.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:textColorPrimary">#color/textColorPrimary</item>
<item name="android:textColorSecondary">#color/textColorSecondary</item>
<item name="textAppearanceHeadline1">#style/TextAppearance.App.Button</item>
<item name="textAppearanceHeadline2">#style/TextAppearance.App.Button</item>
<item name="textAppearanceHeadline3">#style/TextAppearance.App.Button</item>
<item name="textAppearanceHeadline4">#style/TextAppearance.App.Button</item>
<item name="textAppearanceHeadline5">#style/TextAppearance.App.Button</item>
<item name="textAppearanceHeadline6">#style/TextAppearance.App.Button</item>
<item name="textAppearanceSubtitle1">#style/TextAppearance.App.Subtitle1</item>
<item name="textAppearanceSubtitle2">#style/TextAppearance.App.Subtitle2</item>
<item name="textAppearanceBody1">#style/TextAppearance.App.Body1</item>
<item name="textAppearanceBody2">#style/TextAppearance.App.Body2</item>
<item name="textAppearanceButton">#style/TextAppearance.App.Button</item>
<item name="android:textAppearanceLarge">#style/TextAppearance.App.Large</item>
<item name="android:textAppearanceMedium">#style/TextAppearance.App.Medium</item>
<item name="android:textAppearanceSmall">#style/TextAppearance.App.Small</item>
</style>
<style name="TextAppearance.App.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
<item name="fontFamily">#string/font_regular</item>
<item name="android:fontFamily">#string/font_regular</item>
</style>
...
I tried to define an extra theme for the alert dialogs like so:
<style name="Theme.App" parent="Theme.MaterialComponents.Light.NoActionBar">
...
<item name="alertDialogTheme">#style/Theme.App.AlertDialog</item>
...
</style>
<style name="Theme.App.AlertDialog" parent="Theme.MaterialComponents.Light.Dialog.Alert">
<item name="android:windowTitleStyle">#style/TextAppearance.App.DialogWindowTitle</item>
</style>
<style name="TextAppearance.App.DialogWindowTitle" parent="ThemeOverlay.MaterialComponents.Dialog.Alert">
<item name="fontFamily">#string/font_regular</item>
<item name="android:fontFamily">#string/font_regular</item>
<item name="android:textSize">30sp</item>
</style>
But that resets the colors and fonts everywhere. The only thing that is applied, is the textSize.
It really shouldn't be so hard to achieve this, but I am out of ideas right now. I could apply the font programmatically, but that would be quite ugly.
As you mentioned the AlertDialog created by MaterialAlertDialogBuilder uses the style defined by the textAppearanceSubtitle1 attribute in your app theme.
Otherwise you can change the style used by the AlertDialog using something like:
new MaterialAlertDialogBuilder(MainActivity.this,
R.style.MyTitle_ThemeOverlay_MaterialComponents_MaterialAlertDialog)
.setTitle("Title")
.setMessage("Message......")
.setPositiveButton("ok", null)
.setNegativeButton("Cancel", null)
.show();
In your style you have to customize the materialAlertDialogTitleTextStyle attribute:
<style name="MyTitle_ThemeOverlay.MaterialComponents.MaterialAlertDialog" parent="#style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
<item name="materialAlertDialogTitleTextStyle">#style/MyTitle_MaterialAlertDialog.MaterialComponents.Title.Text</item>
</style>
<style name="MyTitle_MaterialAlertDialog.MaterialComponents.Title.Text" parent="#style/MaterialAlertDialog.MaterialComponents.Title.Text">
<item name="android:textAppearance">#style/MyTitle_TextAppearance.MaterialComponents.Subtitle1</item>
</style>
<style name="MyTitle_TextAppearance.MaterialComponents.Subtitle1" parent="TextAppearance.MaterialComponents.Subtitle1">
<item name="fontFamily">....</item>
<item name="android:fontFamily">....</item>
<item name="android:textStyle">.....</item>
</style>
Thanks to your question I realized that I was using the incorrect attribute to assign the title style (android:titleTextAppearance instead of android:windowTitleStyle).
It looks like your issue has been fixed in the meantime, as your exact code seems to work for me as of today.
Can we modify/custom ourBiometricPrompt?
For example right now i use smth like this:
BiometricPrompt.Builder(AppResources.appContext)
.setTitle("title")
.setSubtitle("subTitle")
.setDescription("description")
.setNegativeButton("Cancel", AppResources.appContext?.mainExecutor,
DialogInterface.OnClickListener { dialogInterface, i -> biometricCallback.onAuthenticationCancelled() })
.build()
.authenticate(CancellationSignal(), AppResources.appContext?.mainExecutor,
BiometricCallbackV28(biometricCallback))
Do I have the ability to change the style of the text, title, negativeButton color?
Update2: beta01
The change with the alpha version was that the fingerprint dialog uses android.app.AlertDialog and the new beta01 uses androidx.appcompat.app.AlertDialog which has a private style.
Then to override that style we have to override androidx.appcompat.R.attr.alertDialogTheme reference in our styles.xml, we can do it replacing <item name="android:alertDialogTheme">#style/CustomAlertTheme</item> by <item name="alertDialogTheme">#style/CustomAlertTheme</item> in my case thay I only wanted to change the button text color, I just added <item name="buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item> and the same for posivtive, because replacing alertDialogTheme changes other things that I did not want to.
My styles.xml now:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:textColor">#color/black</item>
<item name="android:buttonStyle">#style/WibleButtonStyle</item>
<item name="buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item>
</style>
<style name="NegativeButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:textSize">16sp</item>
<item name="android:textColor">#color/dark_blue</item>
</style>
Update: beta01
This trick is not working anymore. I'll try if I can find another way to do it.
I found two ways to do it, none of these are specific for the BiometricPrompt, one is to override the theme button style:
<item name="android:buttonStyle">#style/CustomButtonStyle</item>
another option is to override your alert dialog theme:
AppTheme style
<item name="android:alertDialogTheme">#style/AlertDialogTheme</item>
<style name="AlertDialogTheme" parent="ThemeOverlay.AppCompat.Dialog.Alert">
<item name="android:buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item>
<item name="android:buttonBarPositiveButtonStyle">#style/PositiveButtonStyle</item>
</style>
<style name="NegativeButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:textSize">10sp</item>
<item name="android:textColor">#color/primary_text</item>
</style>
<style name="PositiveButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:textColor">#color/primary_text</item>
</style>
And then you can apply a specific theme to a specific activity. Maybe they could open the API to allow styles, but I had to change the color because it was impossible to see the buttons (everything was white) and this is what I found to solve my problem. I hope it helps you.
You can't set properties on the prompt that aren't exposed through its Builder - the UI is provided by the system, and is designed to be uniform throughout all apps.
This is sort of the main point of this API, this way the user becomes familiar with the prompt and knows that whatever they're interacting with is safe to use.
Can we modify/custom our BiometricPrompt?
The BiometricPrompt uses the "buttonStyle" style that is set for your theme, which you can adjust in the styles.xml
Keep in mind that this is the default button style, so if you do not want other buttons to change you would have to assign buttons etc. their own style. (and dialogs etc.)
For example, if you only want the text color to be different for the BiometricPrompt, you could do something like this:
<style name="myTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<item name="buttonStyle">#style/ButtonPrimaryStyle</item>
</style>
<style name="ButtonPrimaryStyle" parent="ButtonParentStyle">
<item name="android:textColor">454545</item>
</style>
<style name="ButtonPrimaryStyleMain" parent="ButtonPrimaryStyle">
<item name="android:textColor">e2e2e2</item>
</style>
This would make the BiometricPrompt have a dark grey text for the cancel button, while every button with the "ButtonPrimaryStyleMain" style will have a lightgrey, almost white, text color.
You would also have to assign this theme to your application in the manifest.
<application
android:theme="#style/myTheme"
I want to change the background of alert dialog title in theme.
I do following changes in theme:
<style name="NgTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:dialogTheme">#style/NgDialogTheme</item>
<item name="android:alertDialogTheme">#style/NgAlertDialogTheme</item>
</style>
<style name="NgDialogTheme" parent="#android:style/Theme.Holo.Light.Dialog">
<item name="android:background">#android:color/transparent</item>
<item name="android:windowTitleStyle">#style/NgWindowTitleStyle</item>
</style>
<style name="NgAlertDialogTheme" parent="#style/NgDialogTheme">
</style>
<style name="NgWindowTitleStyle" parent="android:TextAppearance.Holo.DialogWindowTitle">
<item name="android:background">#318d99</item>
<item name="android:textColor">#fff</item>
</style>
I expected that background of title becomes #318d99. But only background of text is #318d99:
How can I change white frame around the title to #318d99?
Also the frame around the dialog isn't transparent. How can I fix it?
There are some valuable posts about this already and very closely related to your question.
Google's post on customizing this is possibly worth looking at first:
https://sites.google.com/site/androidhowto/how-to-1/customize-alertdialog-theme
Take a look at this blog post:
http://blog.supenta.com/2014/07/02/how-to-style-alertdialogs-like-a-pro/
Specifically, go to Part 5: Styling the Background.
To summarize, they suggest that you will probably have to
Stop inheriting from Holo
Give your main theme an alertDialogStyle
Then create a style with the following attributes, which you can get a reference to here: http://developer.android.com/reference/android/R.styleable.html#AlertDialog
You'll want to create a new style that inherits from the default alertdialog theme (this is discussed in both posts I mentioned above):
<style name="CustomDialogTheme" parent="#android:style/Theme.Dialog">
<item name="android:bottomBright">#color/white</item>
<item name="android:bottomDark">#color/white</item>
<item name="android:bottomMedium">#color/white</item>
<item name="android:centerBright">#color/white</item>
<item name="android:centerDark">#color/white</item>
<item name="android:centerMedium">#color/white</item>
<item name="android:fullBright">#color/orange</item>
<item name="android:fullDark">#color/orange</item>
<item name="android:topBright">#color/blue</item>
<item name="android:topDark">#color/blue</item>
</style>
I want to change the color of the title bar. I tried this:
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:actionBarStyle">#style/ColorBar</item>
</style>
<style name="ColorBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#color/white</item>
<item name="android:textColor">#color/orange</item>
</style>
But it doesn't work. What is wrong in my code shown above?
EDIT : it's the color of the text i want to change, not the background (it's running for the background)
This should work for all devices, you will need the support library (appcompat_v7)
<style name="Theme" parent="#style/BaseTheme"></style>
<style name="BaseTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="actionBarStyle">#style/ActionBar</item>
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="android:background">#color/orange </item>
<item name="background">#color/orange </item>
<item name="android:titleTextStyle">#style/ActionBar.Text</item>
<item name="titleTextStyle">#style/ActionBar.Text</item>
</style>
<style name="ActionBar.Text" parent="#android:style/TextAppearance.Medium">
<item name="android:textColor">#color/orange</item>
</style>
manifest :
android:theme="#style/Theme"
There may be problem with the android version. You should consider old ones and new ones. Try adding these both lines for different versions.
<item name="android:background">#drawable/your_color</item>
<item name="background">#drawable/your_color</item>
Does changing the parent to parent="#android:style/Widget.Holo.Light.ActionBar.Solid" make a difference?
If not, let me know what happens if you move the
<item name="android:actionBarStyle">#style/ColorBar</item> into the AppBaseTheme style
Try setting all of these:
<item name="android:background">#color/something</item>
<item name="android:backgroundStacked">#color/something</item>
<item name="android:backgroundSplit">#color/something</item>
This is an easy way for settings the color of the actionbar-title by Java
getActionBar().setTitle(Html.fromHtml("<font color=\"#ffffff\">" + "TITLE" + "</font>"));
If you're using a support library, then you can use getSupportActionBar();.
I'm new to all of this but I found it easier to go to Res > Value > colors.xml and from there you can change the "primary color." This changed the title bar to the color I selected.
I tried change color of my actionBar divider , but nothing work. I' using android support library v7 for support old devices and custom style, and i also change all action bar drawable, but nothing happend!
<resources>
<style name="MyTheme" parent="Theme.AppCompat">
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent = "Widget.AppCompat.ActionBar">
<item name="background">#drawable/my_action_bar</item>
</style>
</resources>
And my ide show me strange error in layout , why did i get this error? it's not color value
java.lang.NumberFormatException: Color value '#drawable/abs__ab_transparent_dark_holo' must start with #
Solution: Need to add android namespace if use for api level >= 14 .May be it will be helpful to someone.
It is because the "divider" is an image. It's hardcoded in the Holo theme assets.
Look at platforms/android-19/data/res/drawable-xxhdpi/ab_transparent_dark_holo.9.png
The style is declared here for holo dark.
<style name="Widget.Holo.ActionBar" parent="Widget.ActionBar">
...
<item name="android:background">#android:drawable/ab_transparent_dark_holo</item>
...
</style>
It's a background. You will need to change the color in the image and replace the background of your bar.
It also needs different sizes for different resolutions.
Maybe you should set color directly, change your theme as
<item name="android:divider">#color/dividercolor</item>
Then you should add color dividercolor in you /value/color file,like
<item name="dividercolor"> #0099CC </item>
I hope this will be helpful to you
<style name="CustomTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/MyTheme.ActionBarStyle</item>
<item name="android:actionBarDivider">#drawable/action_vertical_doted</item>
<item name="android:actionButtonStyle">#style/MyTheme.ActionBar.ActionButton</item>
<item name="android:actionMenuTextColor">#ffffff</item>
<!-- <item name="android:actionMenuTextAppearance">#style/MyTheme.Menu.FontStyle</item> -->
<!-- <item name="android:actionBarSize">50dp</item> -->
</style>
<style name="MyTheme.ActionBarStyle" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="android:background">#drawable/actionbar_bg_shap</item>
<item name="android:displayOptions">none</item>
<item name="android:backgroundSplit">#drawable/actionbar_bg_shap</item>
</style>
<style name="MyTheme.ActionBar.ActionButton" parent="#android:style/Widget.Holo.Light.ActionButton">
<item name="android:background">#drawable/main_button_inactive_tr</item>
</style>