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
Related
I wish to be able to set a theme to set the message text size in an AppCompat AlertDialog. The theme needs to have parent="#style/Theme.AppCompat.Dialog". I have spent hours searching and trying all the suggestions, but none of them seem to work with that base theme.
If the parent is changed to the Holo theme, then I can alter the message text size using textAppearanceMedium, but the rest of the dialog looks really ugly :S
Currently my theme is (all this is currently hooked up and working):
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MyDialogTheme" parent="#style/Theme.AppCompat.Dialog">
<!-- Used for the buttons -->
<item name="colorAccent">#color/colorPrimary</item>
<!-- Button text size -->
<item name="android:textSize">#dimen/ui_text_size</item>
<!-- Content text color -->
<item name="android:textColorPrimary">#color/ui_text_color</item>
<!-- Title style -->
<item name="android:windowTitleStyle">#style/MyDialogTitleStyle</item>
<!-- Button style (except size) -->
<item name="android:textAppearanceButton">#style/MyDialogButtonTextAppearance</item>
<!-- Dialog background -->
<item name="android:windowBackground">#color/ui_background</item>
</style>
<style name="MyDialogTitleStyle" parent="#style/RtlOverlay.DialogWindowTitle.AppCompat">
<item name="android:textAppearance">#style/MyDialogTitleTextAppearance</item>
<item name="android:textSize">#dimen/ui_large_text_size</item>
</style>
<style name="MyDialogTitleTextAppearance">
<item name="android:textSize">#dimen/ui_large_text_size</item>
<item name="android:textAllCaps">true</item>
<item name="android:textColor">#color/ui_title_color</item>
</style>
<style name="MyDialogButtonTextAppearance">
<item name="android:fontFamily">sans-serif-light</item>
<item name="android:textAllCaps">true</item>
</style>
</resources>
Seems like there is no way to this via a theme attribute. Let's look at the source code of appcompat-v7 library. Following the TextView that reflects the message of the AlertDialog:
<android.support.v7.widget.AlertDialogLayout ... >
<!-- ... -->
<TextView
android:id="#android:id/message"
style="#style/TextAppearance.AppCompat.Subhead"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="?attr/dialogPreferredPadding"
android:paddingRight="?attr/dialogPreferredPadding"/>
<!-- ... -->
</android.support.v7.widget.AlertDialogLayout>
As you can see the TextView uses the TextAppearance.AppCompat.Subhead as the style. Following its definition:
<style name="TextAppearance.AppCompat.Subhead" parent="Base.TextAppearance.AppCompat.Subhead"/>
<style name="Base.TextAppearance.AppCompat.Subhead">
<item name="android:textSize">#dimen/abc_text_size_subhead_material</item>
<item name="android:textColor">?android:textColorPrimary</item>
</style>
The textSize is static and isn't resolved via an attribute like the textColor (which uses the textColorPrimary). Thus there's no option for us to set the textSize. The only way to do it would be to override the TextAppearance.AppCompat.Subhead style by adding it to your own styles.xml file and set the textSize to whatever value you need. But be aware there may be side effects since this style can be used in other places as well.
tl;dr
Options:
Define TextAppearance.AppCompat.Subhead in your styles.xml file and override the textSize attribute.
Do it programatically (find TextView by id and #setTextSize)
Use your own layout in the dialog - the source code of appcompat-v7 may be a good starting point.
I'd like to change the default button styling on an alert dialog.
The standard Alert Dialog Fragment (in Android L) looks like this:
I'd like the right button to be styled as a normal button instead of a borderless button. Google itself seems to use this pattern in various dialogs, such as:
Does anyone know if this is possible, without recreating the whole dialog from scratch?
You can style the button in the theme with attributes: android:buttonBarPositiveButtonStyle, android:buttonBarNegativeButtonStyle, and android:buttonBarNeutralButtonStyle.
Ok, the issue is solved automagically by updating to the (just released) release 21. Now the buttons are automatically in primary color :-)
EDIT: They are not in primary color, but in Android's basic turquoise..
This solution is for changing button color with material effect in AppCompatDialogFragment.
<android.support.v7.widget.AppCompatButton
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="20dp"
android:text="#string/buttin"
android:theme="#style/AppTheme.MyButton"
/>
Style file - v21
<style name="AppTheme.MyButton" parent="Theme.AppCompat.Dialog.Alert">
<item name="android:colorButtonNormal">#color/button_color</item>
<item name="android:textColor">#color/text_color</item>
</style>
Style file
<style name="AppTheme.MyButton" parent="Theme.AppCompat.Dialog.Alert">
<item name="colorButtonNormal">#color/button_color</item>
<item name="android:textColor">#color/text_color</item>
</style>
Kotlin
In your app's theme/style, add the following lines:
<item name="android:buttonBarNegativeButtonStyle">#style/NegativeButtonStyle</item>
<item name="android:buttonBarPositiveButtonStyle">#style/PositiveButtonStyle</item>
<item name="android:buttonBarNeutralButtonStyle">#style/NeutralButtonStyle</item>
Then add the following styles:
<style name="NegativeButtonStyle" parent="Widget.MaterialComponents.Button.TextButton.Dialog">
<item name="android:textColor">#color/red</item>
</style>
<style name="PositiveButtonStyle" parent="Widget.MaterialComponents.Button.TextButton.Dialog">
<item name="android:textColor">#color/red</item>
</style>
<style name="NeutralButtonStyle"
parent="Widget.MaterialComponents.Button.TextButton.Dialog">
<item name="android:textColor">#00f</item>
</style>
Using this method makes it unneccessary to set the theme in the AlertDialog builder.
I know it is doable with Dialog. But that would be nice to achieve this with AlertDialog. Code so far
<resources>
<style name="MyTheme">
<!-- some code -->
<item name="android:buttonBarStyle">#style/CustomButtonBarStyle</item>
<item name="android:borderlessButtonStyle">#style/CustomDialogButtonStyle</item>
<!-- Working for Android 4+ -->
<item name="android:alertDialogStyle">#style/CustomAlertDialogStyle</item>
<item name="android:alertDialogTheme">#style/CustomAlertDialogStyle</item>
<!-- Does nothing: -->
<!-- item name="android:buttonStyle">#style/CustomDialogButtonStyle</item -->
</style>
<style name="CustomAlertDialogStyle">
<!-- making dialog transparent -->
</style>
<style name="CustomDialogButtonStyle">
<item name="android:textColor">#000</item>
<item name="android:textSize">16sp</item>
<item name="android:background">#drawable/button_drawable</item>
</style>
<style name="CustomButtonBarStyle">
<item name="android:background">#null</item>
<item name="android:dividerPadding">0dp</item>
</style>
</resources>
I'v spent a lot of time in google and found nothing. Now I want to know is that even possible. Thank you.
UPD:
Since I'm using DialogFragment I can style button programmatically.
#Override
public void onResume() {
super.onResume();
((AlertDialog) getDialog()).getButton(Dialog.BUTTON_POSITIVE).setBackgroundColor(0xFFFFFFFF);
}
But I still have no idea, is it possible to apply style to it.
Why don't you just make a custom dialog? It isn't hard and it will give you a lot of flexibility in styling.
First, you'll make an xml layout with your buttons styled how ever you want, then just set the contentView of the dialog to your xml file. You can access your new buttons by id.
Here's a really good, simple tutorial about it.
I've created a custom theme for my app, and it looks great! However, I've noticed that some default platform dialogs, such as the context menu when long-pressing an EditText doesn't show correctly.
On the left, a context menu through my app. On the right, a standard context menu through a platform app.
Here's my style.xml:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Theme.Styled" parent="Theme.Sherlock">
<!-- ... various app styles ... -->
<item name="android:alertDialogStyle">#style/DialogHolo</item>
<item name="android:dialogTheme">#style/DialogHolo</item>
</style>
<style name="DialogHolo" parent="android:style/Theme.Dialog">
<item name="android:fullDark">#drawable/bg_dialog_full</item>
<item name="android:topDark">#drawable/bg_dialog_top</item>
<item name="android:centerDark">#drawable/bg_dialog_middle</item>
<item name="android:bottomDark">#drawable/bg_dialog_bottom</item>
<item name="android:fullBright">#drawable/bg_dialog_full</item>
<item name="android:centerBright">#drawable/bg_dialog_middle</item>
<item name="android:bottomBright">#drawable/bg_dialog_bottom</item>
<item name="android:bottomMedium">#drawable/bg_dialog_bottom</item>
<item name="android:centerMedium">#drawable/bg_dialog_middle</item>
<item name="android:textColor">#ffe6e7e8</item>
</style>
</resources>
Is it possible to either have these dialogs use the default style or get the text to appear in the desired text color?
I never found an elegant solution for this, and instead simply provided a theme defined separately in my style.xml when displaying a custom dialog.
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?