dashboard + few tipitem fix + shortcuts

This commit is contained in:
marcin
2014-07-09 16:18:48 +02:00
parent 202da4caf9
commit 92c594ca8c
24 changed files with 494 additions and 39 deletions

View File

@@ -0,0 +1,98 @@
import QtQuick 2.0
ListView {
id: listView
clip: true
boundsBehavior: ListView.StopAtBounds
delegate: Rectangle {
id: delegate
height: 64
width: listView.width
color: index % 2 ? "#F8F8F8" : "#FFFFFF"
StandardButton {
id: goToTransferButton
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
width: 37
anchors.leftMargin: 3
shadowColor: "#FF4304"
releasedColor: "#FF6C3C"
pressedColor: "#FF4304"
icon: "../images/goToTransferIcon.png"
}
StandardButton {
id: removeButton
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
width: 37
anchors.rightMargin: 3
shadowColor: "#DBDBDB"
releasedColor: "#F0EEEE"
pressedColor: "#DBDBDB"
icon: "../images/deleteIcon.png"
}
Row {
anchors.left: goToTransferButton.right
anchors.right: removeButton.left
anchors.leftMargin: 12
anchors.top: goToTransferButton.top
anchors.topMargin: -2
Text {
id: paymentIdText
anchors.top: parent.top
width: text.length ? 122 : 0
font.family: "Arial"
font.bold: true
font.pixelSize: 19
color: "#444444"
elide: Text.ElideRight
text: paymentId
}
Item { //separator
width: paymentIdText.width ? 12 : 0
height: 14
}
Text {
anchors.bottom: paymentIdText.bottom
width: parent.width - x - 12
elide: Text.ElideRight
font.family: "Arial"
font.pixelSize: 14
color: "#545454"
text: description
}
}
Text {
anchors.top: description.length === 0 && paymentId.length === 0 ? goToTransferButton.top : undefined
anchors.bottom: description.length === 0 && paymentId.length === 0 ? undefined : goToTransferButton.bottom
anchors.topMargin: -2
anchors.bottomMargin: -2
anchors.left: goToTransferButton.right
anchors.right: removeButton.left
anchors.rightMargin: 12
anchors.leftMargin: 12
elide: Text.ElideRight
font.family: "Arial"
font.pixelSize: 14
color: "#545454"
text: address
}
Rectangle {
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
height: 1
color: "#DBDBDB"
}
}
}

View File

@@ -59,7 +59,7 @@ ListView {
font.family: "Arial"
font.pixelSize: 14
color: "#545454"
text: address
text: description.length > 0 ? description : address
}
}

View File

@@ -1,8 +1,10 @@
import QtQuick 2.0
Item {
id: item
property alias text: label.text
property alias color: label.color
property string tipText: ""
property int fontSize: 12
width: icon.x + icon.width
height: icon.height
@@ -25,4 +27,24 @@ Item {
source: "../images/whatIsIcon.png"
visible: appWindow.whatIsEnable
}
MouseArea {
anchors.fill: icon
enabled: appWindow.whatIsEnable
hoverEnabled: true
onEntered: {
icon.visible = false
var pos = rootItem.mapFromItem(icon, 0, -15)
tipItem.text = item.tipText
tipItem.x = pos.x
if(tipItem.height > 30)
pos.y -= tipItem.height - 28
tipItem.y = pos.y
tipItem.visible = true
}
onExited: {
icon.visible = true
tipItem.visible = false
}
}
}

View File

@@ -22,7 +22,7 @@ Item {
Input {
id: input
anchors.fill: parent
anchors.leftMargin: 11
anchors.rightMargin: 11
anchors.leftMargin: 4
anchors.rightMargin: 4
}
}

29
components/Scroll.qml Normal file
View File

@@ -0,0 +1,29 @@
import QtQuick 2.0
Rectangle {
property var flickable
property int yPos: 0
function flickableContentYChanged() {
if(flickable === undefined)
return
var t = flickable.height - height
y = (flickable.contentY / (flickable.contentHeight - flickable.height)) * t + yPos
}
width: 12
height: {
var t = (flickable.height * flickable.height) / flickable.contentHeight
return t < 20 ? 20 : t
}
z: 1; y: yPos
color: "#DBDBDB"
anchors.right: flickable.right
opacity: flickable.moving ? 0.5 : 0
visible: flickable.contentHeight > flickable.height
Behavior on opacity {
NumberAnimation { duration: 100; easing.type: Easing.InQuad }
}
}

View File

@@ -47,6 +47,19 @@ Item {
anchors.right: button.left
width: 154
function hide() { droplist.height = 0 }
function containsPoint(px, py) {
if(px < 0)
return false
if(px > width)
return false
if(py < 0)
return false
if(py > height + droplist.height)
return false
return true
}
Row {
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
@@ -81,7 +94,14 @@ Item {
MouseArea {
anchors.fill: parent
onClicked: droplist.height = droplist.height === 0 ? dropcolumn.height : 0
onClicked: {
if(droplist.height === 0) {
appWindow.currentItem = dropdown
droplist.height = dropcolumn.height
} else {
droplist.height = 0
}
}
}
}

View File

@@ -5,6 +5,7 @@ Item {
property string shadowColor
property string pressedColor
property string releasedColor
property string icon: ""
property string textColor: "#FFFFFF"
property alias text: label.text
signal clicked()
@@ -36,6 +37,13 @@ Item {
elide: Text.ElideRight
font.pixelSize: 12
color: parent.textColor
visible: parent.icon === ""
}
Image {
anchors.centerIn: parent
visible: parent.icon !== ""
source: parent.icon
}
MouseArea {

View File

@@ -4,25 +4,40 @@ Item {
id: dropdown
property bool expanded: false
signal collapsed()
signal optionClicked(int index)
width: 72
height: 37
onExpandedChanged: if(expanded) appWindow.currentItem = dropdown
function hide() { dropdown.expanded = false }
function containsPoint(px, py) {
if(px < 0)
return false
if(px > width)
return false
if(py < 0)
return false
if(py > height + dropArea.height)
return false
return true
}
Item {
id: head
anchors.fill: parent
Rectangle {
anchors.fill: parent
anchors.topMargin: dropdown.expanded ? 0 : 1
anchors.topMargin: dropdown.expanded || dropArea.height > 0 ? 0 : 1
radius: 3
color: dropdown.expanded ? "#888888" : "#DBDBDB"
color: dropdown.expanded || dropArea.height > 0 ? "#888888" : "#DBDBDB"
}
Rectangle {
anchors.fill: parent
anchors.bottomMargin: dropdown.expanded ? 0 : 1
anchors.bottomMargin: dropdown.expanded || dropArea.height > 0 ? 0 : 1
radius: 3
color: dropdown.expanded ? "#DBDBDB" : "#F0EEEE"
color: dropdown.expanded || dropArea.height > 0 ? "#DBDBDB" : "#F0EEEE"
}
Image {
@@ -37,7 +52,7 @@ Item {
anchors.horizontalCenterOffset: 1
height: 23
width: 1
color: dropdown.expanded ? "#FFFFFF" : "#DBDBDB"
color: dropdown.expanded || dropArea.height > 0 ? "#FFFFFF" : "#DBDBDB"
}
Image {
@@ -54,6 +69,7 @@ Item {
}
Item {
id: dropArea
anchors.left: parent.left
anchors.right: parent.right
anchors.top: head.bottom
@@ -73,9 +89,9 @@ Item {
ListModel {
id: dataModel
ListElement { name: "<b>text 1</b>"; icon: "../images/dropdownOption1.png" }
ListElement { name: "<b>longer text 2</b>"; icon: "../images/dropdownSend.png" }
ListElement { name: "<b>text3</b><br/><br/>lorem ipsum asdasd asdasd"; icon: "../images/dropdownSearch.png" }
ListElement { name: "<b>Add to adress book</b>"; icon: "../images/dropdownOption1.png" }
ListElement { name: "<b>Send to same destination</b>"; icon: "../images/dropdownSend.png" }
ListElement { name: "<b>Find similar transactions</b>"; icon: "../images/dropdownSearch.png" }
}
Repeater {
@@ -127,6 +143,11 @@ Item {
tipItem.visible = true
}
onExited: tipItem.visible = false
onClicked: {
dropdown.optionClicked(index)
tipItem.visible = false
dropdown.expanded = false
}
}
}
}

View File

@@ -3,6 +3,7 @@ import QtQuick 2.0
Rectangle {
id: header
signal sortRequest(bool desc, int column)
property alias dataModel: columnsRepeater.model
property int activeSortColumn: -1
height: 31
@@ -16,13 +17,6 @@ Rectangle {
color: "#DBDBDB"
}
ListModel {
id: columnsModel
ListElement { columnName: "Date"; columnWidth: 92 }
ListElement { columnName: "Amount"; columnWidth: 158 }
ListElement { columnName: "Balance"; columnWidth: 168 }
}
Row {
anchors.horizontalCenter: parent.horizontalCenter
@@ -34,7 +28,6 @@ Rectangle {
Repeater {
id: columnsRepeater
model: columnsModel
delegate: Rectangle {
id: delegate
property bool desc: false

View File

@@ -10,7 +10,7 @@ Rectangle {
Image {
anchors.top: parent.bottom
anchors.left: parent.left
anchors.leftMargin: 8
anchors.leftMargin: 5
source: "../images/tip.png"
}
@@ -21,6 +21,7 @@ Rectangle {
lineHeight: 0.7
font.family: "Arial"
font.pixelSize: 12
font.letterSpacing: -1
color: "#FFFFFF"
}
}