diff --git a/src/qml/presenter/LeftDock.qml b/src/qml/presenter/LeftDock.qml index 161b69b..5256013 100644 --- a/src/qml/presenter/LeftDock.qml +++ b/src/qml/presenter/LeftDock.qml @@ -9,21 +9,32 @@ import org.kde.kirigami 2.13 as Kirigami ColumnLayout { id: root - Layout.fillHeight: true - - Kirigami.Heading { - id: serviceTitle - text: "Service List" - level: 1 - Layout.alignment: Qt.AlignHCenter + + Rectangle { + id: headerBackground + color: Kirigami.Theme.backgroundColor + height: 40 + opacity: 1.0 + Layout.fillWidth: true + + Kirigami.Heading { + id: serviceTitle + text: "Service List" + anchors.centerIn: headerBackground + padding: 5 + level: 3 + } } - + ListView { id: serviceItemList + Layout.fillWidth: true + Layout.fillHeight: true model: listModel delegate: itemDelegate - /* flickDeceleration: 2000 */ - + clip: true + spacing: 2 + Component { id: itemDelegate Kirigami.BasicListItem { @@ -49,81 +60,81 @@ ColumnLayout { anchors.leftMargin: 10 active: hovered || pressed } - } - - ListModel { - id: listModel - ListElement { - itemName: "10,000 Reason" - type: "song" - } - ListElement { - itemName: "Marvelous Light" - type: "song" - } - ListElement { - itemName: "10 reason to use church presenter" - type: "video" - } - ListElement { - itemName: "10,000 Reason" - type: "song" - } - ListElement { - itemName: "Marvelous Light" - type: "song" - } - ListElement { - itemName: "10 reason to use church presenter" - type: "video" - } - ListElement { - itemName: "10,000 Reason" - type: "song" - } - ListElement { - itemName: "Marvelous Light" - type: "song" - } - ListElement { - itemName: "10 reason to use church presenter" - type: "video" - } - ListElement { - itemName: "10,000 Reason" - type: "song" - } - ListElement { - itemName: "Marvelous Light" - type: "song" - } - ListElement { - itemName: "10 reason to use church presenter" - type: "video" - } - ListElement { - itemName: "10,000 Reason" - type: "song" - } - ListElement { - itemName: "Marvelous Light" - type: "song" - } - ListElement { - itemName: "10 reason to use church presenter" - type: "video" - } - ListElement { - itemName: "10,000 Reason" - type: "song" - } - ListElement { - itemName: "Marvelous Light" - type: "song" - } - ListElement { - itemName: "10 reason to use church presenter" - type: "video" - } - } + ListModel { + id: listModel + ListElement { + itemName: "10,000 Reason" + type: "song" + } + ListElement { + itemName: "Marvelous Light" + type: "song" + } + ListElement { + itemName: "10 reason to use church presenter" + type: "video" + } + ListElement { + itemName: "10,000 Reason" + type: "song" + } + ListElement { + itemName: "Marvelous Light" + type: "song" + } + ListElement { + itemName: "10 reason to use church presenter" + type: "video" + } + ListElement { + itemName: "10,000 Reason" + type: "song" + } + ListElement { + itemName: "Marvelous Light" + type: "song" + } + ListElement { + itemName: "10 reason to use church presenter" + type: "video" + } + ListElement { + itemName: "10,000 Reason" + type: "song" + } + ListElement { + itemName: "Marvelous Light" + type: "song" + } + ListElement { + itemName: "10 reason to use church presenter" + type: "video" + } + ListElement { + itemName: "10,000 Reason" + type: "song" + } + ListElement { + itemName: "Marvelous Light" + type: "song" + } + ListElement { + itemName: "10 reason to use church presenter" + type: "video" + } + ListElement { + itemName: "10,000 Reason" + type: "song" + } + ListElement { + itemName: "Marvelous Light" + type: "song" + } + ListElement { + itemName: "10 reason to use church presenter" + type: "video" + } + } + } } + diff --git a/src/qml/presenter/MainWindow.qml b/src/qml/presenter/MainWindow.qml index eb75b84..6cb9225 100644 --- a/src/qml/presenter/MainWindow.qml +++ b/src/qml/presenter/MainWindow.qml @@ -16,7 +16,6 @@ Controls.Page { Item { id: mainItem anchors.fill: parent - height: parent.height Controls.SplitView { id: splitMainView @@ -40,9 +39,8 @@ Controls.Page { Controls.SplitView.preferredWidth: 200 } - Rectangle { + Presenter.SongEditor { id: rightMainArea - color: "red" Controls.SplitView.fillHeight: true Controls.SplitView.fillWidth: true Controls.SplitView.preferredWidth: 700 diff --git a/src/qml/presenter/SongEditor.qml b/src/qml/presenter/SongEditor.qml new file mode 100644 index 0000000..abea756 --- /dev/null +++ b/src/qml/presenter/SongEditor.qml @@ -0,0 +1,83 @@ +import QtQuick 2.13 +import QtQuick.Dialogs 1.0 +import QtQuick.Controls 2.15 as Controls +import QtQuick.Window 2.13 +import QtQuick.Layouts 1.2 +import QtMultimedia 5.15 +import QtAudioEngine 1.15 +import org.kde.kirigami 2.13 as Kirigami +import "./" as Presenter + +Item { + id: root + + GridLayout { + id: mainLayout + columns: 2 + rowSpacing: 5 + columnSpacing: 20 + + Controls.ToolBar { + Layout.columnSpan: 2 + id: toolbar + RowLayout { + anchors.fill: parent + + Controls.ComboBox { + model: ["VictorMono", "Calibri", "Arial", "Quicksand"] + } + Controls.SpinBox { + editable: true + from: 5 + to: 72 + } + Controls.ComboBox { + model: ["Left", "Center", "Right", "Justify"] + implicitWidth: 100 + } + Controls.ToolButton { + text: "B" + } + Controls.ToolButton { + text: "I" + } + Controls.ToolButton { + text: "U" + } + Controls.ToolSeparator {} + Controls.ToolButton { + text: "Effects" + } + } + } + + Controls.TextField { + implicitWidth: 300 + Layout.leftMargin: 20 + } + + Rectangle { + color: "red" + implicitWidth: 400 + implicitHeight: 10 + Layout.rightMargin: 20 + } + + Controls.TextArea { + implicitWidth: 300 + implicitHeight: 500 + Layout.bottomMargin: 30 + Layout.leftMargin: 20 + placeholderText: "Put lyrics here..." + } + + Rectangle { + color: "red" + implicitWidth: 400 + implicitHeight: 500 + Layout.bottomMargin: 30 + Layout.rightMargin: 20 + } + } + +} diff --git a/src/resources.qrc b/src/resources.qrc index c7d82e3..965d502 100644 --- a/src/resources.qrc +++ b/src/resources.qrc @@ -10,5 +10,6 @@ qml/presenter/Header.qml qml/presenter/Actions.qml qml/presenter/PanelItem.qml + qml/presenter/SongEditor.qml