Change Dialog Buttons to Clear with ripple effect in styles.xml - android

I have a simple dialog box with two buttons, Positive and Negative that is taking a simple style layout I have defined in the styles.xml. I want the cancel button to have a clear background but still have user feedback when touching it (like a ripple effect of red). I've tried for 2 days now and no luck. Any input would be great.
Working with Ripple Effect:
My code for the next layout which makes the layout have a clear background for cancel but no ripple effect. But I do get a ripple effect for the Yes:
<style name="AlertDialogThemeTesting" parent="Theme.AppCompat.Dialog.Alert">
<item name="colorControlHighlight">#color/Red</item>
<item name="colorControlActivated">#color/Red</item>
<item name="colorControlNormal">#color/Red</item>
<item name="android:textColor">#color/Black</item>
<item name="android:textColorPrimary">#color/Gray</item>
<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:textColor">#color/Black</item>
<item name="android:background">?attr/selectableItemBackgroundBorderless</item>
<item name="backgroundTint">#color/Clear</item>
</style>
<style name="PositiveButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:textColor">#color/Black</item>
<item name="android:background">?attr/selectableItemBackgroundBorderless</item>
<item name="android:backgroundTint">#color/Gold</item>
</style>
Clear Background but no Ripple Effect:
It seems like adding a Clear/White background removes the ripple effect for some reason.
Code for Dialog:
final AlertDialog.Builder alert = new AlertDialog.Builder(PopOut.this,
R.style.AlertDialogTheme);
alert .setTitle("Delete Profile?")
.setMessage("Are you sure you want to delete" + profile)
.setPositiveButton("OK",
new DialogInterface.OnClickListener()
{
public void onClick(DialogInterface dialog,
int whichButton)
{
finish();
dialog.dismiss();
}
})
.setNegativeButton("Cancel", null);
final AlertDialog dialog = alert.create();
dialog.show();

Define your Button like below ,
<LinearLayout
android:id="#+id/test_btn"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="68dp"
android:background="#drawable/button_effect"
app:layout_constraintTop_toTopOf="parent"
tools:layout_editor_absoluteX="0dp">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:fontFamily="#font/titilliumweb_bold"
android:gravity="center"
android:text="Test Button"
android:textColor="#color/UcabWhite" />
</LinearLayout>
create button_effect.xml in drawable class like below,
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/colorPrimary" //colour you want the effect
android:exitFadeDuration="#android:integer/config_shortAnimTime">
<selector>
<item>
<color android:color="#android:color/transparent" />
</item>
</selector>
</ripple>
At the same time define setOnClickListner for the Button in your activity or Dialog.
test.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
}
});
I have tested this and it works like a charm. Give it a try and let me know if you have any difficulties.
EDIT
Define your Alert Dialog like below. When long press the cancel button you can see the ripple effect. But when you just click it no time to show the effcet as alert is dismiss.
final AlertDialog.Builder alert = new AlertDialog.Builder(this, R.style.AppTheme);
alert.setTitle("Delete Profile?")
.setMessage("Are you sure you want to delete")
.setPositiveButton("OK",
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog,
int whichButton) {
finish();
dialog.dismiss();
}
})
.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
#Override
public void onClick(DialogInterface dialog, int which) {
}
});
final AlertDialog dialog = alert.create();
dialog.show();
Button negativeButton = dialog.getButton(DialogInterface.BUTTON_NEGATIVE);
negativeButton.setBackgroundResource(R.drawable.button_mini_oval);
It will help.

Related

How to change the List view text color the in Alert Dialog box using style in android?

I have used this line to add style to dialog box
AlertDialog dialog = new AlertDialog.Builder(getActivity(), R.style.AlertDialogStyle)
I am able to style the Title name however the text color in the list remains black color only.
public class NotificationModeDialog extends DialogFragment {
public ArrayList<String> list = new ArrayList<>(); //initialized the array of list
public int i;
final String notificationListItems[]={
"CallAlert","address","name","Message","id","contact","ymail","Gmail"};//the data to be displayed in dialog box
#NonNull
#Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
final boolean[] notificationSelected={false,false,false,false,false,false,false,false};//initializing the starting state
//initializing the alertDialog here AlertDialogStyle is added for styling
AlertDialog dialog = new AlertDialog.Builder(getActivity(), R.style.AlertDialogStyle)
.setTitle("Notification Mode")
.setMultiChoiceItems(notificationListItems, notificationSelected ,new DialogInterface.OnMultiChoiceClickListener() {
#Override
public void onClick(DialogInterface dialog, int j, boolean isChecked) {
if(isChecked)
{
list.add(notificationListItems[j]); //add items
}
else if(list.contains(notificationListItems[j]))
{
list.remove(notificationListItems[j]);//remove items
}
}
})
//when person click on "ok" this statement is called
.setPositiveButton("OK", new DialogInterface.OnClickListener() {
#Override
public void onClick(DialogInterface dialog, int j) {
}
})
.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
dialog.cancel(); //cancel the changes and turn of the dialog box
}
}).create();//this will create the dialog box
dialog.show(); //show the dialog box
return dialog; //return the dialog box to layout
}
}
This is styles.xml code.
<!-- Styling the alert BOX -->
<style name="AlertDialogStyle" parent="Theme.AppCompat.Light.Dialog">
<!-- Used for the buttons -->
<item name="colorAccent">#e4e4e4</item>
<!-- Used for the title and text -->
<item name="android:textColorPrimary">#FFFFFF</item>
<!-- Used for the background -->
<item name="android:background">#64f24c49</item>
</style>
Create a alert dialog style in styles.xml:
<style name="MyAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="colorAccent">#color/colorAccent</item>
<item name="android:textColor">#color/white</item>
</style>
Then add the style to you current app theme style:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<!-- Alert Dialog Style -->
<item name="android:alertDialogStyle">#style/MyAlertDialogStyle</item>
</style>

Opening an Activity that contains only a Dialog

I'm trying to show a Dialog that it's inside of an Activity, and want to show this Activity without background, I only want to show the Dialog.
I'm doing this Intent
Intent intent = new Intent(getApplicationContext(), NotifyNetworkWifi.class);
startActivity(intent);
This is the Activity it's a simple Alert Dialog
AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(Main2Activity.this);
alertDialogBuilder.setTitle(this.getTitle() + " decision");
alertDialogBuilder.setMessage("Are you sure?");
// set positive button: Yes message
alertDialogBuilder.setPositiveButton("Yes", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
}
});
// set negative button: No message
alertDialogBuilder.setNegativeButton("No", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
// cancel the alert box and put a Toast to the user
dialog.cancel();
Toast.makeText(getApplicationContext(), "You chose a negative answer",
Toast.LENGTH_LONG).show();
}
});
// set neutral button: Exit the app message
alertDialogBuilder.setNeutralButton("Exit the app", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
// exit the app and go to the HOME
Main2Activity.this.finish();
}
});
AlertDialog alertDialog = alertDialogBuilder.create();
// show alert
alertDialog.show();
I didn't set a content view, I just delete it and added this line
setTheme(R.style.TUPUTAMADRE);
This Style is
<style name="TUPUTAMADRE" parent="AppTheme">
<item name="android:windowFrame">#android:color/transparent</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowNoTitle">true</item>
<item name="android:background">#android:color/transparent</item>
<item name="android:windowBackground">#android:color/transparent</item>
<!-- Customize your theme here. -->
</style>
I don't know why is showing to me a black screen behind the Dialog, I just want to show this dialog....
What I'm doing wrong?
LOGCAT ERROR
Caused by: java.lang.IllegalStateException: You need to use a Theme.AppCompat theme (or descendant) with this activity.
at android.support.v7.app.AppCompatDelegateImplBase.onCreate(AppCompatDelegateImplBase.java:122)
at android.support.v7.app.AppCompatDelegateImplV7.onCreate(AppCompatDelegateImplV7.java:146)
at android.support.v7.app.AppCompatActivity.onCreate(AppCompatActivity.java:59)
at com.tupits.dialogwithnetworkavaliable.Main2Activity.onCreate(Main2Activity.java:15)
Use Android theme in your manifest for activity.
<resources>
<style name="Theme.Transparent" parent="android:Theme">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:backgroundDimEnabled">false</item>
</style>
</resources>
try this code as your style

Changing AlertDialog button background

In an app I am developing, all I want to do is change the highlight color of an AlertDialog button. My main source of intelligence is this discussion, but I read pretty much every article about this on StackOverflow as well. The code below runs without crashing, but the highlight color of the button is still the default orange-yellow. Does anybody have an idea what is wrong?
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setMessage(message).setCancelable(true)
.setPositiveButton(getResources().getString(R.string.positive_button_title), new DialogInterface.OnClickListener() {
#Override
public void onClick(DialogInterface dialog, int whichButton) {
// Do stuff
}
});
// Incredibly bulky way of simply changing the button highlight color,
// but it appears to be the only way we can do it without getting a NullPointerException
AlertDialog dialog = builder.create();
dialog.setOnShowListener(new DialogInterface.OnShowListener() {
#Override
public void onShow(DialogInterface dialogInterface) {
if (Build.VERSION.SDK_INT < 16) {
((AlertDialog) dialogInterface).getButton(AlertDialog.BUTTON_POSITIVE).setBackgroundDrawable(getResources().getDrawable(R.drawable.dialog_button_drawable));
} else {
((AlertDialog) dialogInterface).getButton(AlertDialog.BUTTON_POSITIVE).setBackground(getResources().getDrawable(R.drawable.dialog_button_drawable));
}
}
});
dialog.show();
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/custom_button_background" android:state_focused="true" android:state_pressed="false" />
<item android:drawable="#android:drawable/btn_default" android:state_focused="true" android:state_pressed="true" />
<item android:drawable="#android:drawable/btn_default" android:state_focused="false" android:state_pressed="true" />
<item android:drawable="#android:drawable/btn_default" />
</selector>
Sorry if I don't get your question correctly, but since you are loading the drawable anyway, shouldn't this work for you as well?
How to change colors of a Drawable in Android?
When creating the AlertDialog you can set a theme to use.
Example - Creating the Dialog
AlertDialog.Builder builder = new AlertDialog.Builder(this, R.style.MyAlertDialogStyle);
builder.setTitle("AppCompatDialog");
builder.setMessage("");
builder.setPositiveButton("OK", null);
builder.setNegativeButton("Cancel", null);
builder.show();
styles.xml - Custom style
<style name="MyAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
<!-- Used for the buttons -->
<item name="colorAccent">#FFC107</item>
<!-- Used for the title and text -->
<item name="android:textColorPrimary">#FFFFFF</item>
<!-- Used for the background -->
<item name="android:background">#4CAF50</item>
</style>
In order to change the Appearance of the Title, you can do the following. First add a new style:
<style name="MyTitleTextStyle">
<item name="android:textColor">#FFEB3B</item>
<item name="android:textAppearance">#style/TextAppearance.AppCompat.Title</item>
</style>
afterwards simply reference this style in your MyAlertDialogStyle:
<style name="MyAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
...
<item name="android:windowTitleStyle">#style/MyTitleTextStyle</item>
</style>
This way you can define a different textColor for the message via android:textColorPrimary and a different for the title via the style.

Change button press color in Dialog Fragment?

I want to change the color of button press in a dialog like in the image below.
I managed to accomplish this when using simple Alert Dialog.
AlertDialog.Builder builder = new AlertDialog.Builder(this);
// Set dialog title
builder.setTitle(Html.fromHtml("<font color='#8b0000'>"
+ getResources().getString(R.string.delete_this_list)
+ "?" + "</font>"));
builder.setMessage(getResources().getString(R.string.delete)
+ " '"
+ lists[listNo]
+ "'?\n"
+ getResources().getString(
R.string.delete_this_list_description))
.setCancelable(false)
.setPositiveButton(getResources().getString(R.string.delete),
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
dialog.dismiss();
//Some background stuff
//.......//
}
})
.setNegativeButton(
getResources().getString(android.R.string.cancel),
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
dialog.dismiss();
}
});
alertDialog = builder.create();
alertDialog.show();
alertDialog.getButton(DialogInterface.BUTTON_POSITIVE)
.setBackground(getResources().getDrawable(R.drawable.btn_bar_holo_red));
alertDialog.getButton(DialogInterface.BUTTON_NEGATIVE)
.setBackground(getResources().getDrawable(R.drawable.btn_bar_holo_red));
But, this approach does not work when using DialogFragments.
When using DialogFragments, there is no getButton method.
Any ideas??
Instead of:
alertDialog.getButton(DialogInterface.BUTTON_POSITIVE)
.setBackground(getResources().getDrawable(R.drawable.btn_bar_holo_red));
Try:
alertDialog.setOnShowListener(new DialogInterface.OnShowListener() {
#Override
public void onShow(DialogInterface dialog) {
Button positiveButton = ((AlertDialog) dialog)
.getButton(AlertDialog.BUTTON_POSITIVE);
positiveButton.setBackgroundResource(R.drawable.btn_bar_holo_red_full);
Button negativeButton = ((AlertDialog) dialog)
.getButton(AlertDialog.BUTTON_NEGATIVE);
negativeButton.setBackgroundResource(R.drawable.btn_bar_holo_red_full);
}
});
Where btn_bar_holo_red_full would be defined in it's own xml file as follows:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_pressed" android:state_pressed="true" />
<item android:drawable="#drawable/button_focused" android:state_focused="true" />
<item android:drawable="#drawable/button_default" />
</selector>
Then define button_pressed, button_focused and button_default as follows (you'll need three, one each for pressed, focused and default):
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" androuid:shape="rectangle">
<solid android:color="#color/btn_background_pressed" />
</shape>
All that's left to do is to add those color values to your color.xml file.

Style attributes of custom styled AlertDialog

I am trying to style my AlertDialog and I have been able to change most of it through styles and xml declarations... but there are still a few issues:
How do I change the area around the title bar from black to my custom color?
How do I change the outer background to transparent (the outside part that is blue the the shadow drops upon)
How do I change the buttons so they do not overlap the black border around the alert message?
here is the function I have in my RootActivity (my activities extend this one)
public static void showNoConnectionDialog(Context ctx1) {
final Context ctx = ctx1;
LayoutInflater factory = LayoutInflater.from(ctx);
AlertDialog.Builder builder = new AlertDialog.Builder(new ContextThemeWrapper(ctx, R.style.SetdartDialog));
builder.setView(factory.inflate(R.layout.alert_dialog, null))
.setIcon(R.drawable.icon)
.setCancelable(true)
.setMessage(R.string.check_wireless_settings)
.setTitle(R.string.no_connection)
.setPositiveButton(R.string.myes, new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
ctx.startActivity(new Intent(Settings.ACTION_WIRELESS_SETTINGS));
}
})
.setNegativeButton(R.string.mno, new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
return;
}
})
.setOnCancelListener(new DialogInterface.OnCancelListener() {
public void onCancel(DialogInterface dialog) {
return;
}
})
.show();
}
here a snippet from styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.WhiteBackground" parent="android:Theme">
<item name="android:windowBackground">#null</item>
<item name="android:background">#android:color/white</item>
<!-- Dialog attributes
<item name="alertDialogStyle">#style/AlertDialog</item> -->
</style>
<style name="SetdartDialog">
<item name="android:background">#color/sd_blue</item> <!-- MUST HAVE with white bg-->
<!--<item name="android:windowBackground">#color/sd_blue</item> -->
<!--<item name="android:windowBackground">#color/transparent</item> needed with white bg ? -->
<item name="android:windowFrame">#color/transparent</item><!-- not sure what this changes-->
<item name="android:textColor">#android:color/black</item>
<item name="android:windowNoTitle">true</item>
<item name="android:textSize">10sp</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowContentOverlay">#color/transparent</item>
<item name="android:windowTitleStyle">#style/setwindowTitleStyle</item>
<item name="android:windowAnimationStyle">#android:style/Animation.Dialog</item>
<item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:gravity">center_vertical|center_horizontal</item>
<!--<item name="android:colorBackgroundCacheHint">#android:color/white</item>-->
</style>
<style name="setwindowTitleStyle">
<item name="android:textColor">#android:color/white</item>
<item name="android:background">#color/sd_blue</item>
</style>
</resources>
Also R.layout.alert_dialog
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:id="#+id/screen"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</ScrollView>
Create your custom layout with all these attributes you've mentioned. Use Dialog instead of AlertDialog, inflate the layout you have created, use the Dialog object to set the inflated layout. If you haven't been introduced to inflating service, do some research. After you are clear with inflating, remember that all the components of the dialog you access with the View object, that you have created with the inflating. The rest (like click listeners) remains to be done on usual way. Cheers. I hope it helps.
To make custom AlertDialog you should extend DialogFragment

Categories

Resources