-
Notifications
You must be signed in to change notification settings - Fork 224
CustomDialog_en
CustomDialog is a dialog component with a high degree of customization freedom, completely implemented by the user. CustomDialog offers the ALIGN option for easy customization of dialog pop-up modes, supporting three default pop-up modes from the center, bottom, and top of the screen, along with corresponding animation effects. Users can also customize animation effects.
First, prepare a custom layout, then use the following code to display a custom dialog:
CustomDialog.show(new OnBindView<CustomDialog>(R.layout.layout_custom_dialog) {
@Override
public void onBind(final CustomDialog dialog, View v) {
ImageView btnOk;
btnOk = v.findViewById(R.id.btn_ok);
btnOk.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dialog.dismiss();
}
});
}
});
The above code demonstrates how to bind instantiated components and set events in the onBind
callback method.
You can also use the build()
method to construct CustomDialog:
CustomDialog.build()
.setCustomView(new OnBindView<CustomDialog>(R.layout.layout_custom_dialog) {
@Override
public void onBind(final CustomDialog dialog, View v) {
ImageView btnOk;
btnOk = v.findViewById(R.id.btn_ok);
btnOk.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dialog.dismiss();
}
});
}
})
.show();
If you are using ViewBinding, you can also replace it with OnBindingView to get the layout instance directly through binding:
FullScreenDialog.show(new OnBindingView<FullScreenDialog, LayoutCustomViewBinding>() {
@Override
public void onBind(FullScreenDialog dialog, View view, LayoutCustomViewBinding binding) {
//View childView = binding.childView
}
});
CustomDialog supports settings for dialog display from the top/bottom/center of the screen with different Align settings, accompanied by different default launch animations. For example, a dialog launched from the center of the screen uses the default message dialog animation, while top/bottom display and closure use slide-down/slide-up translation + fade animations. Custom animation effects can also be set if needed.
Set Align to modify the launch mode of CustomDialog:
CustomDialog.show(...)
.setAlign(ALIGN.TOP);
ALIGN is an enumeration, with values defined as follows:
CENTER Central display (default)
TOP Top display (equivalent to top center)
TOP_CENTER Top center display
TOP_LEFT Top left display
TOP_RIGHT Top right display
BOTTOM Bottom display (equivalent to bottom center)
BOTTOM_CENTER Bottom center display
BOTTOM_LEFT Bottom left display
BOTTOM_RIGHT Bottom right display
LEFT Left display (equivalent to left center)
LEFT_CENTER Left center display
LEFT_TOP Left top display
LEFT_BOTTOM Left bottom display
RIGHT Right display (equivalent to right center)
RIGHT_CENTER Right center display
RIGHT_TOP Right top display
RIGHT_BOTTOM Right bottom display
Please note: For example, the difference between TOP_LEFT
and LEFT_TOP
is in the direction of the entrance and exit animations. The animation for top left display enters from the top of the screen, positioned on the left, whereas left top display enters from the left, positioned at the top.
You can also customize the launch/close animations by using custom anim resource files:
CustomDialog.build()
.setCustomView(...)
.setEnterAnimResId(R.anim.enter_anim)
.setExitAnimResId(R.anim.exit_anim)
.show();
Or:
CustomDialog.build()
.setCustomView(...)
.setAnimResId(R.anim.enter_anim, R.anim.exit_anim)
.show();
Please note that launch animations must be set before the dialog starts, that is, using the build()
method to construct the dialog.
You can specify an existing view on the interface, making CustomDialog display around its position
.setAlignBaseViewGravity(btnCustomDialogAlign, Gravity.TOP)
alignGravity can specify TOP
, LEFT
, RIGHT
, BOTTOM
and be combined with CENTER_VERTICAL
, CENTER_HORIZONTAL
for relative horizontal or vertical centering, or set to completely center CENTER
. The display effect is as follows:
- Note: This method will set CustomDialog to full-screen mode (
setFullScreen(true)
).
Additionally, you can specify the margin between the view and the dialog when displayed based on view position:
.setBaseViewMargin(marginLeft, marginTop, marginRight, marginBottom)
You can also specify separately:
.setBaseViewMarginLeft(marginLeft)
CustomDialog does not implement dialog background masks by default, to enhance extensibility. If a background mask is needed, you can set it using the following code:
customDialog.setMaskColor(colorInt);
Please note, the input parameter is a ColorInt value, you can set a HEX color with Color.parseColor("#4D000000")
, or set a color resource with getResources().getColor(R.color.black30)
.
CustomDialog by default enables immersive non-safe area isolation mode, meaning it sets a padding in the root layout, separating the top status bar and bottom navigation bar's untouchable non-safe area, ensuring the custom layout is always within the safe area. However, this may conflict with your immersive framework, or if no immersive mode is configured (i.e., both the top navigation bar and bottom status bar are non-immersive), leading to extra space in the top/bottom display of CustomDialog. In such cases, you can use the following setting to disable immersive padding:
CustomDialog.build()
.setCustomView(...)
. setEnableImmersiveMode(false)
.show();
Please note, setEnableImmersiveMode(Boolean)
must be set before the dialog starts, that is, using the build()
method to construct the dialog.
To monitor the lifecycle of a dialog, you can implement the .setDialogLifecycleCallback(...)
interface. It's recommended to use the build()
method to construct the dialog:
CustomDialog.build()
.setDialogLifecycleCallback(new DialogLifecycleCallback<CustomDialog>() {
@Override
public void onShow(CustomDialog dialog) {
// Callback when CustomDialog is launched
}
@Override
public void onDismiss(CustomDialog dialog) {
// Callback when CustomDialog is dismissed
}
})
.show();
CustomDialog also supports Lifecycle. You can get the Lifecycle object using .getLifecycle()
.
You can also handle lifecycle events by overriding them when creating an instance using new
, for example:
// Event overriding demonstration
new CustomDialog() {
@Override
public void onShow(CustomDialog dialog) {
//...
tip("onShow");
}
@Override
public void onDismiss(CustomDialog dialog) {
//...
tip("onDismiss");
}
}
You can also use the methods .onShow(DialogXRunnable)
and .onDismiss(DialogXRunnable)
to handle lifecycle transactions, for example:
CustomDialog.show(...)
.onShow(new DialogXRunnable<CustomDialog>() {
@Override
public void run(CustomDialog dialog) {
//CustomDialog show!
}
})
.onDismiss(new DialogXRunnable<CustomDialog>() {
@Override
public void run(CustomDialog dialog) {
//CustomDialog dismiss!
}
});
// Force refresh the interface
.refreshUI();
// Close the dialog
.dismiss();
// Get the instantiated dialog object, you can use this method for deeper customization of the Dialog's functionality
.getDialogImpl()
// Get custom layout instance
.getCustomView()
// Set dialog width
.setWidth(px)
// Set dialog height
.setHeight(px)
// Hide the dialog (without animation), to restore display execute the non-static method .show()
.hide();
// Hide the dialog (simulate closing dialog animation), to restore display execute the non-static method .show()
.hideWithExitAnim();
// Check if it is currently showing
.isShow()
// Make the touch penetrate the mask
.setBkgInterceptTouch(false)
// Front dialog box display hierarchy
.bringToFront()
// Specify the level of dialog display
.setThisOrderIndex(int)