Browse Source

-Bug fix: get first item of list in setSelectedIndex function.

-Putting qsTr for all user-visible strings.
cl-refactor
Ali Mashatan 10 years ago
parent
commit
ed62ee21f3
  1. 187
      mix/qml/StatesComboBox.qml

187
mix/qml/StatesComboBox.qml

@ -28,22 +28,20 @@ import QtGraphicalEffects 1.0
Rectangle { Rectangle {
id: statesComboBox id: statesComboBox
width: 200; width: 200
height: 20; height: 20
Component.onCompleted: Component.onCompleted: {
{ var top = dropDownList
var top = dropDownList; while (top.parent) {
while (top.parent)
{
top = top.parent top = top.parent
if (top.objectName == "debugPanel") if (top.objectName == "debugPanel")
break; break
} }
var coordinates = dropDownList.mapToItem(top, 0, 0) var coordinates = dropDownList.mapToItem(top, 0, 0)
//the order is important //the order is important
dropDownShowdowList.parent = top; dropDownShowdowList.parent = top
dropDownList.parent = top; dropDownList.parent = top
dropDownShowdowList.x = coordinates.x dropDownShowdowList.x = coordinates.x
dropDownShowdowList.y = coordinates.y dropDownShowdowList.y = coordinates.y
@ -52,43 +50,42 @@ Rectangle {
dropDownList.y = coordinates.y dropDownList.y = coordinates.y
} }
signal selectItem(real item); signal selectItem(real item)
signal editItem(real item); signal editItem(real item)
signal selectCreate(); signal selectCreate
property variant rowHeight:25; property variant rowHeight: 25
property variant items; property variant items
readonly property alias selectedItem: chosenItemText.text; property alias selectedItem: chosenItemText.text
readonly property alias selectedIndex: listView.currentRow; property alias selectedIndex: listView.currentRow
function setSelectedIndex(index) function setSelectedIndex(index) {
{ listView.currentRow = index
listView.currentRow = index; chosenItemText.text = statesComboBox.items.get(index).title
chosenItemText.text = statesComboBox.items.get(0).title;
} }
signal comboClicked; signal comboClicked
property variant colorItem; property variant colorItem
property variant colorSelect; property variant colorSelect
smooth:true; smooth: true
Rectangle { Rectangle {
id: chosenItem id: chosenItem
width: parent.width; width: parent.width
height: statesComboBox.height; height: statesComboBox.height
color: statesComboBox.color; color: statesComboBox.color
smooth: true; smooth: true
Text { Text {
id: chosenItemText id: chosenItemText
anchors.top: parent.top; anchors.top: parent.top
anchors.left: parent.left; anchors.left: parent.left
anchors.margins: 2; anchors.margins: 2
color: statesComboBox.colorItem; color: statesComboBox.colorItem
text: "" text: ""
smooth: true smooth: true
} }
MouseArea { MouseArea {
anchors.fill: parent; anchors.fill: parent
onClicked: { onClicked: {
statesComboBox.state = statesComboBox.state === "dropDown" ? "" : "dropDown" statesComboBox.state = statesComboBox.state === "dropDown" ? "" : "dropDown"
} }
@ -97,99 +94,101 @@ Rectangle {
Rectangle { Rectangle {
id: dropDownShowdowList id: dropDownShowdowList
width: statesComboBox.width; width: statesComboBox.width
opacity: 0.3 opacity: 0.3
height: 0; height: 0
clip: true; clip: true
radius: 4; radius: 4
anchors.top: chosenItem.top; anchors.top: chosenItem.top
anchors.margins: 2; anchors.margins: 2
color: "gray" color: "gray"
} }
//ToDo: We need scrollbar for items //ToDo: We need scrollbar for items
Rectangle { Rectangle {
id: dropDownList id: dropDownList
width: statesComboBox.width; width: statesComboBox.width
height: 0; height: 0
clip: true; clip: true
radius: 4; radius: 4
anchors.top: chosenItem.top; anchors.top: chosenItem.top
anchors.margins: 2; anchors.margins: 2
color: statesComboBox.color color: statesComboBox.color
ColumnLayout { ColumnLayout {
spacing: 2 spacing: 2
TableView { TableView {
id: listView id: listView
height: 20; height: 20
implicitHeight: 0 implicitHeight: 0
width: statesComboBox.width; width: statesComboBox.width
model: statesComboBox.items model: statesComboBox.items
horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff; horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff
currentRow: -1 currentRow: -1
headerVisible: false; headerVisible: false
backgroundVisible: false backgroundVisible: false
alternatingRowColors : false; alternatingRowColors: false
frameVisible: false frameVisible: false
TableViewColumn { TableViewColumn {
role: "title" role: "title"
title: "" title: ""
width: statesComboBox.width; width: statesComboBox.width
delegate: mainItemDelegate delegate: mainItemDelegate
} }
rowDelegate: Rectangle { rowDelegate: Rectangle {
width: statesComboBox.width; width: statesComboBox.width
height: statesComboBox.rowHeight; height: statesComboBox.rowHeight
} }
Component { Component {
id: mainItemDelegate id: mainItemDelegate
Rectangle { Rectangle {
id: itemDelegate id: itemDelegate
width: statesComboBox.width; width: statesComboBox.width
height: statesComboBox.height; height: statesComboBox.height
Text { Text {
id: textItemid id: textItemid
text: styleData.value text: styleData.value
color: statesComboBox.colorItem; color: statesComboBox.colorItem
anchors.top: parent.top; anchors.top: parent.top
anchors.left: parent.left; anchors.left: parent.left
anchors.margins: 5; anchors.margins: 5
} }
Image { Image {
id: imageItemid id: imageItemid
height: 20 height: 20
width: 20; width: 20
anchors.right: parent.right anchors.right: parent.right
anchors.top: parent.top; anchors.top: parent.top
anchors.margins: 5; anchors.margins: 5
visible: false; visible: false
fillMode: Image.PreserveAspectFit fillMode: Image.PreserveAspectFit
source: "img/edit_combox.png" source: "img/edit_combox.png"
} }
MouseArea { MouseArea {
anchors.fill: parent; anchors.fill: parent
hoverEnabled: true hoverEnabled: true
onEntered: { onEntered: {
imageItemid.visible = true; imageItemid.visible = true
textItemid.color = statesComboBox.colorSelect; textItemid.color = statesComboBox.colorSelect
} }
onExited: { onExited: {
imageItemid.visible = false; imageItemid.visible = false
textItemid.color = statesComboBox.colorItem; textItemid.color = statesComboBox.colorItem
} }
onClicked: { onClicked: {
if (mouseX > imageItemid.x && mouseX < imageItemid.x+ imageItemid.width if (mouseX > imageItemid.x
&& mouseY > imageItemid.y && mouseY < imageItemid.y+ imageItemid.height) && mouseX < imageItemid.x + imageItemid.width
statesComboBox.editItem(styleData.row); && mouseY > imageItemid.y
&& mouseY < imageItemid.y + imageItemid.height)
statesComboBox.editItem(styleData.row)
else { else {
statesComboBox.state = "" statesComboBox.state = ""
var prevSelection = chosenItemText.text var prevSelection = chosenItemText.text
chosenItemText.text = styleData.value chosenItemText.text = styleData.value
listView.currentRow = styleData.row; listView.currentRow = styleData.row
statesComboBox.selectItem(styleData.row); statesComboBox.selectItem(styleData.row)
} }
} }
} }
@ -203,36 +202,44 @@ Rectangle {
} }
Text { Text {
id: createStateText id: createStateText
width: statesComboBox.width; width: statesComboBox.width
height: statesComboBox.height; height: statesComboBox.height
font.bold: true font.bold: true
text: "Create State ..." text: qsTr("Create State ...")
MouseArea MouseArea {
{ anchors.fill: parent
anchors.fill: parent;
hoverEnabled: true hoverEnabled: true
onEntered: { onEntered: {
createStateText.color = statesComboBox.colorSelect; createStateText.color = statesComboBox.colorSelect
} }
onExited: { onExited: {
createStateText.color = statesComboBox.colorItem; createStateText.color = statesComboBox.colorItem
} }
onClicked: { onClicked: {
statesComboBox.state = "" statesComboBox.state = ""
statesComboBox.selectCreate(); statesComboBox.selectCreate()
} }
} }
} }
} }
} }
} }
states: State { states: State {
name: "dropDown"; name: "dropDown"
PropertyChanges { target: dropDownList; height: (statesComboBox.rowHeight*(statesComboBox.items.count+1)) } PropertyChanges {
PropertyChanges { target: dropDownShowdowList; width: statesComboBox.width+3; height: (statesComboBox.rowHeight*(statesComboBox.items.count+1))+3 } target: dropDownList
PropertyChanges { target: listView; height: 20; implicitHeight: (statesComboBox.rowHeight*(statesComboBox.items.count)) } height: (statesComboBox.rowHeight * (statesComboBox.items.count + 1))
}
PropertyChanges {
target: dropDownShowdowList
width: statesComboBox.width + 3
height: (statesComboBox.rowHeight * (statesComboBox.items.count + 1)) + 3
}
PropertyChanges {
target: listView
height: 20
implicitHeight: (statesComboBox.rowHeight * (statesComboBox.items.count))
}
} }
} }

Loading…
Cancel
Save