aboutsummaryrefslogtreecommitdiffstats
path: root/qt-mobile/qml
diff options
context:
space:
mode:
Diffstat (limited to 'qt-mobile/qml')
-rw-r--r--qt-mobile/qml/mobilecomponents/ApplicationWindow.qml9
-rw-r--r--qt-mobile/qml/mobilecomponents/ContextDrawer.qml1
-rw-r--r--qt-mobile/qml/mobilecomponents/GlobalDrawer.qml12
-rw-r--r--qt-mobile/qml/mobilecomponents/Heading.qml6
-rw-r--r--qt-mobile/qml/mobilecomponents/IconGrid.qml37
-rw-r--r--qt-mobile/qml/mobilecomponents/ListItemWithActions.qml19
-rw-r--r--qt-mobile/qml/mobilecomponents/OverlayDrawer.qml14
-rw-r--r--qt-mobile/qml/mobilecomponents/PageRow.qml19
-rw-r--r--qt-mobile/qml/mobilecomponents/private/ActionButton.qml19
9 files changed, 74 insertions, 62 deletions
diff --git a/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml b/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml
index 220d0524c..ce5d02abd 100644
--- a/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml
+++ b/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml
@@ -38,9 +38,9 @@ ApplicationWindow {
property alias initialPage: __pageStack.initialPage
/**
- * The stack used to allocate the pages nd to manage the transitions
+ * The stack used to allocate the pages and to manage the transitions
* between them.
- * It's using a PageRow, while having the same aPI as PageStack,
+ * It's using a PageRow, while having the same API as PageStack,
* it positions the pages as adjacent columns, with as many columns
* as can fit in the screen. An handheld device would usually have a single
* fullscreen column, a tablet device would have many tiled columns.
@@ -57,11 +57,6 @@ ApplicationWindow {
event.accepted = true;
}
}
- onLastVisiblePageChanged: {
- if (lastVisiblePage != null) {
- pop(lastVisiblePage)
- }
- }
}
property AbstractDrawer globalDrawer
diff --git a/qt-mobile/qml/mobilecomponents/ContextDrawer.qml b/qt-mobile/qml/mobilecomponents/ContextDrawer.qml
index 083254946..07de5b88d 100644
--- a/qt-mobile/qml/mobilecomponents/ContextDrawer.qml
+++ b/qt-mobile/qml/mobilecomponents/ContextDrawer.qml
@@ -35,6 +35,7 @@ OverlayDrawer {
contentItem: QtControls.ScrollView {
ListView {
id: menu
+ interactive: contentHeight > height
model: {
if (root.actions.length == 0) {
return null;
diff --git a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml
index 638222ada..1632da122 100644
--- a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml
+++ b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml
@@ -46,7 +46,7 @@ OverlayDrawer {
Layout.preferredWidth: title.implicitWidth
Layout.preferredHeight: bannerImageSource != "" ? Math.max(title.implicitHeight, Math.floor(width / (sourceSize.width/sourceSize.height))) : title.implicitHeight
- Layout.minimumHeight: Math.max(headingIcon.height, heading.height) + Units.smallSpacing*2
+ Layout.minimumHeight: Math.max(headingIcon.height, heading.height) + Units.smallSpacing * 2
fillMode: Image.PreserveAspectCrop
asynchronous: true
@@ -97,8 +97,8 @@ OverlayDrawer {
color: bannerImageSource != "" ? "white" : Theme.textColor
}
Item {
- height: parent.height
- Layout.minimumWidth: height
+ height: 1
+ Layout.minimumWidth: heading.height
}
}
}
@@ -157,9 +157,7 @@ OverlayDrawer {
source: "go-previous"
}
Label {
- // Weird, this doesn't work
- //text: (typeof(i18n) != undefined) ? i18n("Back") : "Back"
- text: "Back"
+ text: typeof i18n !== "undefined" ? i18n("Back") : "Back"
}
}
onClicked: pageRow.pop()
@@ -167,7 +165,7 @@ OverlayDrawer {
delegate: ListItem {
enabled: true
RowLayout {
- height: implicitHeight + Units.smallSpacing*2
+ height: implicitHeight + Units.smallSpacing * 2
anchors {
left: parent.left
right: parent.right
diff --git a/qt-mobile/qml/mobilecomponents/Heading.qml b/qt-mobile/qml/mobilecomponents/Heading.qml
index 0d3909e12..db69645eb 100644
--- a/qt-mobile/qml/mobilecomponents/Heading.qml
+++ b/qt-mobile/qml/mobilecomponents/Heading.qml
@@ -30,12 +30,10 @@ import org.kde.plasma.mobilecomponents 0.2
* Example usage:
*
* @code
- * import org.kde.plasma.extras 2.0 as PlasmaExtras
+ * import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
* [...]
* Column {
- * PlasmaExtras.Title { text: "Fruit sweetness on the rise" }
- * PlasmaExtras.Heading { text: "Apples in the sunlight"; level: 2 }
- * PlasmaExtras.Paragraph { text: "Long text about fruit and apples [...]" }
+ * MobileComponents.Heading { text: "Apples in the sunlight"; level: 2 }
* [...]
* }
* @endcode
diff --git a/qt-mobile/qml/mobilecomponents/IconGrid.qml b/qt-mobile/qml/mobilecomponents/IconGrid.qml
index f3f8f1c09..1a6acbc1d 100644
--- a/qt-mobile/qml/mobilecomponents/IconGrid.qml
+++ b/qt-mobile/qml/mobilecomponents/IconGrid.qml
@@ -28,11 +28,11 @@ Item {
property Component delegate
property QtObject model
- property int pageSize: Math.floor(iconView.width/main.delegateWidth)*Math.floor(iconView.height/main.delegateHeight)
- property int delegateWidth: Units.iconSizes.huge + Units.gridUnit*2
- property int delegateHeight: Units.iconSizes.huge + Units.gridUnit*2
+ property int pageSize: Math.floor(iconView.width / main.delegateWidth) * Math.floor(iconView.height / main.delegateHeight)
+ property int delegateWidth: Units.iconSizes.huge + Units.gridUnit * 2
+ property int delegateHeight: Units.iconSizes.huge + Units.gridUnit * 2
property alias currentPage: iconView.currentIndex
- property int pagesCount: Math.ceil(model.count/pageSize)
+ property int pagesCount: Math.ceil(model.count / pageSize)
property int count: model.count
property alias contentX: iconView.contentX
clip: true
@@ -47,7 +47,7 @@ Item {
running: true
interval: 100
onTriggered: {
- main.pageSize = Math.floor(iconView.width/main.delegateWidth)*Math.floor(iconView.height/main.delegateHeight)
+ main.pageSize = Math.floor(iconView.width / main.delegateWidth) * Math.floor(iconView.height / main.delegateHeight)
if (iconView.currentItem) {
iconView.currentItem.width = iconView.width
iconView.currentItem.height = iconView.height
@@ -59,8 +59,8 @@ Item {
id: iconView
objectName: "iconView"
pressDelay: 200
- cacheBuffer: 100
- highlightMoveDuration: 250
+ cacheBuffer: Units.gridUnit * 8
+ highlightMoveDuration: Units.shortDuration
anchors.fill: parent
onWidthChanged: resizeTimer.restart()
onHeightChanged: resizeTimer.restart()
@@ -103,8 +103,8 @@ Item {
Repeater {
id: iconRepeater
model: pagedProxyModel
- property int columns: Math.min(count, Math.floor(delegatePage.width/main.delegateWidth))
- property int suggestedWidth: main.delegateWidth*columns
+ property int columns: Math.min(count, Math.floor(delegatePage.width / main.delegateWidth))
+ property int suggestedWidth: main.delegateWidth * columns
//property int suggestedHeight: main.delegateHeight*Math.floor(count/columns)
delegate: main.delegate
@@ -123,7 +123,7 @@ Item {
right: parent.right
bottom: parent.bottom
}
- height: Math.max( 16, iconView.height - Math.floor(iconView.height/delegateHeight)*delegateHeight)
+ height: Math.max(16, iconView.height - Math.floor(iconView.height / delegateHeight) * delegateHeight)
property int pageCount: main.model ? Math.ceil(main.model.count/main.pageSize) : 0
@@ -145,15 +145,14 @@ Item {
Rectangle {
id: barRectangle
color: Theme.textColor
- opacity: 2.05
height: 4
radius: 2
anchors {
left: parent.left
right: parent.right
verticalCenter: parent.verticalCenter
- leftMargin: (parent.width/pageCount/2)
- rightMargin: (parent.width/pageCount/2)
+ leftMargin: (parent.width / pageCount / 2)
+ rightMargin: (parent.width / pageCount / 2)
}
}
Rectangle {
@@ -162,10 +161,10 @@ Item {
width: height
radius: 4
anchors.verticalCenter: parent.verticalCenter
- x: parent.width/(pageCount/(iconView.currentIndex+1)) - (parent.width/pageCount/2) - 4
+ x: parent.width / (pageCount / (iconView.currentIndex+1)) - (parent.width / pageCount / 2) - 4
Behavior on x {
NumberAnimation {
- duration: 250
+ duration: Units.shortDuration
easing.type: Easing.InOutQuad
}
}
@@ -192,7 +191,7 @@ Item {
Item {
Row {
anchors.centerIn: parent
- spacing: 20
+ spacing: units.gridUnit
Repeater {
model: scrollArea.pageCount
@@ -209,13 +208,13 @@ Item {
Behavior on scale {
NumberAnimation {
- duration: 250
+ duration: units.shortDuration
easing.type: Easing.InOutQuad
}
}
Behavior on opacity {
NumberAnimation {
- duration: 250
+ duration: units.shortDuration
easing.type: Easing.InOutQuad
}
}
@@ -223,7 +222,7 @@ Item {
MouseArea {
anchors {
fill: parent
- margins: -10
+ margins: Units.gridUnit / 2
}
onClicked: {
diff --git a/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml b/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml
index 97eba1c71..43c62d400 100644
--- a/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml
+++ b/qt-mobile/qml/mobilecomponents/ListItemWithActions.qml
@@ -50,7 +50,6 @@ Item {
*/
signal clicked
-
/**
* The user pressed the item with the mouse and didn't release it for a
* certain amount of time.
@@ -93,9 +92,9 @@ Item {
}
width: parent ? parent.width : childrenRect.width
- height: paddingItem.childrenRect.height + Units.smallSpacing*2
+ height: paddingItem.childrenRect.height + Units.smallSpacing * 2
- property int implicitHeight: paddingItem.childrenRect.height + Units.smallSpacing*2
+ property int implicitHeight: paddingItem.childrenRect.height + Units.smallSpacing * 2
Rectangle {
@@ -114,7 +113,7 @@ Item {
verticalCenter: parent.verticalCenter
rightMargin: y
}
- height: Math.min( parent.height/1.5, Units.iconSizes.medium)
+ height: Math.min( parent.height / 1.5, Units.iconSizes.medium)
property bool exclusive: false
property Item checkedButton
spacing: 0
@@ -151,10 +150,10 @@ Item {
}
InnerShadow {
anchors.fill: parent
- radius: Units.smallSpacing*2
+ radius: Units.smallSpacing * 2
samples: 16
horizontalOffset: 0
- verticalOffset: Units.smallSpacing/2
+ verticalOffset: Units.smallSpacing / 2
color: Qt.rgba(0, 0, 0, 0.3)
source: background
}
@@ -162,7 +161,7 @@ Item {
id: shadow
//TODO: depends from app layout
property bool inverse: true
- width: Units.smallSpacing*2
+ width: Units.smallSpacing * 2
anchors {
right: shadow.inverse ? undefined : itemMouse.left
left: shadow.inverse ? itemMouse.right : undefined
@@ -210,7 +209,7 @@ Item {
id : item
color: listItem.checked || (itemMouse.pressed && itemMouse.changeBackgroundOnPress) ? Theme.highlightColor : Theme.viewBackgroundColor
anchors.fill: parent
-
+
visible: listItem.ListView.view ? listItem.ListView.view.highlight === null : true
Behavior on color {
ColorAnimation { duration: Units.longDuration }
@@ -242,14 +241,14 @@ Item {
if (itemMouse.x > -itemMouse.width/2) {
itemMouse.x = 0;
} else {
- itemMouse.x = -itemMouse.width + width*2
+ itemMouse.x = -itemMouse.width + width * 2
}
}
onClicked: {
if (itemMouse.x < -itemMouse.width/2) {
itemMouse.x = 0;
} else {
- itemMouse.x = -itemMouse.width + width*2
+ itemMouse.x = -itemMouse.width + width * 2
}
}
Icon {
diff --git a/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml b/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml
index 5ae81929e..c6e9d4b36 100644
--- a/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml
+++ b/qt-mobile/qml/mobilecomponents/OverlayDrawer.qml
@@ -28,14 +28,20 @@ Imports:
QtQuick 2.1
Description:
- Overlay Drawers are used to expose additional UI elements needed for small secondary tasks for which the main UI elements are not needed. For example in Okular Active, an Overlay Drawer is used to display thumbnails of all pages within a document along with a search field. This is used for the distinct task of navigating to another page.
+ Overlay Drawers are used to expose additional UI elements needed for
+ small secondary tasks for which the main UI elements are not needed.
+ For example in Okular Active, an Overlay Drawer is used to display
+ thumbnails of all pages within a document along with a search field.
+ This is used for the distinct task of navigating to another page.
Properties:
bool opened:
- If true the drawer is open showing the contents of the "drawer" component.
+ If true the drawer is open showing the contents of the "drawer"
+ component.
Item page:
- It's the default property. it's the main content of the drawer page, the part that is always shown
+ It's the default property. it's the main content of the drawer page,
+ the part that is always shown
Item contentItem:
It's the part that can be pulled in and out, will act as a sidebar.
@@ -218,7 +224,7 @@ AbstractDrawer {
onStateChanged: open = (state != "Closed")
property bool open: false
onOpenChanged: {
- if (drawerPage.children.length == 0) {
+ if (browserFrame.state == "Dragging" || drawerPage.children.length == 0) {
return;
}
diff --git a/qt-mobile/qml/mobilecomponents/PageRow.qml b/qt-mobile/qml/mobilecomponents/PageRow.qml
index 4d6adf5a7..ab0e9a5ed 100644
--- a/qt-mobile/qml/mobilecomponents/PageRow.qml
+++ b/qt-mobile/qml/mobilecomponents/PageRow.qml
@@ -82,6 +82,7 @@ Item {
// Returns the page instance.
function push(page, properties, immediate)
{
+ pop(lastVisiblePage, true);
scrollAnimation.running = false;
var item = Engine.push(page, properties, false, immediate)
scrollToLevel(depth)
@@ -102,6 +103,7 @@ Item {
// See push() for details.
function replace(page, properties, immediate)
{
+ pop(lastVisiblePage, true);
scrollAnimation.running = false;
var item = Engine.push(page, properties, true, immediate);
scrollToLevel(depth)
@@ -147,6 +149,11 @@ Item {
}
ScriptAction {
script: {
+ //At startup sometimes the contentX is NaN for an instant
+ if (isNaN(mainFlickable.contentX)) {
+ return;
+ }
+
actualRoot.lastVisiblePage = root.children[Math.floor((mainFlickable.contentX + mainFlickable.width - 1)/columnWidth)].page
}
}
@@ -211,8 +218,8 @@ Item {
contentHeight: height
Row {
id: root
- spacing: -100
- width: Math.max((depth-1+children[children.length-1].takenColumns) * columnWidth, childrenRect.width - 100)
+ spacing: -Units.gridUnit * 8
+ width: Math.max((depth-1+children[children.length-1].takenColumns) * columnWidth, childrenRect.width - Units.gridUnit * 8)
height: parent.height
Behavior on width {
@@ -238,7 +245,7 @@ Item {
Item {
id: container
- implicitWidth: actualContainer.width + 100
+ implicitWidth: actualContainer.width + Units.gridUnit * 8
width: implicitWidth
height: parent ? parent.height : 0
@@ -293,7 +300,7 @@ Item {
top: parent.top
bottom: parent.bottom
right: parent.right
- rightMargin: 100
+ rightMargin: Units.gridUnit * 8
}
property int takenColumns: {
@@ -413,13 +420,13 @@ Item {
State {
name: "Left"
PropertyChanges { target: container; opacity: 0 }
- PropertyChanges { target: container; width: 100}
+ PropertyChanges { target: container; width: Units.gridUnit * 8}
},
// Start state for push entry, end state for pop exit.
State {
name: "Right"
PropertyChanges { target: container; opacity: 0 }
- PropertyChanges { target: container; width: 100}
+ PropertyChanges { target: container; width: Units.gridUnit * 8}
},
// Inactive state.
State {
diff --git a/qt-mobile/qml/mobilecomponents/private/ActionButton.qml b/qt-mobile/qml/mobilecomponents/private/ActionButton.qml
index 4dbea98b8..9ad55ff7c 100644
--- a/qt-mobile/qml/mobilecomponents/private/ActionButton.qml
+++ b/qt-mobile/qml/mobilecomponents/private/ActionButton.qml
@@ -25,6 +25,8 @@ import org.kde.plasma.mobilecomponents 0.2
MouseArea {
id: button
property alias iconSource: icon.source
+ property bool checkable: false
+ property bool checked: false
Layout.minimumWidth: Units.iconSizes.large
Layout.maximumWidth: Layout.minimumWidth
implicitWidth: Units.iconSizes.large
@@ -35,9 +37,9 @@ MouseArea {
minimumX: contextDrawer ? 0 : parent.width/2 - width/2
maximumX: globalDrawer ? parent.width : parent.width/2 - width/2
}
- function toggle() {
+ function toggleVisibility() {
showAnimation.running = false;
- if (transform[0].y < button.height) {
+ if (translateTransform.y < button.height) {
showAnimation.to = button.height;
} else {
showAnimation.to = 0;
@@ -45,7 +47,9 @@ MouseArea {
showAnimation.running = true;
}
- transform: Translate {}
+ transform: Translate {
+ id: translateTransform
+ }
onReleased: {
if (globalDrawer && x > Math.min(parent.width/4*3, parent.width/2 + globalDrawer.contentItem.width/2)) {
globalDrawer.open();
@@ -66,6 +70,11 @@ MouseArea {
}
}
}
+ onClicked: {
+ if (checkable) {
+ checked = !checked;
+ }
+ }
Connections {
target: globalDrawer
onPositionChanged: {
@@ -99,7 +108,7 @@ MouseArea {
NumberAnimation {
id: showAnimation
- target: button.transform[0]
+ target: translateTransform
properties: "y"
duration: Units.longDuration
easing.type: Easing.InOutQuad
@@ -116,7 +125,7 @@ MouseArea {
anchors.centerIn: parent
height: parent.height - Units.smallSpacing*2
width: height
- color: button.pressed ? Theme.highlightColor : Theme.backgroundColor
+ color: button.pressed || button.checked ? Theme.highlightColor : Theme.backgroundColor
Icon {
id: icon
anchors {
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-12-30 21:03:39 +0000