ButtonbarStyle grey Border - android

Hi I do have created a theme/style for an AlertDialog. However I do have the problem with the button bar, that it's still grey even after I have set the background color. Also the Button inside the bar is not filling the bar as I expected. I tried serveral things but I was not able to get this done.
<style name="MyBorderlessButton">
<!-- Set background drawable and text size of the buttons here -->
<item name="android:background">#drawable/button_dark_border</item>
<item name="android:textColor">#color/white</item>
</style>
<style name="MyButtonBar" parent="#android:style/ButtonBar">
<!-- Define a background for the button bar and a divider between the buttons here -->
<item name="android:divider">?android:attr/dividerVertical</item>
<item name="android:dividerPadding">1dp</item>
<item name="android:showDividers">middle</item>
<item name="android:padding">3dp</item>
<item name="android:background">#color/transparent</item>
</style>
<style name="MyAlertDialogTitle">
<item name="android:maxLines">1</item>
<item name="android:scrollHorizontally">true</item>
</style>
<style name="MyAlertTextAppearance">
<!-- Set text size and color of title and message here -->
<item name="android:textColor">#color/white</item>
</style>
<style name="MyAlertDialogTheme" parent="android:Theme.Dialog">
<item name="android:windowBackground">#color/transparent</item>
<item name="android:windowTitleStyle">#style/MyAlertDialogTitle</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowMinWidthMajor">#android:dimen/dialog_min_width_major</item>
<item name="android:windowMinWidthMinor">#android:dimen/dialog_min_width_minor</item>
<item name="android:windowIsFloating">true</item>
<item name="android:textAppearanceMedium">#style/MyAlertTextAppearance</item>
<!--
If you don't want your own button bar style use
#android:style/Holo.Light.ButtonBar.AlertDialog
and
?android:attr/borderlessButtonStyle
instead of #style/MyButtonBar and #style/MyBorderlessButton
-->
<item name="android:buttonBarStyle">#style/MyButtonBar</item>
<item name="android:buttonBarButtonStyle">#style/MyBorderlessButton</item>
</style>
<style name="MyAlertDialogStyle">
<!-- Define background colors of title, message, buttons, etc. here -->
<item name="android:background">#color/drawer_background</item>
</style>
button_dark_border:
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<solid android:color="#color/drawer_background" />
<stroke android:width="1dip" android:color="#color/white"/>
</shape>
How can I make the Button bar also black and the Button fill the AlertDialog again?

I fixed the problem updating the styles file. After some time i found that the parent attribute was blocking some of my changes. Here is my styles.xml now
<style name="Theme.PeeDeeTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:alertDialogTheme">#style/PeeDeeAlertDialogTheme</item>
<item name="android:alertDialogStyle">#style/PeeDeeAlertDialogStyle</item>
</style>
<style name="MyBorderlessButton">
<!-- Set background drawable and text size of the buttons here -->
<item name="android:background">#color/primarycolor_dark</item>
<item name="android:textColor">#color/white</item>
<!--
Setting the weight as follows should result in equally wide buttons filling the alert dialog width,
but instead they span further out of the dialog, breaking in multiple lines though
-->
<item name="android:layout_width">0dp</item>
<item name="android:layout_weight">1</item>
<item name="android:layout_height">15dp</item>
<item name="android:height">#null</item>
</style>
<style name="MyButtonBar">
<!-- Define a background for the button bar and a divider between the buttons here -->
<item name="android:divider">?android:attr/listDivider</item>
<item name="android:dividerHeight">1dp</item>
<item name="android:showDividers">none</item>
<item name="android:padding">0dp</item>
<item name="android:background">#color/transparent</item>
<!-- Making sure, the button bar uses parent width and is not restricted in height -->
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:height">#null</item>
<item name="android:minHeight">#null</item>
</style>
<style name="MyAlertDialogTitle">
<item name="android:maxLines">1</item>
<item name="android:scrollHorizontally">true</item>
<item name="android:textColor">#color/defaultcolor_drawer</item>
</style>
<style name="MyAlertTextAppearance">
<!-- Set text size and color of title and message here -->
<item name="android:textColor">#color/white</item>
</style>
<style name="MyAlertDialogTheme">
<item name="android:windowBackground">#color/transparent</item>
<item name="android:windowTitleStyle">#style/MyAlertDialogTitle</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowMinWidthMajor">#android:dimen/dialog_min_width_major</item>
<item name="android:windowMinWidthMinor">#android:dimen/dialog_min_width_minor</item>
<item name="android:windowIsFloating">true</item>
<item name="android:textAppearanceMedium">#style/MyAlertTextAppearance</item>
<item name="android:buttonBarStyle">#style/MyButtonBar</item>
<item name="android:buttonBarButtonStyle">#style/MyBorderlessButton</item>
<item name="android:panelBackground">#color/transparent</item>
</style>
<style name="MyAlertDialogStyle">
<!-- Define background colors of title, message, buttons, etc. here -->
<item name="android:fullDark">#color/drawer_background</item>
<item name="android:topDark">#color/drawer_background</item>
<item name="android:centerDark">#color/drawer_background</item>
<item name="android:bottomDark">#color/transparent</item>
<item name="android:fullBright">#color/drawer_background</item>
<item name="android:topBright">#color/drawer_background</item>
<item name="android:centerBright">#color/drawer_background</item>
<item name="android:bottomBright">#color/transparent</item>
<item name="android:bottomMedium">#color/transparent</item>
<item name="android:centerMedium">#color/drawer_background</item>
<item name="android:panelBackground">#color/drawer_background</item>
</style>

Related

Can't change a navigation bar color

I am trying to draw a white navigation bar with black button on splash (Theme.Paper.Launcher) and after change a background color to #color/primary_dark (Theme.Paper):
style-v27:
<resources>
<!-- Basic paper theme -->
<style name="Theme.Paper" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary</item>
<item name="colorAccent">#color/accent</item>
<item name="windowNoTitle">true</item>
<item name="actionModeStyle">#style/Widget.Paper.ActionMode</item>
<item name="windowActionModeOverlay">true</item>
<item name="actionModeCloseDrawable">#drawable/ic_close_white_24dp</item>
<item name="actionMenuTextColor">#color/white</item>
<item name="android:windowLightStatusBar">false</item>
<item name="android:navigationBarColor">#color/primary_dark</item>
<item name="android:windowLightNavigationBar">false</item>
</style>
<!-- Splash theme. -->
<style name="Theme.Paper.Launcher" parent="Theme.Paper">
<item name="colorPrimary">#android:color/white</item>
<item name="colorPrimaryDark">#android:color/white</item>
<item name="android:windowBackground">#drawable/bg_splash</item>
<item name="android:windowLightStatusBar">true</item>
<item name="android:navigationBarColor">#android:color/white</item>
<item name="android:windowLightNavigationBar">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
</style>
</resources>
But my navigation bar is still black with white buttons. What am I doing wrongly?
P.S. There is Android Oreo on my phone...

Change DatePicker Text Color

I want to change the text color of DatePicker.
I have tried couple of suggestions found here but nothing has worked for me.
The text color, and the selected background stays the same.
The top header background did changed.
<style name="MyThemeDesign" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/btnColor</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.Material.Light.DatePicker">
<item name="android:headerBackground">#color/orange</item>
<item name="android:text">#color/white</item>
<item name="android:calendarTextColor">#color/white</item>
<item name="android:dayOfWeekBackground">#color/white</item>
<item name="android:selectedWeekBackgroundColor">#color/colorRed</item>
<item name="android:yearListSelectorColor">#color/colorRed</item>
<item name="android:colorPrimary">#color/white</item>
<item name="android:colorPrimaryDark">#color/white</item>
<item name="android:colorBackgroundCacheHint">#color/colorRed</item>
<item name="colorAccent">#color/white</item>
<item name="android:textColorPrimary">#color/white</item>
<item name="android:datePickerMode">calendar</item>
<item name="android:minDate">01/01/2017</item>
</style>
In styles.xml:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
...
<item name="android:datePickerStyle">#style/MyDatePickerStyle</item>
</style>
<style name="MyDatePickerStyle" parent="#android:style/Widget.DeviceDefault.DatePicker">
<item name="android:headerBackground">#color/red</item>
<item name="android:headerMonthTextAppearance">#style/MyDatePickerTextAppearance</item>
</style>
<style name="MyDatePickerTextAppearance" parent="TextAppearance.AppCompat.Body1">
<item name="android:textColor">#drawable/my_color_state_list</item>
</style>
drawable/my_color_state_list.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Month color -->
<item android:color="#color/yellow" android:state_selected="true"/>
<!-- Year color -->
<item android:color="#color/purple" />
</selector>
If you also want to control the selected date color, then add this theme to style.xml:
<style name="MyDatePickerTheme" parent="AppTheme">
<item name="colorAccent">#color/blue</item>
</style>
In layout:
<DatePicker
android:theme="#style/MyDatePickerTheme"
.../>
Result:

Android : Customize Zendesk Rate My APP UI

How can I customize rate my app dialog of Zendesk. In sample app a style is added in style.xml file and it is working. But I don't know how to apply that style for Rating dialog. Please help me. Thanks in advance.
style.xml:
<!-- +++++++++++++++++++++++++++++++++ -->
<!-- Start rate my app dialogue styles -->
<!-- +++++++++++++++++++++++++++++++++ -->
<style name="rma_button">
<item name="android:background">#color/light_background</item>
<item name="android:gravity">center</item>
<item name="android:textSize">18sp</item>
<item name="android:layout_weight">1</item>
<item name="android:lineSpacingMultiplier">1.25</item>
</style>
<style name="rma_title" parent="rma_button">
<item name="android:textSize">22sp</item>
<item name="android:background">#android:color/white</item>
<item name="android:lineSpacingMultiplier">1.25</item>
</style>
<style name="rma_divider">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">1px</item>
<item name="android:background">#color/divider</item>
</style>
<!-- +++++++++++++++++++++++++++++++ -->
<!-- End rate my app dialogue styles -->
<!-- +++++++++++++++++++++++++++++++ -->
<!-- ++++++++++++++++++++++++++++++++++++++++++ -->
<!-- Start rate my app dialogue feedback styles -->
<!-- ++++++++++++++++++++++++++++++++++++++++++ -->
<style name="rma_feedback_issue_cancel_button" parent="_rma_feedback_issue_cancel_button">
<item name="android:background">#drawable/white_gradient_btn</item>
<item name="android:textColor">#color/grey_text</item>
</style>
<!--
This style overrides the parent style to change the background colour of the button
depending on the state
-->
<style name="rma_feedback_issue_send_button" parent="_rma_feedback_issue_send_button">
<item name="android:layout_marginLeft">8dp</item>
<item name="android:background">#drawable/green_gray_btn_selector</item> <!-- Button colour will change -->
<item name="android:textColor">#color/green_gray_txt_selector</item>
</style>
<style name="rma_feedback_message_title" parent="_rma_feedback_message_title">
<item name="android:textColor">#color/grey_text</item>
</style>
<style name="rma_feedback_message_subtitle" parent="_rma_feedback_message_subtitle">
<item name="android:textColor">#color/grey_text</item>
<item name="android:lineSpacingMultiplier">1.25</item>
</style>
<!--
In this example we are overriding the parent style using a selector to control the colour
of the text differently whether the edittext is enabled or disabled.
-->
<style name="rma_feedback_issue_edittext" parent="_rma_feedback_issue_edittext">
<item name="android:textColor">#color/enabled_disabled_grey_selector</item>
<item name="android:textColorHint">#color/text_hint</item>
</style>
<style name="rma_feedback_divider" parent="_rma_feedback_divider">
<item name="android:background">#color/divider</item>
</style>
<style name="rma_feedback_progress" parent="_rma_feedback_progress">
<item name="android:indeterminateDrawable">#drawable/progress_green_small_holo</item>
</style>
<!-- ++++++++++++++++++++++++++++++++++++++++ -->
<!-- End rate my app dialogue feedback styles -->
<!-- ++++++++++++++++++++++++++++++++++++++++ -->
Issue resolved by creating a separate theme for the activity that is using RateMyApp dialog and applied styles for button, title and divider of dialog as below
<style name="CustomTheme" parent="Theme.AppCompat">
<item name="RateMyAppPaddingTop">#dimen/rma_padding_top</item>
<item name="RateMyAppPaddingBottom">#dimen/rma_padding_bottom</item>
<item name="RateMyAppButtonStyle">#style/rma_button_style</item>
<item name="RateMyAppTitleStyle">#style/rma_title_style</item>
<item name="RateMyAppDividerStyle">#style/rma_divider_style</item>
<item name="RateMyAppDividerHeight">#dimen/rma_divider_height</item>
</style>
<dimen name="rma_padding_top">24dp</dimen>
<dimen name="rma_padding_bottom">24dp</dimen>
<style name="rma_button_style">
<item name="android:background">#color/light_background</item>
<item name="android:gravity">center</item>
<item name="android:textSize">18sp</item>
<item name="android:layout_weight">1</item>
<item name="android:textColor">#color/black</item>
<item name="android:lineSpacingMultiplier">1.25</item>
</style>
<style name="rma_divider_style">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">1px</item>
<item name="android:background">#color/divider</item>
</style>
<style name="rma_title_style" parent="rma_button">
<item name="android:textSize">22sp</item>
<item name="android:background">#android:color/white</item>
<item name="android:lineSpacingMultiplier">1.25</item>
<item name="android:textColor">#color/black</item>
</style>

Incorrect dialog style on old android versions

I have so style for alert dialogs:
<style name="Theme.Paper" parent="Theme.AppCompat.Light.NoActionBar">
<!-- customize the color palette -->
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/accent</item>
<item name="android:alertDialogStyle">#style/Theme.Paper.AlertDialogStyle</item>
<item name="android:alertDialogTheme">#style/Theme.Paper.AlertDialog</item>
</style>
<style name="Theme.Paper.Toolbar" parent="Theme.Paper">
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#color/white</item>
</style>
<style name="Theme.Paper.AlertDialogStyle" parent="android:Theme.Black">
<item name="android:fullDark">#color/white</item>
<item name="android:topDark">#color/white</item>
<item name="android:centerDark">#color/white</item>
<item name="android:bottomDark">#color/white</item>
<item name="android:fullBright">#color/white</item>
<item name="android:centerBright">#color/white</item>
<item name="android:bottomBright">#color/white</item>
<item name="android:bottomMedium">#color/white</item>
<item name="android:centerMedium">#color/white</item>
</style>
<style name="Theme.Paper.AlertDialog.Title">
<item name="android:maxLines">2</item>
<item name="android:scrollHorizontally">true</item>
</style>
<style name="Theme.Paper.AlertDialog.TextAppearanceMedium">
<!-- Set text size and color of message here -->
<item name="android:textSize">16sp</item>
<item name="android:textColor">#color/black_54</item>
</style>
<style name="Theme.Paper.AlertDialog.TextAppearanceLarge">
<!-- Set text size and color of title -->
<item name="android:textSize">20sp</item>
<item name="android:textColor">#color/black_87</item>
</style>
<style name="Theme.Paper.AlertDialog" parent="android:Theme.Black">
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowTitleStyle">#style/Theme.Paper.AlertDialog.Title</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowMinWidthMajor">#android:dimen/dialog_min_width_major</item>
<item name="android:windowMinWidthMinor">#android:dimen/dialog_min_width_minor</item>
<item name="android:windowIsFloating">true</item>
<item name="android:textAppearanceMedium">#style/Theme.Paper.AlertDialog.TextAppearanceMedium</item>
<item name="android:textAppearanceLarge">#style/Theme.Paper.AlertDialog.TextAppearanceLarge</item>
<item name="android:buttonBarStyle">#style/Theme.Paper.AlertDialog.ButtonBar</item>
<item name="android:buttonBarButtonStyle">#style/Theme.Paper.FlatButton</item>
</style>
<style name="Theme.Paper.FlatButton">
<!-- Set background drawable and text size of the buttons here -->
<item name="android:background">#drawable/bg_dialog_button</item>
<item name="android:textSize">14sp</item>
<item name="android:textColor">#color/primary</item>
<item name="android:layout_height">36dp</item>
<item name="android:maxHeight">36dp</item>
<item name="android:minHeight">36dp</item>
<item name="android:minWidth">64dp</item>
<item name="android:textAllCaps">true</item>
<item name="android:paddingLeft">8dp</item>
<item name="android:paddingRight">8dp</item>
<item name="android:layout_marginLeft">4dp</item>
<item name="android:layout_marginRight">4dp</item>
</style>
<style name="Theme.Paper.AlertDialog.ButtonBar">
<!-- Define a background for the button bar and a divider between the buttons here -->
<item name="android:divider">#android:color/transparent</item>
<item name="android:dividerPadding">0dp</item>
<item name="android:showDividers">none</item>
<item name="android:background">#color/white</item>
<item name="android:layout_height">48dp</item>
<item name="android:gravity">center_vertical|right</item>
</style>
It looks normal on Android 4.x, but on Android 2.x devices I get just white dialog window with buttons (all text is white with default sizes)
How I can fix it?
P.S. Please, help me! I cannot publish my app because of this only...

Actionbar Sherlock Change Title Color

I am trying the Theme Sherlock Action Bar. I want to set the color of the Title as White. When i try to do the following the Title disappears all together.
Also I want to change the background color of an Action Item Icon when Pressed.
What i have tried ?
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Variation on the Holo Light theme that styles the Action Bar -->
<style name="Theme.Nomad" parent="Theme.Sherlock.Light">
<item name="actionBarStyle">#style/Widget.Nomad.ActionBar</item>
<item name="android:actionBarStyle">#style/Widget.Nomad.ActionBar</item>
<item name="android:actionBarItemBackground">#drawable/actionbar_selectable_background</item>
<item name="actionBarItemBackground">#drawable/actionbar_selectable_background</item>
<item name="android:titleTextStyle">#style/TitleText</item>
<item name="titleTextStyle">#style/TitleText</item>
<!--
<item name="android:popupMenuStyle">#style/MyPopupMenu</item>
<item name="popupMenuStyle">#style/MyPopupMenu</item>
<item name="android:dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="dropDownListViewStyle">#style/MyDropDownListView</item>
<item name="android:actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="actionBarTabStyle">#style/MyActionBarTabStyle</item>
<item name="android:actionDropDownStyle">#style/MyDropDownNav</item>
<item name="actionDropDownStyle">#style/MyDropDownNav</item>
<item name="android:listChoiceIndicatorMultiple">#drawable/ad_btn_check_holo_light</item>
<item name="android:listChoiceIndicatorSingle">#drawable/ad_btn_radio_holo_light</item>
<item name="android:actionOverflowButtonStyle">#style/MyOverflowButton</item>
-->
</style>
<style name="Widget.Nomad.ActionBar" parent="Widget.Sherlock.ActionBar">
<item name="android:background">#E5492A</item>
<item name="background">#E5492A</item>
</style>
<style name="TitleText" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#android:color/white</item>
<item name="textColor">#android:color/white</item>
<item name="android:textSize">18dip</item>
<item name="textSize">18dip</item>
</style>
</resources>
I am not sure about item background, but for text color you can:
add these items in Widget.Nomad.ActionBar (style with parent Widget.Sherlock.ActionBar):
<item name="android:titleTextStyle">#style/TitleText</item>
<item name="titleTextStyle">#style/TitleText</item>
where:
<style name="TitleText" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#android:color/white</item>
<item name="android:textSize">18sp</item>
</style>
The best solution is this!
actionBar.setTitle(Html.fromHtml("<font color=\"#ffffff\"><b>" + AppName + "</b></font>"));
I promise it will be very helpful! Good luck!

Categories

Resources