CFAlertDialog is a library that helps you display and customise alert dialogs on Android. It offers an adaptive UI support. It’s functionality is almost similar to the native AlertDialog.
You can also check out this library for iOS here
- CFAlertDialog works on any device with Android API level 14 and above.
In your project's build.gradle add the following under dependencies
compile 'com.crowdfire.cfalertdialog:cfalertdialog:1.1.0'
The above shown alert types can easily be implemented using the code snippet given below by some small tweaks
// Create Alert using Builder
CFAlertDialog.Builder builder = new CFAlertDialog.Builder(this)
.setDialogStyle(CFAlertDialog.CFAlertStyle.ALERT)
.setTitle("You've hit the limit")
.setMessage("Looks like you've hit your usage limit. Upgrade to our paid plan to continue without any limits.")
.addButton("UPGRADE", -1, -1, CFAlertActionStyle.POSITIVE, CFAlertActionAlignment.END, (dialog, which) -> {
Toast.makeText(BaseActivity.this, "Upgrade tapped", Toast.LENGTH_SHORT).show();
dialog.dismiss();
})
// Show the alert
builder.show();
The alert type will determine the position and animation style for the dialog. You may set this by calling the setAlertStyle method with any of the following values.
CFAlertStyle.NOTIFICATION,
CFAlertStyle.ALERT,
CFAlertStyle.BOTTOM_SHEETThe default type is ALERT.
You can set a custom title and message text in the alert, using the setTitle method on the builder (pass null if you don’t need them).
You can set a custom title and message text color in the alert, using the setTextColor on the builder.
You can customise alignment of the title and message. Use the setTextGravity method on the builder with any of the following values:
Gravity.START,
Gravity.CENTER_HORIZONTAL,
Gravity.ENDYou can change the background (overlay) color of the alert using the method setBackgroundColor on the builder with the color of your choice.
This determines whether the Alert dialog is dismissed when user taps on the background. Use the method setCancelable with a boolean value. By default it is set to true.
The user will be able to interactively swipe to dismiss the notification dialog if this field is true.
The alert dialog can be dismissed automatically using the method setAutoDismissAfter(long duration).
You can add header and footer to the dialog. Use the method setHeaderView and setFooterView with any custom View. You can also pass the layout resource directly into the header/footer. Pass null to remove any existing header/footer.
- Some examples where you can make the use of header in alert (the dollar image is in header)
builder.setHeaderView(R.layout.dialog_header_layout);
OR
builder.setHeaderView(headerView);- Some examples where you can make the use of footer in alert
builder.setFooterView(R.layout.dialog_footer_layout);
OR
builder.setFooterView(footerView);You may set a callback when dialog is dismissed with the native setOnDismissListener on the alert object.
CFAlertDialog alertDialog = builder.show();
alertDialog.setOnDismissListener(new DialogInterface.OnDismissListener() {
@Override
public void onDismiss(DialogInterface dialog) {
// Do something here when dialog dismissed.
}
});You may add as many action buttons with the required styles. Use the addButton method on the builder.
builder.addButton("UPGRADE", Color.parseColor("#FFFFFF"), Color.parseColor("#429ef4"), CFAlertActionStyle.POSITIVE, CFAlertActionAlignment.CENTER, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(context, "Upgrade tapped", Toast.LENGTH_SHORT).show();
dialog.dismiss();
}
});You can set the title of action button to be added.
Configure the style of the action button that is to be added to alert view. Set style property of the above method with one of the following Action style
CFAlertActionStyle.DEFAULT,
CFAlertActionStyle.POSITIVE,
CFAlertActionStyle.NEGATIVEConfigure the alignment of the action button added to the alert view. Set alignment property of CFAction constructor with one of the following action types
CFAlertActionAlignment.START,
CFAlertActionAlignment.END,
CFAlertActionAlignment.CENTER,
CFAlertActionAlignment.JUSTIFIED // Action Button occupies the full widthPass an onClickListener to receive callbacks when the action buttons are tapped.
There are 3 types of list supported by default.
This will show a simple list view and give a callback when any of the item is tapped.
CFAlertDialog.Builder builder = new CFAlertDialog.Builder(this);
builder.setDialogStyle(CFAlertDialog.CFAlertStyle.ALERT);
builder.setTitle("Select notification tone!");
builder.setItems(new String[]{"None", "Alert", "Delight", "Guitar", "Marbles", "Prompt"}, new OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int index) {
Toast.makeText(context, "Selected:"+index, Toast.LENGTH_SHORT).show();
dialogInterface.dismiss();
}
});
builder.show();This will show a list view with single choice items. It will give a callback when any of the items is selected.
CFAlertDialog.Builder builder = new CFAlertDialog.Builder(this);
builder.setDialogStyle(CFAlertDialog.CFAlertStyle.ALERT);
builder.setTitle("Select notification tone!");
builder.setSingleChoiceItems(new String[]{"None", "Alert", "Delight", "Guitar", "Marbles", "Prompt"}, 3, new OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int index) {
Toast.makeText(context, "Selected:"+index, Toast.LENGTH_SHORT).show();
}
});
builder.addButton("DONE", -1, -1, CFAlertActionStyle.POSITIVE, CFAlertActionAlignment.END, new OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
dialogInterface.dismiss();
}
});
builder.show();This will show a list view with multi choice items. It will give a callback when any item is selected/unselected.
CFAlertDialog.Builder builder = new CFAlertDialog.Builder(this);
builder.setDialogStyle(CFAlertDialog.CFAlertStyle.ALERT);
builder.setMessage("Select the topping for your pizza!!!");
builder.setMultiChoiceItems(new String[]{"Spinach", "Red & Yellow pepper", "Baby corn", "Olives", "Chicken"}, new boolean[]{false, false, false, false, false}, new DialogInterface.OnMultiChoiceClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int index, boolean b) {
Toast.makeText(context, "Row:"+index+" "+(b? "Selected":"Unselected"), Toast.LENGTH_SHORT).show();
}
});
builder.addButton("NEXT", -1, -1, CFAlertActionStyle.POSITIVE, CFAlertActionAlignment.END, new OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
dialogInterface.dismiss();
}
});
builder.show();This code is distributed under the terms and conditions of the MIT license.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent