Android Custom Dialog with transparent window Background breaks my button selector - android

I am making a custom dialog with a transparent window background set in the style. I have another button in my activity behind the dialog set with the same button_selector as the background, and it works fine, so I know the problem is something with the style and more specifically the windowBackground attribute.
Does anyone know how I can get a transparent window background for my custom dialog but still allow my button selector to work properly?
Included are pictures of how it looks with the button background set to #drawable/lightblue1, and #drawable/button_selector.
this is my style xml
<resources>
<style name="CustomDialogTheme" parent="#android:style/Theme.Dialog">
<item name="android:windowBackground">#color/transparent</item>
<item name="android:windowIsFloating">false</item>
<item name="android:windowNoTitle">true</item>
</style>
</resources>
If I remove the <item name="android:windowBackground">#color/transparent</item> line then my button selector works correctly, but my dialog is put inside the systems default dialog container background.
This is my button declaration xml. If i change #drawable/button_selector to one of the actual png files then it appears correctly, but with the selector my button background gets set to transparent.
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/button_selector"
android:layout_marginBottom="15dp"
android:textSize="35sp"
android:text="#string/btnText1">
</Button>
Here is how I create the dialog from java:
Dialog dialog = new Dialog(TimeClock.this, R.style.CustomDialogTheme);
dialog.setContentView(R.layout.tag);
dialog.show();
Here is the button_selector.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/darkblue1" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/darkblue1" /> <!-- focused -->
<item android:drawable="#drawable/lightblue1" /> <!-- default -->
</selector>
EDIT: I ended up "faking" my dialog with a translucent activity so that I could get better control over its appearance.

I don't understand exactly what is going wrong, but maybe it is worth defining your CustomDialogTheme based on an existing translucent theme? e.g.
<resources>
<style name="CustomDialogTheme" parent="#android:style/Theme.Translucent.NoTitleBar">
It is also possible that you may need to set some of the extra style items like (taken from this question):
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowIsFloating">true</item>
I was wondering if Android uses one of those settings to allow your button selector to work?

Related

Android override all button styles except dialogs

I've been overriding the default button style in my app like this:
<style name="ButtonStyle" parent="Base.Widget.AppCompat.Button">
<item name="android:textAllCaps">false</item>
<item name="android:textSize">18sp</item>
<item name="android:textColor">#color/primaryTextContrast</item>
<item name="android:background">#drawable/button</item>
</style>
That worked fine until Nougat, but with Nougat there's been a change (a bug fix I think) such that this style also applies to buttons in dialogs, while in previous versions it did not. This has the effect of giving the dialog buttons white text on a white background.
In case it's relevant, button is a 9 patch in drawable and is overridden in drawable-v21:
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item android:drawable="?attr/colorPrimary"/>
</ripple>
The primary color is dark, and primaryTextContrast is white. Dialogs do not get dark buttons in Nougat for some reason - they seem to pick up the text color but not the background. So I need to either let the dialog buttons do their default thing, or make the buttons fully inherit the style with a dark background and white text.
#nasch, Dialog buttons use button bar style. In this scenario, you could do something like
<style name="buttonBarButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:textColor">#color/colorPrimary</item>
</style>
In your main style definition, you then define
<style name="MyCustomTheme" parent="Theme.AppCompat">
<item name="buttonBarButtonStyle">#style/buttonBarButtonStyle</item>
...
Hope this helps.

Button's textColor won't change in Android

I want to change my button's text color when the state of the button changes. For example, when the button is disabled, I want the color the be grey, when it is enabled, I want it to be white and so on. So, to achieve this, I did this in my styles.xml file:
res/drawable/styles.xml
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
..
<item name="android:buttonStyle">#style/AppTheme.Button</item>
..
</style>
<style name="AppTheme.Button" parent="android:Widget.Button">
<item name="android:background">#drawable/shadow_button</item>
<item name="android:textColor">#drawable/shadow_button_text</item>
...
</style>
I defined the behavior of the button depending on its states in the shadow_button resource XML file. I decided to make a new one in order to change the text color depending on the state, as suggested in this post:
res/drawable/shadow_button_text.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true" android:color="#color/darkRed" />
<item android:state_pressed="true" android:color="#color/darkRed" />
<item android:state_enabled="false" android:color="#color/darkGrey" />
<item android:color="#color/darkRed" />
</selector>
Unfortunately, nothing changes - the text of the color stays white. What am I doing wrong?
Edit:
Sorry, guys, it turned out that I have left textColor="white" on a button in the activity that I'm testing the above code. I removed this tag and everything worked fine.
May be you are setting button hint not text? because text color only applied on set text not hint, just a check

Custom checkbox style in dialog

I'm constructing a dialog with multi-choice items (checkboxes):
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setMultiChoiceItems(arrayResource, selectedItems, new DialogInterface.OnMultiChoiceClickListener() {
// ...
});
AlertDialog dialog = builder.create();
dialog.show();
And I have a custom style for checkboxes:
<style name="CustomCheckBox" parent="#android:style/Widget.CompoundButton.CheckBox">
<item name="android:button">#drawable/btn_check</item>
<item name="android:textColor">#android:color/holo_purple</item>
</style>
It works perfectly when applied to individual checkboxes in the layout, by setting style="#style/CustomCheckBox".
But how can I apply this style to the created dialog? Or alternatively for the entire theme...
If it's somehow relevant - I'm using minSdkVersion=14 and targetSdkVersion=19.
Update:
Now according to MattMatt's answer, I'm applying a custom checkbox style to the entire theme, and also settings a custom style for dialogs:
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:checkboxStyle">#style/CustomCheckBox</item>
<item name="android:dialogTheme">#style/CustomDialog</item>
<item name="android:alertDialogTheme">#style/CustomDialog</item>
</style>
<style name="CustomCheckBox" parent="#android:style/Widget.CompoundButton.CheckBox">
<item name="android:button">#drawable/btn_check</item>
<item name="android:checkMark">#drawable/btn_check</item>
</style>
<style name="CustomDialog" parent="#android:style/Theme.Holo.Light.Dialog">
<item name="android:checkboxStyle">#style/CustomCheckBox</item>
<item name="android:background">#aaf</item>
</style>
Now any checkbox added to the layout gets the custom style, and I'm able to change the dialog's background, but the checkboxes in the dialog aren't affected in any way...
Actually, calling setMultiChoiceItems does not result in CheckBox widgets but CheckedTextView widgets. [Updated] It also seems that changing the value for the checkMark attribute does not have any effect. However, by changing the value of the listChoiceIndicatorMultiple attribute for the CustomDialog style, I was able to change the drawable for the choices. Like this:
<style name="CustomDialog" parent="#android:style/Theme.Holo.Light.Dialog">
<item name="android:listChoiceIndicatorMultiple">#drawable/btn_check</item>
<item name="android:background">#aaf</item>
</style>
I discovered this from looking at the Android source code and finding that the template used for the multiple choice items in the dialog box is this one:
https://github.com/android/platform_frameworks_base/blob/master/core/res/res/layout/select_dialog_multichoice_holo.xml
Everything you're looking for can be found in Themes and Styles from the docs, and apply the attributes of your theme with the attributes found in Android attrs docs
To make it easy for you, follow this example:
<style name="myTheme" parent="#android:Theme.Holo">
<!-- override default check box style with custom checkBox -->
<item name="android:checkBoxStyle">#style/CustomCheckBox</item>
</style>
<style name="CustomCheckBox" parent="#android:style/Widget.CompoundButton.CheckBox">
<item name="android:button">#drawable/btn_check</item>
<item name="android:textColor">#android:color/holo_purple</item>
Now, as long as "myTheme" is set to Activity, you have a custom check box ;)
Hope this helps, happy coding!
you can set drawables for all checkbox states. Drawables might be pictures or shapes, so you are free to set any background that you want to have.
1> make two png files for cb checked and unchecked states as you want them and store them in drawable folder of your app.
2> now make one customdrawble.xml file as below:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:drawable="#drawable/yourdrawable1" />
<item android:state_checked="true" android:drawable="#drawable/yourdrawable2" />
<item android:drawable="#drawable/yourdrawable1" /> <!-- default -->
</selector>
3> now make your checkbox as below:
<CheckBox
android:id="#+id/chk"
android:button=“#drawable/customdrawable”
android:layout_alignParentLeft="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
the solution worked for me to change the display for single checkbox

Android Dialog - Custom background instead of dimming or blurring

I have created my own custom dialog and it works fine but I want to change dimmed background to a custom pattern (for example an image file or a xml shape). How can I achieve that?
Note that I do not want to change intensity of dimming but I just want, this dimming be replaced with a pattern
I found a workaround for this problem, I derived this from #vipul mittal answer,
I should set dialog theme as following:
<item name="android:windowIsFloating">false</item>
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
With this theme my dialog will be:
full screen because windowIsFloating is set to false
surrounding area is fully transparent because windowBackground is set to #android:color/transparent
Now I should wrap my dialog xml layout contents with a wrapper that plays surrounding area role, in this case I have picked FrameLayout for this:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/dialog_back"> <!-- this is surrounding area drawable -->
<!-- dialog contents goes here -->
</FrameLayout>
Here is a screenshot of my final dialog:
Change dialog theme to:
<style name="CustomDialogTheme" parent="#android:style/Theme.Dialog">
<item name="android:windowBackground">#android:color/white</item>
<item name="android:windowIsFloating">false</item>
<item name="android:windowNoTitle">true</item>
</style>
In custom dialog when you call super call this:
public CustomDialog(Context context) {
super(context, R.style.CustomDialogTheme);
}

Changing the transparent background behind Dialog

How can I change the color of the semi-transparent background that is shown behind a Dialog.
The default is black and I want to make it white (with the same alpha like the default)
This is the theme I'm using for my custom dialog:
another question - how can I make the dialog to fill the screen width (with 20dp margin on each side)
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CustomDialogTheme" parent="android:Theme.Dialog">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">fill_parent</item>
<item name="android:padding">30dp</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:background">#color/white</item>
</style>
</resources>
Make a xml layout and set the layout to the dialog.
This might help for the syntax: you must set the content of the dialog to a layout
http://www.helloandroid.com/tutorials/how-display-custom-dialog-your-android-application
This might help for the background: you must overwrite the theme/style
Android Custom PopupWindow/Dialog

Categories

Resources