-
Notifications
You must be signed in to change notification settings - Fork 217
MessageDialog&InputDialog_en
The basic dialog component can implement basic dialog business logic, including a title, message text, and single/double/triple button reminder functions. The three buttons can be displayed vertically or horizontally to meet most daily interruptive reminder needs.
InputDialog is an extension component of the basic dialog, which, in addition to the basic functions, also provides an input box. It allows customization of input prompt text, input text style, and callback for content entered upon button click.
Use the following code to display a dialog:
MessageDialog.show("Title", "Body Content", "Confirm");
Please note, both title and body content can be passed as null, in which case the corresponding text layout will not be displayed.
To display a dialog with multiple buttons:
MessageDialog.show("Title", "Body Content", "Confirm", "Cancel", "Other");
If you need to display the buttons vertically, you can set it with the following code:
MessageDialog messageDialog = new MessageDialog("Title", "Body Content", "Confirm", "Cancel", "Other")
.setButtonOrientation(LinearLayout.VERTICAL);
messageDialog.show();
As you can see from the code above, dialog components can be directly created and displayed using the .show(...)
static method, or by using new
. Additionally, to create an empty dialog, you can instantiate a dialog object using MessageDialog.build()
.
If your project includes multiple themes and you need to temporarily change the theme of a particular dialog, or temporarily change the light and dark mode of the dialog, then you must create it using a non-"show" method, modify the theme or color, and then display it, as follows:
MessageDialog.build()
.setStyle(IOSStyle.style())
.setTheme(DialogX.THEME.DARK)
.setTitle("Title")
.setMessage("Content")
.setOkButton("Confirm")
.show();
In addition, you can also use the new command to build MessageDialog and InputDialog. DialogX dialogs support multiple construction methods, giving you freedom and flexibility.
new MessageDialog()
.setTitle("Title")
.setMessage("Content")
.setOkButton("Confirm")
.show();
Button callbacks can be set through methods:
MessageDialog.show("Title", "Body Content", "Confirm").setOkButton(new OnDialogButtonClickListener<MessageDialog>() {
@Override
public boolean onClick(MessageDialog baseDialog, View v) {
toast("Clicked Confirm button");
return false;
}
});
The callback has a return value. If return true
, the dialog will not close automatically after the button is clicked.
Moreover, DialogX provides various methods for setting callbacks and button text:
// Set button text only
.setOkButton("Confirm")
// Set button click callback only
.setOkButton(new OnDialogButtonClickListener<MessageDialog>() {
@Override
public boolean onClick(MessageDialog baseDialog, View v) {
toast("Clicked Confirm button");
return false;
}
});
// Set button text and callback
.setOkButton("Confirm", new OnDialogButtonClickListener<MessageDialog>() {
@Override
public boolean onClick(MessageDialog baseDialog, View v) {
toast("Clicked Confirm button");
return false;
}
});
// Hide the button
.setOkButton(null)
Feel free to use according to personal preference.
If your business process does not need to immediately process the user's operation, but needs to know which button the user chose, you can also hold the dialog handle and later get the selection status, for example:
private MessageDialog dialog;
// Simulate business process, create and display a dialog, but do not immediately process click event
dialog = MessageDialog.show("Title", "Ask Question", "OK", "NO", "OTHER");
// When needed, you can get which button was clicked by the user using the getButtonSelectResult() method
BUTTON_SELECT_RESULT result = dialog.getButtonSelectResult();
BUTTON_SELECT_RESULT is an enumeration, containing the following types:
NONE, // No selection made
BUTTON_OK, // OK button selected
BUTTON_CANCEL, // Cancel button selected
BUTTON_OTHER // Other button selected
You can determine which button was clicked based on its state.
Based on this feature, if the business process involves the same part of the code needing to be executed regardless of which option the user chooses, then the developer can also uniformly process the user's choice after the selection, for example, in the `DialogLifecycle
#onDismiss` dialog closing event, reducing redundant code.
The callback for InputDialog is slightly different from MessageDialog. In the callback parameters, the input text content is given, facilitating direct judgment and retrieval of the input text:
new InputDialog("Title", "Body Content", "Confirm", "Cancel", "Text Being Typed")
.setCancelable(false)
.setOkButton(new OnInputDialogButtonClickListener<InputDialog>() {
@Override
public boolean onClick(InputDialog baseDialog, View v, String inputStr) {
toast("Input Content: " + inputStr);
return false;
}
})
.show();
Additionally, you can also use inputDialog.getInputText()
to get the input text content.
To monitor the lifecycle of the dialog, implement its .setDialogLifecycleCallback(...)
interface. It's recommended to build the dialog using the build()
method:
MessageDialog.build()
.setDialogLifecycleCallback(new DialogLifecycleCallback<MessageDialog>() {
@Override
public void onShow(MessageDialog dialog) {
// Callback when the dialog is launched
}
@Override
public void onDismiss(MessageDialog dialog) {
// Callback when the dialog is closed
}
})
.show();
MessageDialog/InputDialog also supports Lifecycle. You can get the Lifecycle object using .getLifecycle()
.
You can also handle lifecycle events by overriding lifecycle events when building instances using new, for example:
// Demonstration of event override
new MessageDialog() {
@Override
public void onShow(MessageDialog dialog) {
//...
tip("onShow");
}
@Override
public void onDismiss(MessageDialog dialog) {
//...
tip("onDismiss");
}
}
You can also use the methods .onShow(DialogXRunnable)
and .onDismiss(DialogXRunnable)
to handle lifecycle transactions, for example:
MessageDialog.show("title", "content", "ok")
.onShow(new DialogXRunnable<MessageDialog>() {
@Override
public void run(MessageDialog dialog) {
//MessageDialog show!
}
})
.onDismiss(new DialogXRunnable<MessageDialog>() {
@Override
public void run(MessageDialog dialog) {
//MessageDialog dismiss!
}
})
.show();
To include a custom layout in the dialog, first prepare your custom layout file, then build using the following method:
MessageDialog.show("This is the Title", "This dialog demonstrates the effect of a custom dialog inner layout", "Confirm", "Cancel")
.setCustomView(new OnBindView<MessageDialog>(R.layout.layout_custom_view) {
@Override
public void onBind(MessageDialog dialog, View v) {
//View childView = v.findViewById(resId)...
}
});
In the callback parameters, v
is the instantiated component of your given layout file. You can instantiate other child layout components through v.findViewById(resId)
and set their functionality and event callbacks in the onBind
method.
If you are using ViewBinding, you can also replace it with OnBindingView to get the layout instance directly through binding:
MessageDialog.show("This is the Title", "This dialog demonstrates the effect of a custom dialog inner layout", "Confirm", "Cancel")
.setCustomView(new OnBindingView<MessageDialog, LayoutCustomViewBinding>() {
@Override
public void onBind(MessageDialog dialog, View view, LayoutCustomViewBinding binding) {
//View childView = binding.childView
}
});
MessageDialog.build()
.setTitle("Title")
.setMessage("Here is the body content.")
.setOkButton("Confirm")
.setCancelButton("Cancel")
// Set entrance and exit animation resources
.setAnimResId(R.anim.anim_dialogx_bottom_enter, R.anim.anim_dialogx_bottom_exit)
.show();
To customize animation files, refer to: Default Dialog Start Animation File and Default Dialog Exit Animation File
Additionally, besides .setAnimResId(enterAnimResId, exitAnimResId)
, there are also .setEnterAnimResId(enterAnimResId)
and .setExitAnimResId(enterAnimResId)
methods available, applicable only to a single display of a dialog.
You can also set the duration of the entrance animation with setEnterAnimDuration([long])
and the exit animation with .setExitAnimDuration([long])
.
You can directly modify the global animation for MessageDialog and InputDialog through static properties:
// Set the global entrance animation for MessageDialog
MessageDialog.overrideEnterAnimRes = R.anim.anim_dialogx_bottom_enter;
// Set the global exit animation for MessageDialog
MessageDialog.overrideExitAnimRes = R.anim.anim_dialogx_bottom_exit;
// Set the global entrance animation duration for MessageDialog
MessageDialog.overrideEnterDuration = 1000;
// Set the global exit animation duration for MessageDialog
MessageDialog.overrideExitDuration = 1000;
You can directly modify the global animations for MessageDialog and InputDialog through static properties:
// Set the global enter animation for MessageDialog
MessageDialog.overrideEnterAnimRes = R.anim.anim_dialogx_bottom_enter;
// Set the global exit animation for MessageDialog
MessageDialog.overrideExitAnimRes = R.anim.anim_dialogx_bottom_exit;
// Set the duration of the global enter animation for MessageDialog
MessageDialog.overrideEnterDuration = 1000;
// Set the duration of the global exit animation for MessageDialog
MessageDialog.overrideExitDuration = 1000;
You can also completely customize the default animation effects of the global dialog boxes by referring to the custom theme interface. For details, please consult 《Custom DialogX Themes》
Please note that these three settings have different priorities: The priority of modifications to animations for a single dialog display > Global modifications for MessageDialog, InputDialog animations > Custom theme modifications.
// Force a refresh of the interface
.refreshUI();
// Close the dialog
.dismiss();
// Set whether clicking outside the area or the back button is allowed to close the dialog
.setCancelable(boolean);
// Set the title text style
.setTitleTextInfo(TextInfo);
// Set the message text style
.setMessageTextInfo(TextInfo);
// Set the button text style
.setOkTextInfo(TextInfo);
.setCancelTextInfo(TextInfo);
.setOtherTextInfo(TextInfo);
// Set the button orientation, buttonOrientation can be LinearLayout.VERTICAL or LinearLayout.HORIZONTAL
.setButtonOrientation(buttonOrientation);
// Set the back button callback
.setOnBackPressedListener(OnBackPressedListener);
// Get the dialog instance object, you can customize the Dialog features more deeply through this method
.getDialogImpl()
// Get the custom layout instance
.getCustomView()
// Set the background color, forcibly dye the dialog background. Note that the parameter is an int type color value, not an R.color index
.setBackgroundColor(ColorInt);
// InputDialog auto-popup keyboard
.setAutoShowInputKeyboard(boolean)
// InputDialog set default input text style
.setInputInfo(InputInfo)
// Set dialog corner radius (will crop content display)
.setRadius(float px)
// Hide the dialog (no animation), to show again, execute the non-static method .show()
.hide();
// Hide the dialog (simulate the close dialog animation), to show again, execute the non-static method .show()
.hideWithExitAnim();
// Check if it is currently displayed
.isShow()
// Set placeholder text
.setInputHintText("Hint Text")
// Front dialog box display hierarchy
.bringToFront()
// Specify the level of dialog display
.setThisOrderIndex(int)
MessageDialog supports modifying the background mask for added flexibility. To set the background mask, you can use the following code:
messageDialog.setMaskColor(colorInt);
Please note, the parameter is a ColorInt value. You can use Color.parseColor("#4D000000")
to set a HEX color value, or getResources().getColor(R.color.black30)
to set a color resource value.
TextInfo is used to store basic text style settings, including a series of properties and their respective get/set methods, explained as follows:
Property | Explanation | Default Value |
---|---|---|
fontSize | Font size, -1 for default style, unit: dp | -1 |
gravity | Alignment, -1 for default style, can use values like Gravity.CENTER
|
-1 |
fontColor | Text color, 1 for default style, can use Color.rgb(r,g,b) to get value | 1 |
bold | Whether it's bold | false |
Note that fontColor is a ColorInt value. You can use Color.parseColor("#4D000000")
to set a HEX color value, or a resource getResources().getColor(R.color.black30)
to set a color resource value. Do not directly pass in a resource ID as it might not work.
InputInfo is used for custom settings of input content, including a series of properties and their respective get/set methods, explained as follows:
Property | Explanation | Default Value |
---|---|---|
MAX_LENGTH | Maximum length, -1 for no effect | -1 |
inputType | Custom input type, types detailed in android.text.InputType | |
textInfo | Default font style | (TextInfo) |
multipleLines | Whether to support multiple lines | false |
selectAllText |
| Default select all text (for ease of modification) | false | | cursorColor | Cursor color of the input box | | | bottomLineColor | Input box bottom line color (note some themes may affect background color) | |
Note that cursorColor and bottomLineColor are ColorInt values. You can use Color.parseColor("#4D000000")
to set a HEX color value, or a resource getResources().getColor(R.color.black30)
to set a color resource value. Do not directly pass in a resource ID as it might not work.
If your app includes multiple themes and you need the dialog to display in a specific non-global theme style in certain scenarios, you can use .build()
to construct the dialog, then use .setStyle(style)
to specify the theme style, and finally execute .show()
to display the dialog, as follows:
MessageDialog.build()
// or directly use .build(IOSStyle.style())
.setStyle(IOSStyle.style())
.setTitle("Title")
.setMessage("Message content.")
.setOkButton("OK")
.show();