Commit 019f5a41 authored by Jörg Schummer's avatar Jörg Schummer Committed by Kai Koehne
Browse files

QmlDesigner.ItemLibrary: Qml code cleanup

parent 41159777
...@@ -32,14 +32,15 @@ import Qt 4.6 ...@@ -32,14 +32,15 @@ import Qt 4.6
Item { Item {
id: itemView id: itemView
property var style // public
width: GridView.view.cellWidth
height: style.cellHeight
signal itemPressed() signal itemPressed()
signal itemDragged() signal itemDragged()
// internal
ItemsViewStyle { id: style }
Rectangle { Rectangle {
anchors.top: parent.top anchors.top: parent.top
anchors.left: parent.left anchors.left: parent.left
...@@ -87,7 +88,7 @@ Item { ...@@ -87,7 +88,7 @@ Item {
id: itemIcon id: itemIcon
anchors.top: parent.top anchors.top: parent.top
anchors.topMargin: style.cellMargin anchors.topMargin: style.cellVerticalMargin
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
width: itemLibraryIconWidth width: itemLibraryIconWidth
...@@ -99,7 +100,7 @@ Item { ...@@ -99,7 +100,7 @@ Item {
id: text id: text
anchors.top: itemIcon.bottom anchors.top: itemIcon.bottom
anchors.topMargin: itemView.style.cellSpacing anchors.topMargin: style.cellVerticalSpacing
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
width: style.textWidth width: style.textWidth
height: style.textHeight height: style.textHeight
...@@ -107,9 +108,7 @@ Item { ...@@ -107,9 +108,7 @@ Item {
verticalAlignment: "AlignVCenter" verticalAlignment: "AlignVCenter"
horizontalAlignment: "AlignHCenter" horizontalAlignment: "AlignHCenter"
text: itemName text: itemName
// workaround: text color not updated when 'style' var finally assigned
color: style.itemNameTextColor color: style.itemNameTextColor
Component.onCompleted: text.color = style.itemNameTextColor
} }
MouseRegion { MouseRegion {
......
...@@ -29,62 +29,36 @@ ...@@ -29,62 +29,36 @@
import Qt 4.6 import Qt 4.6
/*
ListModel {
id: libraryModel
ListElement {
sectionTitle: "Section 1"
sectionEntries: [
ListElement { itemLibId: 0; itemName: "Comp"; itemIconPath: "../images/default-icon.png" },
...
]
}
...
}
*/
/* workaround: ListView reports bogus viewportHeight
ListView {
id: itemsView
property string name: "itemsFlickable"
anchors.fill: parent
interactive: false
model: itemsView.model
delegate: sectionDelegate
}
*/
Rectangle { Rectangle {
id: itemsView id: itemsView
signal itemSelected(int itemLibId) // public
signal itemDragged(int itemLibId)
function expandAll() { function expandAll() {
expandAllEntries(); expandAllEntries();
scrollbar.moveHandle(0, true) scrollbar.moveHandle(0, true)
} }
signal expandAllEntries() signal itemSelected(int itemLibId)
signal itemDragged(int itemLibId)
signal stopDragAndDrop
// internal
signal expandAllEntries
ItemsViewStyle { id: style }
property int entriesPerRow: Math.max(1, Math.floor((itemsFlickable.width - 2) / style.cellWidth)) property int entriesPerRow: Math.max(1, Math.floor((itemsFlickable.width - 2) / style.cellWidth))
property int cellWidth: Math.floor((itemsFlickable.width - 2) / entriesPerRow) property int cellWidth: Math.floor((itemsFlickable.width - 2) / entriesPerRow)
property int cellHeight: style.cellHeight property int cellHeight: style.cellHeight
property var style
style: ItemsViewStyle {}
color: style.backgroundColor color: style.backgroundColor
/* workaround: without this, a completed drag and drop operation would /* workaround: without this, a completed drag and drop operation would
result in the drag being continued when QmlView re-gains result in the drag being continued when QmlView re-gains
focus */ focus */
signal stopDragAndDrop
MouseRegion { MouseRegion {
anchors.fill: parent anchors.fill: parent
hoverEnabled: true hoverEnabled: true
...@@ -96,7 +70,6 @@ Rectangle { ...@@ -96,7 +70,6 @@ Rectangle {
SectionView { SectionView {
id: section id: section
style: itemsView.style
entriesPerRow: itemsView.entriesPerRow entriesPerRow: itemsView.entriesPerRow
cellWidth: itemsView.cellWidth cellWidth: itemsView.cellWidth
...@@ -108,10 +81,6 @@ Rectangle { ...@@ -108,10 +81,6 @@ Rectangle {
onItemSelected: itemsView.itemSelected(itemLibId) onItemSelected: itemsView.itemSelected(itemLibId)
onItemDragged: itemsView.itemDragged(itemLibId) onItemDragged: itemsView.itemDragged(itemLibId)
function focusSelection() {
itemSelection.focusSelection()
}
Connection { Connection {
sender: itemsView sender: itemsView
signal: "expandAllEntries()" signal: "expandAllEntries()"
...@@ -145,11 +114,9 @@ Rectangle { ...@@ -145,11 +114,9 @@ Rectangle {
Selector { Selector {
id: selector id: selector
z: -1 z: -1
style: itemsView.style flickable: itemsFlickable
scrollFlickable: itemsFlickable
onMoveScrollbarHandle: scrollbar.moveHandle(viewportPos, true)
width: itemsView.cellWidth width: itemsView.cellWidth
height: itemsView.cellHeight height: itemsView.cellHeight
...@@ -168,7 +135,6 @@ Rectangle { ...@@ -168,7 +135,6 @@ Rectangle {
anchors.right: parent.right anchors.right: parent.right
flickable: itemsFlickable flickable: itemsFlickable
style: itemsView.style
} }
} }
...@@ -40,27 +40,31 @@ Item { ...@@ -40,27 +40,31 @@ Item {
property string itemNameTextColor: "#FFFFFF" property string itemNameTextColor: "#FFFFFF"
property string sectionTitleTextColor: "#f0f0f0"
property string sectionTitleBackgroundColor: "#909090"
property string gridLineLighter: "#808080" property string gridLineLighter: "#808080"
property string gridLineDarker: "#606060" property string gridLineDarker: "#606060"
property string sectionArrowColor: "#aeaeae"
property string sectionTitleTextColor: "#f0f0f0"
property string sectionTitleBackgroundColor: "#909090"
property int sectionTitleHeight: 20 property int sectionTitleHeight: 20
property int sectionTitleSpacing: 2 property int sectionTitleSpacing: 2
// the selector's offset from the start of the section
property int selectionSectionOffset: sectionTitleHeight + sectionTitleSpacing property int selectionSectionOffset: sectionTitleHeight + sectionTitleSpacing
property int iconWidth: 32 property int iconWidth: 32
property int iconHeight: 32 property int iconHeight: 32
property int textWidth: 80 property int textWidth: 90
property int textHeight: 15 property int textHeight: 15
property int cellSpacing: 7 property int cellVerticalSpacing: 7
property int cellMargin: 10 property int cellVerticalMargin: 10
property int cellWidth: textWidth + 2*cellMargin // the following depend on the actual shape of the item delegate
property int cellHeight: itemLibraryIconHeight + textHeight + 2*cellMargin + cellSpacing property int cellWidth: textWidth
property int cellHeight: itemLibraryIconHeight + textHeight +
2 * cellVerticalMargin + cellVerticalSpacing
} }
...@@ -32,9 +32,14 @@ import Qt 4.6 ...@@ -32,9 +32,14 @@ import Qt 4.6
Item { Item {
id: bar id: bar
// public
property var flickable property var flickable
property var style
// internal
ItemsViewStyle { id: style }
property int scrollHeight: height - handle.height property int scrollHeight: height - handle.height
Rectangle { Rectangle {
...@@ -62,17 +67,6 @@ Item { ...@@ -62,17 +67,6 @@ Item {
function updateHandle() { function updateHandle() {
moveHandle(flickable.viewportY, false); moveHandle(flickable.viewportY, false);
} }
/*
NumberAnimation {
id: handleResetAnimation
target: handle
property: "y"
from: handle.y
to: 0
duration: 500
}
*/
onFlickableChanged: moveHandle(0, true) onFlickableChanged: moveHandle(0, true)
...@@ -101,11 +95,7 @@ Item { ...@@ -101,11 +95,7 @@ Item {
anchors.right: parent.right anchors.right: parent.right
anchors.top: parent.top anchors.top: parent.top
anchors.bottom: handle.top anchors.bottom: handle.top
onClicked: { onClicked: handle.y = Math.max(0, handle.y - style.scrollbarClickScrollAmount)
// handleMoveAnimation.to = Math.max(0, handle.y - 40)
// handleMoveAnimation.start();
handle.y = Math.max(0, handle.y - style.scrollbarClickScrollAmount)
}
} }
Item { Item {
...@@ -152,18 +142,6 @@ Item { ...@@ -152,18 +142,6 @@ Item {
anchors.right: parent.right anchors.right: parent.right
anchors.top: handle.bottom anchors.top: handle.bottom
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
onClicked: { onClicked: handle.y = Math.min(scrollHeight, handle.y + style.scrollbarClickScrollAmount)
// handleMoveAnimation.to = Math.min(scrollHeight, handle.y + 40)
// handleMoveAnimation.start();
handle.y = Math.min(scrollHeight, handle.y + style.scrollbarClickScrollAmount)
}
}
/*
NumberAnimation {
id: handleMoveAnimation
target: handle
property: "y"
duration: 200
} }
*/
} }
...@@ -32,26 +32,33 @@ import Qt 4.6 ...@@ -32,26 +32,33 @@ import Qt 4.6
Column { Column {
id: sectionView id: sectionView
property var style // public
property var itemHighlight property var itemHighlight
property int entriesPerRow property int entriesPerRow
property int cellWidth property int cellWidth
property int cellHeight property int cellHeight
signal itemSelected(int itemLibId)
signal itemDragged(int itemLibId)
function expand() { function expand() {
gridFrame.state = ""; gridFrame.state = "";
} }
signal itemSelected(int itemLibId)
signal itemDragged(int itemLibId)
// internal
ItemsViewStyle { id: style }
Component { Component {
id: itemDelegate id: itemDelegate
ItemView { ItemView {
id: item id: item
style: sectionView.style
width: cellWidth
height: cellHeight
function selectItem() { function selectItem() {
itemHighlight.select(sectionView, item, gridFrame.x, -gridView.viewportY); itemHighlight.select(sectionView, item, gridFrame.x, -gridView.viewportY);
...@@ -76,11 +83,11 @@ Column { ...@@ -76,11 +83,11 @@ Column {
Item { Item {
id: arrow id: arrow
Rectangle { y: 0; x: 0; height: 1; width: 9; color: "#aeaeae" } Rectangle { y: 0; x: 0; height: 1; width: 9; color: style.sectionArrowColor }
Rectangle { y: 1; x: 1; height: 1; width: 7; color: "#aeaeae" } Rectangle { y: 1; x: 1; height: 1; width: 7; color: style.sectionArrowColor }
Rectangle { y: 2; x: 2; height: 1; width: 5; color: "#aeaeae" } Rectangle { y: 2; x: 2; height: 1; width: 5; color: style.sectionArrowColor }
Rectangle { y: 3; x: 3; height: 1; width: 3; color: "#aeaeae" } Rectangle { y: 3; x: 3; height: 1; width: 3; color: style.sectionArrowColor }
Rectangle { y: 4; x: 4; height: 1; width: 1; color: "#aeaeae" } Rectangle { y: 4; x: 4; height: 1; width: 1; color: style.sectionArrowColor }
anchors.left: parent.left anchors.left: parent.left
anchors.leftMargin: 5 anchors.leftMargin: 5
...@@ -99,7 +106,6 @@ Column { ...@@ -99,7 +106,6 @@ Column {
text: sectionName text: sectionName
color: style.sectionTitleTextColor color: style.sectionTitleTextColor
Component.onCompleted: text.color = style.sectionTitleTextColor
} }
MouseRegion { MouseRegion {
anchors.fill: parent anchors.fill: parent
...@@ -109,7 +115,7 @@ Column { ...@@ -109,7 +115,7 @@ Column {
itemHighlight.unselect(); itemHighlight.unselect();
sectionView.itemSelected(-1); sectionView.itemSelected(-1);
} }
gridFrame.toggleVisibility() gridFrame.toggleExpanded()
} }
} }
} }
...@@ -119,18 +125,19 @@ Column { ...@@ -119,18 +125,19 @@ Column {
Item { Item {
id: gridFrame id: gridFrame
function toggleVisibility() { function toggleExpanded() {
state = ((state == "hidden")? "":"hidden") state = ((state == "")? "shrunk":"")
} }
clip: true clip: true
width: sectionView.entriesPerRow * sectionView.cellWidth + 1 width: entriesPerRow * cellWidth + 1
height: Math.ceil(sectionEntries.count / sectionView.entriesPerRow) * sectionView.cellHeight + 1 height: Math.ceil(sectionEntries.count / entriesPerRow) * cellHeight + 1
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
GridView { GridView {
id: gridView id: gridView
// workaround
Connection { Connection {
sender: itemLibraryModel sender: itemLibraryModel
signal: "visibilityUpdated()" signal: "visibilityUpdated()"
...@@ -151,7 +158,7 @@ Column { ...@@ -151,7 +158,7 @@ Column {
states: [ states: [
State { State {
name: "hidden" name: "shrunk"
PropertyChanges { PropertyChanges {
target: gridFrame target: gridFrame
height: 0 height: 0
...@@ -163,18 +170,7 @@ Column { ...@@ -163,18 +170,7 @@ Column {
} }
} }
] ]
/*
transitions: [
Transition {
NumberAnimation {
matchProperties: "x,y,width,height,opacity,rotation"
duration: 200
}
}
]
*/
} }
Item { height: 4; width: 1 } Item { height: 4; width: 1 }
} }
...@@ -32,11 +32,14 @@ import Qt 4.6 ...@@ -32,11 +32,14 @@ import Qt 4.6
Item { Item {
id: selector id: selector
property var style // public
property var scrollFlickable
property var flickable
signal moveScrollbarHandle(int viewportPos) // internal
ItemsViewStyle { id: style }
visible: false visible: false
property var section: null property var section: null
...@@ -44,123 +47,49 @@ Item { ...@@ -44,123 +47,49 @@ Item {
property int sectionXOffset: 0 property int sectionXOffset: 0
property int sectionYOffset: 0 property int sectionYOffset: 0
property real staticX: (section && item)? (section.x + item.x + sectionXOffset):0; x: (section && item)? (section.x + item.x + sectionXOffset):0;
property real staticY: (section && item)? (section.y + style.selectionSectionOffset + item.y + sectionYOffset):0; y: (section && item)? (section.y + style.selectionSectionOffset + item.y + sectionYOffset):0;
property bool animateMove: true
Connection { Connection {
sender: itemLibraryModel sender: itemLibraryModel
signal: "visibilityUpdated()" signal: "visibilityUpdated()"
script: selector.unselectNow() script: unselect()
} }
function select(section, item, sectionXOffset, sectionYOffset) { function select(section, item, sectionXOffset, sectionYOffset) {
if (!selector.visible) {
selector.animateMove = false
}
selector.item = item selector.item = item
selector.section = section