# Dialog QML Type

The Dialog caters for cases in which the application requires the user to determine between optional actions. The Dialog will interrupt the user flow and lock the view for further interaction before the user has selected a desired action. It can only be closed by selecting an optional action confirming or cancelling the operation. More...

Import Statement: | import Lomiri.Components.Popups 1.3
Inherits: | PopupBase

- List of all members, including inherited members
- Obsolete members

## Properties

- callerMargin : real
- contentHeight : real
- contentWidth : real
- contents : list<Object>
- edgeMargins : real
- modal : bool
- style : Component
- styleName : string
- text : string
- theme : ThemeSettings
- title : string

## Detailed Description

See also the Design Guidelines on Dialogs.

Example:

    import QtQuick 2.4
    import Lomiri.Components
    import Lomiri.Components.Popups

    Item {
        width: units.gu(80)
        height: units.gu(80)
        Component {
             id: dialog
             Dialog {
                 id: dialogue
                 title: "Save file"
                 text: "Are you sure that you want to save this file?"
                 Button {
                     text: "cancel"
                     onClicked: PopupUtils.close(dialogue)
                 }
                 Button {
                     text: "overwrite previous version"
                     color: LomiriColors.orange
                     onClicked: PopupUtils.close(dialogue)
                 }
                 Button {
                     text: "save a copy"
                     color: LomiriColors.orange
                     onClicked: PopupUtils.close(dialogue)
                 }
             }
        }
        Button {
            anchors.centerIn: parent
            id: saveButton
            text: "save"
            onClicked: PopupUtils.open(dialog)
        }
    }

## Property Documentation

callerMargin : real

The property holds the margin from the dialog's caller. The property is themed.

contentHeight : real

Specifies the height of the dialog content.

This property was introduced in Lomiri.Components 1.3.

contentWidth : real

Specifies the width of the dialog content.

This property was introduced in Lomiri.Components 1.3.

[default] contents : list<Object>

Content will be put inside a column in the foreround of the Dialog.

edgeMargins : real

The property holds the margins from the dialog's dismissArea. The property is themed.

modal : bool

The property controls whether the dialog is modal or not. Modal dialogs block event propagation to items under dismissArea, when non-modal ones let these events passed to these items. In addition, non-modal dialogs do not dim the dismissArea.

The default value is true.

style : Component

The style of the foreground of the Dialog. This property takes precedence over styleName

This property was introduced in Lomiri.Components 1.3.

See also StyledItem::style.

styleName : string

The style name of the foreground of the Dialog.

This property was introduced in Lomiri.Components 1.3.

See also StyledItem::styleName.

text : string

The question to the user.

theme : ThemeSettings

Configure the theme of the Dialog foreground and all its subcomponents. Example:

    import QtQuick 2.4
    import Lomiri.Components
    import Lomiri.Components.Popups
    MainView {
        width: units.gu(40)
        height: units.gu(71)

        // make sure the main theme is Ambiance
        theme.name: "Lomiri.Components.Themes.Ambiance"

        Component {
            id: dialogComponent
            Dialog {
                id: dialog
                title: "Input dialog"
                // the dialog and its children will use SuruDark
                theme: ThemeSettings {
                    name: "Lomiri.Components.Themes.SuruDark"
                }
                TextField {
                    placeholderText: "enter text"
                }
                Button {
                    text: "Close"
                    onClicked: PopupUtils.close(dialog)
                }
            }
        }

        Button {
            text: "Open dialog"
            onClicked: PopupUtils.open(dialogComponent)
        }
    }

This property was introduced in Lomiri.Components 1.3.

See also StyledItem::theme.

title : string

The title of the question to ask the user.