Better way for initializing base dialog item delegates

src/qml/about/TaboutNootka.qml

@@ -25,26 +25,23 @@ import "fakeTrans.js" as Fake
 
 
 Dialog {
-  title: qsTr("About Nootka")
   visible: true
+  title: qsTr("About Nootka")
 //  width: pages.width; height: pages.height
 
   width: nootkaWindow.width * 0.75; height: nootkaWindow.height * 0.75
 
-  PagesDialog {
-    id: pages
-    anchors.fill: parent
-    model: ListModel { id: pageModel }
-    Component.onCompleted: {
-      pageModel.append({"iconName": "nootka-frame", "buttonText": qsTr("About"), "page": "About"})
-      pageModel.append({"iconName": "help-frame", "buttonText": Fake.tr("QShortcut", "Help"), "page": "Help"})
-      pageModel.append({"iconName": "author", "buttonText": qsTr("Authors"), "page": "Authors"})
-      pageModel.append({"iconName": "license", "buttonText": qsTr("License"), "page": "License"})
-      pageModel.append({"iconName": "support", "buttonText": qsTr("Support"), "page": "Support"})
-      pageModel.append({"iconName": "donors", "buttonText": qsTr("Donors", "Would be 'Sponsors' or even 'Backers' - translate as such as You fill, what sounds/looks better in Your language"), "page": "Donors"})
-      pageModel.append({"iconName": "chlog", "buttonText": qsTr("Changes"), "page": "Changes"})
-      pageModel.append({"iconName": "qt", "buttonText": "Qt", "page": "Qt"})
-    }
+  PagesDialog { id: pages }
+
+  Component.onCompleted: {
+    pages.addItem("nootka-frame", qsTr("About"), "About")
+    pages.addItem("help-frame", Fake.tr("QShortcut", "Help"), "Help")
+    pages.addItem("author", qsTr("Authors"), "Authors")
+    pages.addItem("license", qsTr("License"), "License")
+    pages.addItem("support", qsTr("Support"), "Support")
+    pages.addItem("donors", qsTr("Donors", "Would be 'Sponsors' or even 'Backers' - translate as such as You fill, what sounds/looks better in Your language"), "Donors")
+    pages.addItem("chlog", qsTr("Changes"), "Changes")
+    pages.addItem("qt", "Qt", "Qt")
   }
 
 }

src/qml/settings/TsettingsDialog.qml

@@ -21,29 +21,24 @@ import QtQuick.Controls 2.0
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.3
 
-import "fakeTrans.js" as Fake
-
 
 Dialog {
-  title: "Nootka - " + qsTr("application's settings")
   visible: true
+  width: nootkaWindow.width * 0.75; height: nootkaWindow.height * 0.75
+
+  title: "Nootka - " + qsTr("application's settings")
 //  width: pages.width; height: pages.height
 
-  width: nootkaWindow.width * 0.75; height: nootkaWindow.height * 0.75
+  PagesDialog { id: pages }
+  standardButtons: StandardButton.Apply | StandardButton.Cancel | StandardButton.RestoreDefaults | StandardButton.Help
 
-  PagesDialog {
-    id: pages
-    anchors.fill: parent
-    model: ListModel { id: pageModel }
-    Component.onCompleted: {
-      pageModel.append({"iconName": "global", "buttonText": qsTr("Common"), "page": "Common"})
-      pageModel.append({"iconName": "scoreSettings", "buttonText": "Score", "page": "Score"})
-      pageModel.append({"iconName": "guitarSettings", "buttonText": qsTr("Instrument"), "page": "Instrument"})
-      pageModel.append({"iconName": "soundSettings", "buttonText": qsTr("Sound"), "page": "Sound"})
-      pageModel.append({"iconName": "questionsSettings", "buttonText": qsTr("Exercises") + "\n& " + qsTr("Exam"), "page": "Exam"})
-      pageModel.append({"iconName": "appearance", "buttonText": qsTr("Appearance"), "page": "Appearance"})
-    }
+  Component.onCompleted: {
+    pages.addItem("global", qsTr("Common"), "Common")
+    pages.addItem("scoreSettings", "Score", "Score")
+    pages.addItem("guitarSettings", qsTr("Instrument"), "Instrument")
+    pages.addItem("soundSettings", qsTr("Sound"), "Sound")
+    pages.addItem("questionsSettings", qsTr("Exercises") + "\n& " + qsTr("Exam"), "Exam")
+    pages.addItem("appearance", qsTr("Appearance"), "Appearance")
   }
-  standardButtons: StandardButton.Apply | StandardButton.Cancel | StandardButton.RestoreDefaults | StandardButton.Help
 
 }

src/qml/shared/PagesDialog.qml

@@ -29,8 +29,10 @@ import QtQuick.Window 2.0
  */
 Item {
 
-  property alias model: navList.model
   property alias stack: stack
+  property alias model: navList.model
+
+  anchors.fill: parent
 
   Rectangle { color: activPal.base; x: navList.x; y: navList.y; width: navList.width; height: navList.height }
   Rectangle { // highlight
@@ -40,6 +42,11 @@ Item {
     Behavior on y { enabled: GLOB.useAnimations; SpringAnimation { spring: 2; damping: 0.1; duration: 500 }}
   }
 
+  function addItem(icon, text, page) {
+    navList.pages.push("qrc:/" + page + "Page.qml")
+    model.append({ "iconName": icon, "buttonText": text })
+  }
+
   Row {
     anchors { fill: parent }
     spacing: Screen.pixelDensity * 2
@@ -54,6 +61,8 @@ Item {
       property HeadButton prevButt: null
       property int prevDelegate: -1
 
+      model: ListModel { id: pageModel }
+
       delegate: Component {
         HeadButton {
           id: delegateButt
@@ -77,7 +86,6 @@ Item {
             if (index === navList.prevDelegate) // workaround to avoid loading delegate twice
               return
             navList.prevDelegate = index
-            navList.pages.push("qrc:/" + page + "Page.qml")
             var w = Math.max(navList.width, width)
             navList.width = w
             butHigh.width = w
@@ -90,7 +98,7 @@ Item {
               butHigh.y =  delegateButt.y
               butHigh.width = delegateButt.width
               butHigh.height = delegateButt.height
-              stack.push("qrc:/" + page + "Page.qml")
+              stack.push(navList.pages[0])
               navList.pages[0] = stack.currentItem
             }
           }
@@ -112,8 +120,8 @@ Item {
       width: parent.width - navList.width - Screen.pixelDensity * 2
       height: parent.height
       // fade animations
-      pushEnter: Transition { PropertyAnimation { property: "opacity"; from: 0; to: 1; duration: 300 }}
-      pushExit: Transition { PropertyAnimation { property: "opacity"; from: 1; to: 0; duration: 300 }}
+      pushEnter: Transition { enabled: GLOB.useAnimations; PropertyAnimation { property: "opacity"; from: 0; to: 1; duration: 300 }}
+      pushExit: Transition { enabled: GLOB.useAnimations; PropertyAnimation { property: "opacity"; from: 1; to: 0; duration: 300 }}
     }
   }
 }