Skip to content

Latest commit

 

History

History
293 lines (229 loc) · 7.71 KB

MaterialDialog.md

File metadata and controls

293 lines (229 loc) · 7.71 KB

MaterialDialog

Dialogs provide important prompts in a user flow.
Currently, this control only represents the UI and guidelines proposed by Material, it doesn't provide the popup/alert behavior, you could resolve it with Rg.Plugins.Popup or with a similar implementation.
View Material Design documentation

Screenshot

Example

<material3:MaterialDialog
    HeadlineText="Basic dialog"
    SupportingText="Basic dialog with an accept button and cancel button."
    AcceptText="Accept"
    AcceptCommand="{Binding AcceptCommand}"
    CancelText="Cancel"
    CancelCommand="{Binding CancelCommand}" />

Documentation

BackgroundColor:

This property is to set the background color of the dialog.

ShadowColor:

This property is to set the background color of the dialog shadow.

Property HasShadow

This property is to set if the control will have shadow or not.

Property CornerRadius:

This property is to set the corner radius of the dialog.

Property Icon:

This property is to set the icon with support for PNG, JPG or JPEG.

Property CustomIcon:

This property is to set the leading icon with support for view, you can use SVG, font icon, PNG, JPG or JPEG.

Property IconSize:

This property is to set the sizes to the icon.

Property IconAlignment:

This property is to set the icon alignment.

Allowed Values:

  • Start
  • Center
  • End

Property HeadlineText:

This property is to set the headline text of the dialog.

Property HeadlineAlignment:

This property is to set the horizontal headline text alignment.

Allowed Values:

  • Start
  • Center
  • End

Property HeadlineColor:

This property is to set the color text of the headline.

Property HeadlineFontSize:

This property is to the font size of the headline.

Property HeadlineFontFamily:

This property is to the font family of the headline.

Property SupportingText:

This property is to set the supporting text of the dialog.

Property SupportingTextAlignment:

This property is to set the horizontal supporting text alignment.

Allowed Values:

  • Start
  • Center
  • End

Property SupportingTextColor:

This property is to set the color text of the supporting text.

Property SupportingTextFontSize:

This property is to the font size of the supporting text.

Property SupportingTextFontFamily:

This property is to the font family of the supporting text.

Property ShowDivider:

This property is to set if the control will have divider or not.

Property DividerColor:

This property is to set the color of the divider.

Property CancelText:

This property is to set the text of the cancel button.

Property CancelBackgroundColor:

This property is to set the background color of the cancel button.

Property CancelTextColor:

This property is to set the color text of the cancel button.

Property CancelFontSize:

This property is to the font size of the cancel button.

Property CancelFontFamily:

This property is to the font family of the cancel button.

Property CancelCornerRadius:

This property is to set the corner radius of cancel button.

Property CancelCommand:

This property is to set the command of the cancel button.

Property CancelIsBusy:

This property is to show a busy indicator in the cancel button when a command is running.

Property CancelIsVisible:

This property is to set if the cancel button is visible or hidden.

Property CancelIsEnabled:

This property is to set if the cancel button is enabled or disabled.

Property AcceptText:

This property is to set the text of the accept button.

Property AcceptBackgroundColor:

This property is to set the background color of the accept button.

Property AcceptTextColor:

This property is to set the color text of the accept button.

Property AcceptFontSize:

This property is to the font size of the accept button.

Property AcceptFontFamily:

This property is to the font family of the accept button.

Property AcceptCornerRadius:

This property is to set the corner radius of accept button.

Property AcceptCommand:

This property is to set the command of the accept button. If the ItemSource property has a bound list, this command will receive as a parameter the selected item if it is a single selection or a list of selected items if it is multiple selection (AllowMultiselect).

Property AcceptIsBusy:

This property is to show a busy indicator in the accept button when a command is running.

Property AcceptIsVisible:

This property is to set if the accept button is visible or hidden.

Property AcceptIsEnabled:

This property is to set if the accept button is enabled or disabled.

Property ButtonsAlignment:

This property is to set the horizontal alignment of the accept and cancel buttons.

Allowed Values:

  • Start
  • Center
  • End

Property ShowSearch:

This property is to set if the control will have a search to filter the items or not.

Property SearchPlaceholder:

This property is to set the text of the search placeholder.

Property SearchTextAlignment:

This property is to set the horizontal alignment of the search text.

Allowed Values:

  • Start
  • Center
  • End

Property SearchTextColor:

This property is to set the color text of the search text.

Property SearchBackgroundColor:

This property is to set the background color of the search.

Property SearchTextFontSize:

This property is to the font size of the search text.

Property SearchTextFontFamily:

This property is to the font family of the search text.

Property QuickSelectionCommand:

This property is to set a quick selection command which will be invoked as soon as the user selects any item from the list. This command will receive as a parameter the selected item.

Property AllowMultiselect:

This property is to set if the control will allow multiple selection of items or not.

Property ItemsSource

This property is for displaying list of items to select. You should set a List of MaterialDialogItem. Its definition is:

  • Id (string): internal identifier that you could need to identify the items.
  • Text (string): text showed.
  • IsSelected (bool): by default you can select an item or items in case multiple select is allowed.


Property ItemTextColor:

This property is to set the color text of the items.

Property ItemTextFontSize:

This property is to the font size of the items.

Property ItemTextFontFamily:

This property is to the font family of the items.

Property ItemCheckboxColor:

This property is to set the checkbox color of the items.

Property ItemCheckboxSelectedIcon

This property is to set the icon when is checked, it supports PNG, JPG or JPEG.

Property ItemCheckboxUnselectedIcon

This property is to set the icon when is unchecked, it supports PNG, JPG or JPEG.

Property ItemCheckboxCustomSelectedIcon

This property is to set the icon when is checked. It is a DataTemplate property, so you can set any control, it could supports SVG, font icon, PNG, JPG or JPEG.

Property ItemCheckboxCustomUnselectedIcon

This property is to set the icon when is unchecked. It is a DataTemplate property, so you can set any control, it could supports SVG, font icon, PNG, JPG or JPEG.

Property ItemCheckboxSize

This property is to set the size of the checkbox.

Property ItemCheckboxSpacing

This property is to set the spacing of the checkbox.