Add Text Editor example

A follow up commit will contain the touch UI.

Change-Id: I26275fdd31294506821fa3e3e4a4bb63329665b9
Task-number: QTBUG-54952
Reviewed-by: J-P Nurmi <jpnurmi@qt.io>

1 files changed, 437 insertions, 0 deletions

diff --git a/examples/quickcontrols2/texteditor/qml/texteditor.qml b/examples/quickcontrols2/texteditor/qml/texteditor.qml
new file mode 100644
index 00000000..cac5a66d
--- /dev/null
+++ b/examples/quickcontrols2/texteditor/qml/texteditor.qml
@@ -0,0 +1,437 @@
+/****************************************************************************
+**
+** Copyright (C) 2016 The Qt Company Ltd.
+** Contact: http://www.qt.io/licensing/
+**
+** This file is part of the examples 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 The Qt Company Ltd 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.8
+import QtQuick.Layouts 1.3
+import QtQuick.Controls 2.1
+import QtQuick.Window 2.0
+import QtQuick.Controls.Material 2.1
+//import QtQuick.Controls.Universal 2.1
+import Qt.labs.platform 1.0
+
+import io.qt.examples.texteditor 1.0
+
+ApplicationWindow {
+    id: window
+    width: 1024
+    height: 600
+    visible: true
+    title: document.documentTitle + " - Text Editor Example"
+
+    Component.onCompleted: {
+        x = Screen.width / 2 - width / 2
+        y = Screen.height / 2 - height / 2
+    }
+
+    Shortcut {
+        sequence: StandardKey.Open
+        onActivated: openDialog.open()
+    }
+    Shortcut {
+        sequence: StandardKey.SaveAs
+        onActivated: saveDialog.open()
+    }
+    Shortcut {
+        sequence: StandardKey.Quit
+        onActivated: Qt.quit()
+    }
+    Shortcut {
+        sequence: StandardKey.Copy
+        onActivated: textArea.copy()
+    }
+    Shortcut {
+        sequence: StandardKey.Cut
+        onActivated: textArea.cut()
+    }
+    Shortcut {
+        sequence: StandardKey.Paste
+        onActivated: textArea.paste()
+    }
+    Shortcut {
+        sequence: StandardKey.Bold
+        onActivated: document.bold = !document.bold
+    }
+    Shortcut {
+        sequence: StandardKey.Italic
+        onActivated: document.italic = !document.italic
+    }
+    Shortcut {
+        sequence: StandardKey.Underline
+        onActivated: document.underline = !document.underline
+    }
+
+    MenuBar {
+        Menu {
+            title: qsTr("File")
+
+            MenuItem {
+                text: qsTr("Open")
+                onTriggered: openDialog.open()
+            }
+            MenuItem {
+                text: qsTr("Save As...")
+                onTriggered: saveDialog.open()
+            }
+            MenuItem {
+                text: qsTr("Quit")
+                onTriggered: Qt.quit()
+            }
+        }
+
+        Menu {
+            title: qsTr("Edit")
+
+            MenuItem {
+                text: qsTr("Copy")
+                enabled: textArea.selectedText
+                onTriggered: textArea.copy()
+            }
+            MenuItem {
+                text: qsTr("Cut")
+                enabled: textArea.selectedText
+                onTriggered: textArea.cut()
+            }
+            MenuItem {
+                text: qsTr("Paste")
+                enabled: textArea.canPaste
+                onTriggered: textArea.paste()
+            }
+        }
+
+        Menu {
+            title: qsTr("Format")
+
+            MenuItem {
+                text: qsTr("Bold")
+                checkable: true
+                checked: document.bold
+                onTriggered: document.bold = !document.bold
+            }
+            MenuItem {
+                text: qsTr("Italic")
+                checkable: true
+                checked: document.italic
+                onTriggered: document.italic = !document.italic
+            }
+            MenuItem {
+                text: qsTr("Underline")
+                checkable: true
+                checked: document.underline
+                onTriggered: document.underline = !document.underline
+            }
+        }
+    }
+
+    FileDialog {
+        id: openDialog
+        fileMode: FileDialog.OpenFile
+        nameFilters: ["Text files (*.txt)", "HTML files (*.html, *.htm)"]
+        onFileSelected: document.fileUrl = file
+    }
+
+    FileDialog {
+        id: saveDialog
+        fileMode: FileDialog.SaveFile
+        nameFilters: openDialog.nameFilters
+        // TODO: will eventually pass FileDialog's suffix property here
+        onFileSelected: document.saveAs(file, "")
+    }
+
+    FontDialog {
+        id: fontDialog
+        onFontSelected: {
+            document.fontFamily = font.family;
+            document.fontSize = font.pointSize;
+        }
+    }
+
+    ColorDialog {
+        id: colorDialog
+        currentColor: "black"
+    }
+
+    MessageDialog {
+        id: errorDialog
+    }
+
+    header: ToolBar {
+        leftPadding: 8
+
+        RowLayout {
+            anchors.fill: parent
+            spacing: 0
+
+            ToolButton {
+                id: openButton
+                text: "\uF115"
+                font.family: "fontello"
+                onClicked: openDialog.open()
+            }
+
+            ToolSeparator {}
+
+            Row {
+                ToolButton {
+                    id: copyButton
+                    text: "\uF0C5"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    enabled: textArea.selectedText
+                    onClicked: textArea.copy()
+                }
+                ToolButton {
+                    id: cutButton
+                    text: "\uE802"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    enabled: textArea.selectedText
+                    onClicked: textArea.cut()
+                }
+                ToolButton {
+                    id: pasteButton
+                    text: "\uF0EA"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    enabled: textArea.canPaste
+                    onClicked: textArea.paste()
+                }
+            }
+
+            ToolSeparator {}
+
+            Row {
+                ToolButton {
+                    id: boldButton
+                    text: "\uE800"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    checkable: true
+                    checked: document.bold
+                    onClicked: document.bold = !document.bold
+                }
+                ToolButton {
+                    id: italicButton
+                    text: "\uE801"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    checkable: true
+                    checked: document.italic
+                    onClicked: document.italic = !document.italic
+                }
+                ToolButton {
+                    id: underlineButton
+                    text: "\uF0CD"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    checkable: true
+                    checked: document.underline
+                    onClicked: document.underline = !document.underline
+                }
+                ToolButton {
+                    id: textColorButton
+                    text: "\uE808"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    onClicked: colorDialog.open()
+
+                    Rectangle {
+                        width: aFontMetrics.width + 3
+                        height: 2
+                        color: document.textColor
+                        parent: textColorButton.contentItem
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        anchors.baseline: parent.baseline
+                        anchors.baselineOffset: 4
+
+                        TextMetrics {
+                            id: aFontMetrics
+                            font: textColorButton.font
+                            text: textColorButton.text
+                        }
+                    }
+                }
+            }
+
+            ToolSeparator {}
+
+            Row {
+                ToolButton {
+                    id: alignLeftButton
+                    text: "\uE803"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    checkable: true
+                    checked: document.alignment == Qt.AlignLeft
+                    onClicked: document.alignment = Qt.AlignLeft
+                }
+                ToolButton {
+                    id: alignCenterButton
+                    text: "\uE804"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    checkable: true
+                    checked: document.alignment == Qt.AlignHCenter
+                    onClicked: document.alignment = Qt.AlignHCenter
+                }
+                ToolButton {
+                    id: alignRightButton
+                    text: "\uE805"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    checkable: true
+                    checked: document.alignment == Qt.AlignRight
+                    onClicked: document.alignment = Qt.AlignRight
+                }
+                ToolButton {
+                    id: alignJustifyButton
+                    text: "\uE806"
+                    font.family: "fontello"
+                    focusPolicy: Qt.TabFocus
+                    checkable: true
+                    checked: document.alignment == Qt.AlignJustify
+                    onClicked: document.alignment = Qt.AlignJustify
+                }
+            }
+
+            ToolSeparator {}
+
+            ToolButton {
+                id: fontFamilyToolButton
+                text: qsTr("F")
+                font.family: document.fontFamily
+                font.bold: document.bold
+                font.italic: document.italic
+                font.underline: document.underline
+                onClicked: {
+                    fontDialog.currentFont.family = document.fontFamily;
+                    fontDialog.currentFont.pointSize = document.fontSize;
+                    fontDialog.open();
+                }
+            }
+
+            Item {
+                Layout.fillWidth: true
+            }
+        }
+    }
+
+    DocumentHandler {
+        id: document
+        document: textArea.textDocument
+        cursorPosition: textArea.cursorPosition
+        selectionStart: textArea.selectionStart
+        selectionEnd: textArea.selectionEnd
+        textColor: colorDialog.currentColor
+        // TODO: if we don't do this, e.g. the bold button won't be checked
+        // when it should be (the title is bold)
+        Component.onCompleted: document.fileUrl = "qrc:/texteditor.html"
+        onError: {
+            errorDialog.text = message
+            errorDialog.visible = true
+        }
+    }
+
+    Flickable {
+        id: flickable
+        flickableDirection: Flickable.VerticalFlick
+        anchors.fill: parent
+
+        TextArea.flickable: TextArea {
+            id: textArea
+            text: document.text
+            textFormat: Qt.RichText
+            wrapMode: TextArea.Wrap
+            focus: true
+            selectByMouse: true
+            // Different styles have different padding and background
+            // decorations, but since this editor is almost taking up the
+            // entire window, we don't need them.
+            leftPadding: 6
+            rightPadding: 6
+            topPadding: 0
+            bottomPadding: 0
+            background: null
+
+            MouseArea {
+                acceptedButtons: Qt.RightButton
+                anchors.fill: parent
+                onClicked: contextMenu.open()
+            }
+
+            onLinkActivated: Qt.openUrlExternally(link)
+        }
+
+        ScrollBar.vertical: ScrollBar {}
+    }
+
+    Menu {
+        id: contextMenu
+
+        MenuItem {
+            text: qsTr("Copy")
+            enabled: textArea.selectedText
+            onTriggered: textArea.copy()
+        }
+        MenuItem {
+            text: qsTr("Cut")
+            enabled: textArea.selectedText
+            onTriggered: textArea.cut()
+        }
+        MenuItem {
+            text: qsTr("Paste")
+            enabled: textArea.canPaste
+            onTriggered: textArea.paste()
+        }
+
+        MenuItem {
+            separator: true
+        }
+
+        MenuItem {
+            text: qsTr("Font...")
+            onTriggered: fontDialog.open()
+        }
+
+        MenuItem {
+            text: qsTr("Color...")
+            onTriggered: colorDialog.open()
+        }
+    }
+}