PDA

View Full Version : multiple delegates and multiple models use in same list view in same qml



oumayma
20th December 2017, 14:24
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


Rectangle
{
id: big
width: 800
height: 800
color: "white"


Image
{
source: "pics/Resources/background_resize.jpg" //background


ListModel
{
id: appModel2
ListElement
{
icon : "pics/Resources/more.png"
}
}//ListModel2

Component
{
id: appDelegate2
Item
{
width: 100
height:100
scale: PathView.iconScale2
anchors.bottom: parent.bottom
anchors.right: parent.right

Rectangle {
width:130 ; height: 80
id: myWin
color: "transparent"
anchors.bottom: parent.bottom
anchors.right: parent.right
Image
{
id: image1
y: 30

anchors.centerIn: parent
anchors.bottom: parent.bottom
anchors.right: parent.right
source: icon

MouseArea
{
anchors.fill: parent

onDoubleClicked:
{
InterfacageQML.mouseClick()
}

}//MouseArea

}//image1


}//myWin
}//Item
}//appDelegate2

PathView
{
id: view2
anchors.fill: parent
highlight: appHighlight
preferredHighlightBegin: 0.5
preferredHighlightEnd: 0.5
focus: true
model: appModel2
delegate: appDelegate2
path: Path
{
startX: 700
startY: 200
PathAttribute
{
name: "iconScale2"
value: 0.8
}
PathQuad
{
x: 1620
y: 310
controlX: 700
controlY: 310
}
}//Path
}//PathView




///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
ListModel
{
id: appModel

ListElement
{
name: "CONTROLEUR"
icon: "pics/Resources/user.png"
}

ListElement
{

name: "CONTROLEUR QUALITE"
icon: "pics/Resources/user.png"
}
ListElement
{

name: "ADMINISTRATEUR"
icon: "pics/Resources/user.png"
}
ListElement
{

name: "CREATEUR"
icon: "pics/Resources/user.png"
}


}//ListModel1

Component
{
id: appDelegate

Item
{
width: 100
height:100
scale: PathView.iconScale


Rectangle
{
id: rectImage
width: 400
height: 500
color: "lightsteelblue"
//anchors.bottom: myIcon.background
anchors.horizontalCenter: parent.horizontalCenter

Image
{
id: myIcon
y: 20
//anchors.centerIn: parent
anchors.horizontalCenter: parent.horizontalCenter
source: icon

}//Image

Text {
anchors {
bottom: parent.bottom
horizontalCenter: parent.horizontalCenter
centerIn: parent.centerIn

}

text: name
color: "white"
font.pointSize: 26
}//Text

MouseArea
{
anchors.fill: parent
onClicked: {
view.currentIndex = index
}
onDoubleClicked:
{
InterfacageQML.mouseClick()
}
}//MouseArea

}//Rectangle

}//Item
}//Component

PathView
{
id: view
anchors.fill: parent
highlight: appHighlight
preferredHighlightBegin: 0.5
preferredHighlightEnd: 0.5
focus: true
model: appModel
delegate: appDelegate
path: Path
{
startX: 500
startY: 310
PathAttribute
{
name: "iconScale"
value: 0.8
}


PathQuad
{
x: 1620
y: 310
controlX: 700
controlY: 310
}

PathAttribute
{
name: "iconScale"
value: 0.8
}


PathQuad
{
x: 488
y: 310
controlX: 10
controlY: 310
}
PathAttribute
{
name: "iconScale"
value: 0.8
}

}//Path
}//PathView

}//background Image
}//Rectangle