Can anyone suggest how can we use multiple delegates and multiple models in same PathView in same qml?

My requirement is like when I double click on rectangle(id: myWin) I will get QDialog window (InterfacageQML.mouseClick())

It appears only when I double click on rectangle (id: rectImage)

Here is the MainForm.qml :

import QtQuick 2.6
import QtQuick.Controls 2.0 as QQC2
import Interfacage 1.0

Qt Code:
  1. Rectangle
  2. {
  3. id: big
  4. width: 800
  5. height: 800
  6. color: "white"
  7.  
  8.  
  9. Image
  10. {
  11. source: "pics/Resources/background_resize.jpg" //background
  12.  
  13.  
  14. ListModel
  15. {
  16. id: appModel2
  17. ListElement
  18. {
  19. icon : "pics/Resources/more.png"
  20. }
  21. }//ListModel2
  22.  
  23. Component
  24. {
  25. id: appDelegate2
  26. Item
  27. {
  28. width: 100
  29. height:100
  30. scale: PathView.iconScale2
  31. anchors.bottom: parent.bottom
  32. anchors.right: parent.right
  33.  
  34. Rectangle {
  35. width:130 ; height: 80
  36. id: myWin
  37. color: "transparent"
  38. anchors.bottom: parent.bottom
  39. anchors.right: parent.right
  40. Image
  41. {
  42. id: image1
  43. y: 30
  44.  
  45. anchors.centerIn: parent
  46. anchors.bottom: parent.bottom
  47. anchors.right: parent.right
  48. source: icon
  49.  
  50. MouseArea
  51. {
  52. anchors.fill: parent
  53.  
  54. onDoubleClicked:
  55. {
  56. InterfacageQML.mouseClick()
  57. }
  58.  
  59. }//MouseArea
  60.  
  61. }//image1
  62.  
  63.  
  64. }//myWin
  65. }//Item
  66. }//appDelegate2
  67.  
  68. PathView
  69. {
  70. id: view2
  71. anchors.fill: parent
  72. highlight: appHighlight
  73. preferredHighlightBegin: 0.5
  74. preferredHighlightEnd: 0.5
  75. focus: true
  76. model: appModel2
  77. delegate: appDelegate2
  78. path: Path
  79. {
  80. startX: 700
  81. startY: 200
  82. PathAttribute
  83. {
  84. name: "iconScale2"
  85. value: 0.8
  86. }
  87. PathQuad
  88. {
  89. x: 1620
  90. y: 310
  91. controlX: 700
  92. controlY: 310
  93. }
  94. }//Path
  95. }//PathView
  96.  
  97.  
  98.  
  99.  
  100. ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  101. ListModel
  102. {
  103. id: appModel
  104.  
  105. ListElement
  106. {
  107. name: "CONTROLEUR"
  108. icon: "pics/Resources/user.png"
  109. }
  110.  
  111. ListElement
  112. {
  113.  
  114. name: "CONTROLEUR QUALITE"
  115. icon: "pics/Resources/user.png"
  116. }
  117. ListElement
  118. {
  119.  
  120. name: "ADMINISTRATEUR"
  121. icon: "pics/Resources/user.png"
  122. }
  123. ListElement
  124. {
  125.  
  126. name: "CREATEUR"
  127. icon: "pics/Resources/user.png"
  128. }
  129.  
  130.  
  131. }//ListModel1
  132.  
  133. Component
  134. {
  135. id: appDelegate
  136.  
  137. Item
  138. {
  139. width: 100
  140. height:100
  141. scale: PathView.iconScale
  142.  
  143.  
  144. Rectangle
  145. {
  146. id: rectImage
  147. width: 400
  148. height: 500
  149. color: "lightsteelblue"
  150. //anchors.bottom: myIcon.background
  151. anchors.horizontalCenter: parent.horizontalCenter
  152.  
  153. Image
  154. {
  155. id: myIcon
  156. y: 20
  157. //anchors.centerIn: parent
  158. anchors.horizontalCenter: parent.horizontalCenter
  159. source: icon
  160.  
  161. }//Image
  162.  
  163. Text {
  164. anchors {
  165. bottom: parent.bottom
  166. horizontalCenter: parent.horizontalCenter
  167. centerIn: parent.centerIn
  168.  
  169. }
  170.  
  171. text: name
  172. color: "white"
  173. font.pointSize: 26
  174. }//Text
  175.  
  176. MouseArea
  177. {
  178. anchors.fill: parent
  179. onClicked: {
  180. view.currentIndex = index
  181. }
  182. onDoubleClicked:
  183. {
  184. InterfacageQML.mouseClick()
  185. }
  186. }//MouseArea
  187.  
  188. }//Rectangle
  189.  
  190. }//Item
  191. }//Component
  192.  
  193. PathView
  194. {
  195. id: view
  196. anchors.fill: parent
  197. highlight: appHighlight
  198. preferredHighlightBegin: 0.5
  199. preferredHighlightEnd: 0.5
  200. focus: true
  201. model: appModel
  202. delegate: appDelegate
  203. path: Path
  204. {
  205. startX: 500
  206. startY: 310
  207. PathAttribute
  208. {
  209. name: "iconScale"
  210. value: 0.8
  211. }
  212.  
  213.  
  214. PathQuad
  215. {
  216. x: 1620
  217. y: 310
  218. controlX: 700
  219. controlY: 310
  220. }
  221.  
  222. PathAttribute
  223. {
  224. name: "iconScale"
  225. value: 0.8
  226. }
  227.  
  228.  
  229. PathQuad
  230. {
  231. x: 488
  232. y: 310
  233. controlX: 10
  234. controlY: 310
  235. }
  236. PathAttribute
  237. {
  238. name: "iconScale"
  239. value: 0.8
  240. }
  241.  
  242. }//Path
  243. }//PathView
  244.  
  245. }//background Image
  246. }//Rectangle
To copy to clipboard, switch view to plain text mode