main.qml Example File | Qt Quick Controls 5.4

- Qt 5.4
- Qt Quick Controls
- Qt Quick Controls - Text Editor Example
- main.qml Example File
- Qt 5.4.2 Reference Documentation

# main.qml Example File

texteditor/qml/main.qml

    /****************************************************************************
    **
    ** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies).
    ** Contact: http://www.qt-project.org/legal
    **
    ** This file is part of the Qt Quick Controls module of the Qt Toolkit.
    **
    ** $QT_BEGIN_LICENSE:BSD$
    ** You may use this file under the terms of the BSD license as follows:
    **
    ** "Redistribution and use in source and binary forms, with or without
    ** modification, are permitted provided that the following conditions are
    ** met:
    **   * Redistributions of source code must retain the above copyright
    **     notice, this list of conditions and the following disclaimer.
    **   * Redistributions in binary form must reproduce the above copyright
    **     notice, this list of conditions and the following disclaimer in
    **     the documentation and/or other materials provided with the
    **     distribution.
    **   * Neither the name of Digia Plc and its Subsidiary(-ies) nor the names
    **     of its contributors may be used to endorse or promote products derived
    **     from this software without specific prior written permission.
    **
    **
    ** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
    ** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
    ** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
    ** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
    ** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
    ** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
    ** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
    ** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
    ** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
    ** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
    ** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
    **
    ** $QT_END_LICENSE$
    **
    ****************************************************************************/

    import QtQuick 2.2
    import QtQuick.Controls 1.2
    import QtQuick.Layouts 1.0
    import QtQuick.Dialogs 1.1
    import QtQuick.Window 2.1
    import org.qtproject.example 1.0

    ApplicationWindow {
        visible: true
        width: 640
        height: 480
        minimumWidth: 400
        minimumHeight: 300

        title: document.documentTitle + " - Text Editor Example"

        MessageDialog {
            id: aboutBox
            title: "About Text"
            text: "This is a basic text editor \nwritten with Qt Quick Controls"
            icon: StandardIcon.Information
        }

        Action {
            id: cutAction
            text: "Cut"
            shortcut: "ctrl+x"
            iconSource: "images/editcut.png"
            iconName: "edit-cut"
            onTriggered: textArea.cut()
        }

        Action {
            id: copyAction
            text: "Copy"
            shortcut: "Ctrl+C"
            iconSource: "images/editcopy.png"
            iconName: "edit-copy"
            onTriggered: textArea.copy()
        }

        Action {
            id: pasteAction
            text: "Paste"
            shortcut: "ctrl+v"
            iconSource: "qrc:images/editpaste.png"
            iconName: "edit-paste"
            onTriggered: textArea.paste()
        }

        Action {
            id: alignLeftAction
            text: "&Left"
            iconSource: "images/textleft.png"
            iconName: "format-justify-left"
            shortcut: "ctrl+l"
            onTriggered: document.alignment = Qt.AlignLeft
            checkable: true
            checked: document.alignment == Qt.AlignLeft
        }
        Action {
            id: alignCenterAction
            text: "C&enter"
            iconSource: "images/textcenter.png"
            iconName: "format-justify-center"
            onTriggered: document.alignment = Qt.AlignHCenter
            checkable: true
            checked: document.alignment == Qt.AlignHCenter
        }
        Action {
            id: alignRightAction
            text: "&Right"
            iconSource: "images/textright.png"
            iconName: "format-justify-right"
            onTriggered: document.alignment = Qt.AlignRight
            checkable: true
            checked: document.alignment == Qt.AlignRight
        }
        Action {
            id: alignJustifyAction
            text: "&Justify"
            iconSource: "images/textjustify.png"
            iconName: "format-justify-fill"
            onTriggered: document.alignment = Qt.AlignJustify
            checkable: true
            checked: document.alignment == Qt.AlignJustify
        }

        Action {
            id: boldAction
            text: "&Bold"
            iconSource: "images/textbold.png"
            iconName: "format-text-bold"
            onTriggered: document.bold = !document.bold
            checkable: true
            checked: document.bold
        }

        Action {
            id: italicAction
            text: "&Italic"
            iconSource: "images/textitalic.png"
            iconName: "format-text-italic"
            onTriggered: document.italic = !document.italic
            checkable: true
            checked: document.italic
        }
        Action {
            id: underlineAction
            text: "&Underline"
            iconSource: "images/textunder.png"
            iconName: "format-text-underline"
            onTriggered: document.underline = !document.underline
            checkable: true
            checked: document.underline
        }

        FileDialog {
            id: fileDialog
            nameFilters: ["Text files (*.txt)", "HTML files (*.html)"]
            onAccepted: document.fileUrl = fileUrl
        }

        ColorDialog {
            id: colorDialog
            color: "black"
            onAccepted: document.textColor = color
        }

        Action {
            id: fileOpenAction
            iconSource: "images/fileopen.png"
            iconName: "document-open"
            text: "Open"
            onTriggered: fileDialog.open()
        }

        menuBar: MenuBar {
            Menu {
                title: "&File"
                MenuItem { action: fileOpenAction }
                MenuItem { text: "Quit"; onTriggered: Qt.quit() }
            }
            Menu {
                title: "&Edit"
                MenuItem { action: copyAction }
                MenuItem { action: cutAction }
                MenuItem { action: pasteAction }
            }
            Menu {
                title: "F&ormat"
                MenuItem { action: boldAction }
                MenuItem { action: italicAction }
                MenuItem { action: underlineAction }
                MenuSeparator {}
                MenuItem { action: alignLeftAction }
                MenuItem { action: alignCenterAction }
                MenuItem { action: alignRightAction }
                MenuItem { action: alignJustifyAction }
                MenuSeparator {}
                MenuItem {
                    text: "&Color ..."
                    onTriggered: {
                        colorDialog.color = document.textColor
                        colorDialog.open()
                    }
                }
            }
            Menu {
                title: "&Help"
                MenuItem { text: "About..." ; onTriggered: aboutBox.open() }
            }
        }

        toolBar: ToolBar {
            id: mainToolBar
            width: parent.width
            RowLayout {
                anchors.fill: parent
                spacing: 0
                ToolButton { action: fileOpenAction }

                ToolBarSeparator {}

                ToolButton { action: copyAction }
                ToolButton { action: cutAction }
                ToolButton { action: pasteAction }

                ToolBarSeparator {}

                ToolButton { action: boldAction }
                ToolButton { action: italicAction }
                ToolButton { action: underlineAction }

                ToolBarSeparator {}

                ToolButton { action: alignLeftAction }
                ToolButton { action: alignCenterAction }
                ToolButton { action: alignRightAction }
                ToolButton { action: alignJustifyAction }

                ToolBarSeparator {}

                ToolButton {
                    id: colorButton
                    property var color : document.textColor
                    Rectangle {
                        id: colorRect
                        anchors.fill: parent
                        anchors.margins: 8
                        color: Qt.darker(document.textColor, colorButton.pressed ? 1.4 : 1)
                        border.width: 1
                        border.color: Qt.darker(colorRect.color, 2)
                    }
                    onClicked: {
                        colorDialog.color = document.textColor
                        colorDialog.open()
                    }
                }
                Item { Layout.fillWidth: true }
            }
        }

        ToolBar {
            id: secondaryToolBar
            width: parent.width

            RowLayout {
                anchors.fill: parent
                ComboBox {
                    id: fontFamilyComboBox
                    implicitWidth: 150
                    model: Qt.fontFamilies()
                    property bool special : false
                    onActivated: {
                        if (special == false || index != 0) {
                            document.fontFamily = textAt(index)
                        }
                    }
                }
                SpinBox {
                    id: fontSizeSpinBox
                    activeFocusOnPress: false
                    implicitWidth: 50
                    value: 0
                    property bool valueGuard: true
                    onValueChanged: if (valueGuard) document.fontSize = value
                }
                Item { Layout.fillWidth: true }
            }
        }

        TextArea {
            Accessible.name: "document"
            id: textArea
            frameVisible: false
            width: parent.width
            anchors.top: secondaryToolBar.bottom
            anchors.bottom: parent.bottom
            baseUrl: "qrc:/"
            text: document.text
            textFormat: Qt.RichText
            Component.onCompleted: forceActiveFocus()
        }

        DocumentHandler {
            id: document
            target: textArea
            cursorPosition: textArea.cursorPosition
            selectionStart: textArea.selectionStart
            selectionEnd: textArea.selectionEnd
            Component.onCompleted: document.fileUrl = "qrc:/example.html"
            onFontSizeChanged: {
                fontSizeSpinBox.valueGuard = false
                fontSizeSpinBox.value = document.fontSize
                fontSizeSpinBox.valueGuard = true
            }
            onFontFamilyChanged: {
                var index = Qt.fontFamilies().indexOf(document.fontFamily)
                if (index == -1) {
                    fontFamilyComboBox.currentIndex = 0
                    fontFamilyComboBox.special = true
                } else {
                    fontFamilyComboBox.currentIndex = index
                    fontFamilyComboBox.special = false
                }
            }
        }
    }