Using StackView for the main area to swap between edit and present

src/qml/main.qml

@@ -21,10 +21,6 @@ Kirigami.ApplicationWindow {
     width: 1800
     height: 900
 
-    Rectangle {
-
-    }
-
     Presenter.MainWindow {
         id: mainPage
     }

src/qml/presenter/MainWindow.qml

@@ -22,6 +22,8 @@ Controls.Page {
 
     property string dragSongTitle: ""
 
+    property bool editing: true
+
     property Item slideItem
     property var song
     property var draggedLibraryItem
@@ -56,21 +58,15 @@ Controls.Page {
                 Controls.SplitView.maximumWidth: 300
             }
             
-            Presenter.SongEditor {
-                id: songEditor
+            Controls.StackView {
+                id: mainPageArea
                 Controls.SplitView.fillHeight: true
                 Controls.SplitView.fillWidth: true
                 Controls.SplitView.preferredWidth: 700
                 Controls.SplitView.minimumWidth: 500
-            }
+                initialItem: presenterComp
                 
-            /* Presenter.Presentation { */
-            /*     id: presentation */
-            /*     Controls.SplitView.fillHeight: true */
-            /*     Controls.SplitView.fillWidth: true */
-            /*     Controls.SplitView.preferredWidth: 700 */
-            /*     Controls.SplitView.minimumWidth: 500 */
-            /* } */
+            }
 
             Presenter.Library {
                 id: library
@@ -82,6 +78,21 @@ Controls.Page {
         }
     }
 
+    Component {
+        id: songEditorComp
+        Presenter.SongEditor {
+            id: songEditor
+        }
+    }
+
+    Component {
+        id: presenterComp
+        Presenter.Presentation {
+            id: presentation
+        }
+    }
+
+
     Loader {
         id: presentLoader
         active: presenting

src/qml/presenter/Presentation.qml

@@ -46,22 +46,39 @@ Item {
             }
         }
 
-        Kirigami.Icon {
-            source: "arrow-left"
+        Item {
+            /* Layout.preferredHeight: 200 */
             Layout.fillHeight: true
             Layout.fillWidth: true
-            Layout.preferredWidth: 25
+            Layout.columnSpan: 3
+        }
+
+        Kirigami.Icon {
+            source: "arrow-left"
+            Layout.preferredWidth: 200
+            Layout.preferredHeight: 200
+            Layout.alignment: Qt.AlignRight
         }
 
         Presenter.Slide {
-            Layout.preferredWidth: 50
+            Layout.preferredWidth: 700
+            Layout.preferredHeight: 500
+            Layout.alignment: Qt.AlignCenter
         }
 
         Kirigami.Icon {
             source: "arrow-right"
+            Layout.preferredWidth: 200
+            Layout.preferredHeight: 200
+            Layout.alignment: Qt.AlignLeft
+        }
+
+        Item {
+            /* Layout.preferredHeight: 200 */
             Layout.fillHeight: true
             Layout.fillWidth: true
-            Layout.preferredWidth: 25
+            Layout.columnSpan: 3
         }
+
     }
 }

src/qml/presenter/Slide.qml

@@ -10,7 +10,6 @@ import mpv 1.0
 
 Item {
     id: root
-    anchors.fill: parent
 
     // Let's make this slide editable
     property bool editMode: false

src/qml/presenter/SongEditor.qml

@@ -26,7 +26,7 @@ Item {
                     model: Qt.fontFamilies()
                     implicitWidth: 300
                     editable: true
-                    onCurrentIndexChanged: showPassiveNotification(currentText)
+                    onCurrentTextChanged: showPassiveNotification(currentText)
                 }
                 Controls.SpinBox {
                     editable: true