WRITE A SIMPLE MARKDOWN EDITOR WITH GO-QML - main.qml - 1

main.qml

//assets/main.qml

import QtQuick 2.3 //Needed to import all base QML entities
import QtQuick.Controls 1.4 //Needed for ApplicationWindow and TextArea
import QtQuick.Layouts 1.0 //For the RowLayout

ApplicationWindow { //The base entity so we can set a toolbar later and the layout
    width: 640 //Default width
    height: 480 //Default height
    color: "#f1f1f1" //Background Color

    RowLayout { //To organize the TextAreas side by side
        width: parent.width //Set the width to the same width ApplicationWindow
        height: parent.height //Set the height to the ApplicationWindow height

        TextArea { //A large text area for the markdown text
            id: mdarea //Unique identifier for this TextArea
            Layout.alignment: Qt.AlignCenter //Suggest to align center in the Layout
            Layout.preferredWidth: (parent.width / 2) - 5;   // Suggest the width to be half the size of the parent RowLayout then subtract 5px for a little spacing
            Layout.preferredHeight: parent.height - 10 //Suggest the height to be the size of the parent RowLayout then subtract 10px for spacing
            text: "Markdown Text Area" //Set default text
        }

        TextArea { //A large text area for the rich text/HTML
            id: rtarea
            Layout.alignment: Qt.AlignCenter
            Layout.preferredWidth: (parent.width / 2) - 5
            Layout.preferredHeight: parent.height - 10
            textFormat: TextEdit.RichText //this sets the text in this TextArea to show formatted text like HTML so it will show the HTML as if it were a webpage
            text: "Rich Text / HTML Text Area"
        }
    }

}