diff options
Diffstat (limited to 'rockwork/qml/AppStorePage.qml')
| -rw-r--r-- | rockwork/qml/AppStorePage.qml | 400 |
1 files changed, 201 insertions, 199 deletions
diff --git a/rockwork/qml/AppStorePage.qml b/rockwork/qml/AppStorePage.qml index bb8712b..7e006da 100644 --- a/rockwork/qml/AppStorePage.qml +++ b/rockwork/qml/AppStorePage.qml @@ -1,11 +1,10 @@ -import QtQuick 2.4 -import Ubuntu.Components 1.3 -import QtQuick.Layouts 1.1 -import RockWork 1.0 +import QtQuick 2.0 +import QtQml 2.1 +import Sailfish.Silica 1.0 +import RockPool 1.0 Page { id: root - title: showWatchApps ? i18n.tr("Add new watchapp") : i18n.tr("Add new watchface") property var pebble: null property bool showWatchApps: false @@ -20,247 +19,250 @@ Page { client.fetchHome(AppStoreClient.TypeWatchface) } } - - head { - actions: [ - Action { - iconName: "search" - onTriggered: { - if (searchField.shown) { - searchField.shown = false; - root.fetchHome(); - } else { - searchField.shown = true; + SilicaFlickable { + id: flickable + anchors.top: parent.top + width: parent.width + PageHeader { + title: showWatchApps ? qsTr("Add new watchapp") : qsTr("Add new watchface") + } + PullDownMenu { + MenuItem { + text: qsTr("Show search") + onClicked: { + if (searchField.shown) { + searchField.shown = false; + root.fetchHome(); + } else { + searchField.shown = true; + } } } - } - ] - } + } - Component.onCompleted: { - if (root.link) { - client.fetchLink(link) - } else { - root.fetchHome() + Component.onCompleted: { + if (root.link) { + client.fetchLink(link) + } else { + root.fetchHome() + } } - } - AppStoreClient { - id: client - hardwarePlatform: pebble.hardwarePlatform - } + AppStoreClient { + id: client + hardwarePlatform: pebble.hardwarePlatform + } - Item { - id: searchField - anchors { left: parent.left; right: parent.right; top: parent.top } - anchors.topMargin: shown ? 0 : -height - Behavior on anchors.topMargin { UbuntuNumberAnimation {} } - opacity: shown ? 1 : 0 - Behavior on opacity { UbuntuNumberAnimation {} } - height: units.gu(6) + Item { + id: searchField + anchors { left: parent.left; right: parent.right; top: parent.top } + anchors.topMargin: shown ? 0 : -height + Behavior on anchors.topMargin { NumberAnimation {} } + opacity: shown ? 1 : 0 + Behavior on opacity { NumberAnimation {} } + height: units.gu(6) - property bool shown: false - onShownChanged: { - if (shown) { - searchTextField.focus = true; + property bool shown: false + onShownChanged: { + if (shown) { + searchTextField.focus = true; + } } - } - TextField { - id: searchTextField - anchors.centerIn: parent - width: parent.width - units.gu(2) - onDisplayTextChanged: { - searchTimer.restart() - } + SearchField { + id: searchTextField + anchors.centerIn: parent + width: parent.width - units.gu(2) + onDisplayTextChanged: { + searchTimer.restart() + } - Timer { - id: searchTimer - interval: 300 - onTriggered: { - client.search(searchTextField.displayText, root.showWatchApps ? AppStoreClient.TypeWatchapp : AppStoreClient.TypeWatchface); + Timer { + id: searchTimer + interval: 300 + onTriggered: { + client.search(searchTextField.displayText, root.showWatchApps ? AppStoreClient.TypeWatchapp : AppStoreClient.TypeWatchface); + } } } } - } - Item { - anchors { left: parent.left; top: searchField.bottom; right: parent.right; bottom: parent.bottom } - ListView { - anchors.fill: parent - model: ApplicationsFilterModel { - id: appsFilterModel - model: client.model - } - clip: true - section.property: "groupId" - section.labelPositioning: ViewSection.CurrentLabelAtStart | - ViewSection.InlineLabels - section.delegate: ListItem { - height: section ? label.implicitHeight + units.gu(3) : 0 - - Rectangle { - anchors.fill: parent - color: "white" + Item { + anchors { left: parent.left; top: searchField.bottom; right: parent.right; bottom: parent.bottom } + ListView { + anchors.fill: parent + model: ApplicationsFilterModel { + id: appsFilterModel + model: client.model } + clip: true + section.property: "groupId" + section.labelPositioning: ViewSection.CurrentLabelAtStart | + ViewSection.InlineLabels + section.delegate: ListItem { + height: section ? label.implicitHeight + units.gu(3) : 0 - RowLayout { - anchors.fill: parent - anchors.margins: units.gu(1) - Label { - id: label - text: client.model.groupName(section) - fontSize: "large" -// font.weight: Font.DemiBold - elide: Text.ElideRight - Layout.fillWidth: true + Rectangle { + anchors.fill: parent + color: "white" } - AbstractButton { - Layout.fillHeight: true - implicitWidth: seeAllLabel.implicitWidth + height - Row { - anchors.verticalCenter: parent.verticalCenter - Label { - id: seeAllLabel - text: i18n.tr("See all") + + Row { + anchors.fill: parent + anchors.margins: units.gu(1) + Label { + id: label + text: client.model.groupName(section) + font.pixelSize: Theme.fontSizeLarge + // font.weight: Font.DemiBold + elide: Text.ElideRight + width: parent.width + } + Button { + implicitWidth: seeAllLabel.implicitWidth + height + Row { + anchors.verticalCenter: parent.verticalCenter + Label { + id: seeAllLabel + text: qsTr("See all") + } + IconButton { + implicitHeight: parent.height + implicitWidth: height + icon.source: "image://theme/icon-m-forward" + } } - Icon { - implicitHeight: parent.height - implicitWidth: height - name: "go-next" + onClicked: { + pageStack.push(Qt.resolvedUrl("AppStorePage.qml"), {pebble: root.pebble, link: client.model.groupLink(section), title: client.model.groupName(section)}); } } - onClicked: { - pageStack.push(Qt.resolvedUrl("AppStorePage.qml"), {pebble: root.pebble, link: client.model.groupLink(section), title: client.model.groupName(section)}); - } } } - } - footer: Item { - height: client.model.links.length > 0 ? units.gu(6) : 0 - width: parent.width + footer: Item { + height: client.model.links.length > 0 ? units.gu(6) : 0 + width: parent.width - RowLayout { - anchors { - fill: parent - margins: units.gu(1) - } - spacing: units.gu(1) + Row { + anchors { + fill: parent + margins: units.gu(1) + } + spacing: units.gu(1) - Repeater { - model: client.model.links - Button { - text: client.model.linkName(client.model.links[index]) - onClicked: client.fetchLink(client.model.links[index]); - color: UbuntuColors.orange - Layout.fillWidth: true + Repeater { + model: client.model.links + Button { + text: client.model.linkName(client.model.links[index]) + onClicked: client.fetchLink(client.model.links[index]); + color: UbuntuColors.orange + width: parent.width + } } } } - } - - delegate: ListItem { - height: delegateColumn.height + units.gu(2) - RowLayout { - id: delegateRow - anchors.fill: parent - anchors.margins: units.gu(1) - spacing: units.gu(1) + delegate: ListItem { + height: delegateColumn.height + units.gu(2) - AnimatedImage { - Layout.fillHeight: true - Layout.preferredWidth: height - source: model.icon - asynchronous: true -// sourceSize.width: width -// sourceSize.height: height - } + Row { + id: delegateRow + anchors.fill: parent + anchors.margins: units.gu(1) + spacing: units.gu(1) - ColumnLayout { - id: delegateColumn - Layout.fillWidth: true; - Layout.fillHeight: true; - Label { - Layout.fillWidth: true - text: model.name - font.weight: Font.DemiBold - elide: Text.ElideRight + AnimatedImage { + source: model.icon + asynchronous: true + // sourceSize.width: width + // sourceSize.height: height } - Label { - Layout.fillWidth: true - text: model.category - } - RowLayout { - Icon { - name: "like" - Layout.preferredHeight: parent.height - Layout.preferredWidth: height - implicitHeight: parent.height + + Column { + id: delegateColumn + width: parent.width + //Layout.fillHeight: true; + Label { + width: parent.width + text: model.name + font.weight: Font.DemiBold + elide: Text.ElideRight } Label { - Layout.fillWidth: true - text: model.hearts + width: parent.width + text: model.category } - Icon { - id: tickIcon - name: "tick" - implicitHeight: parent.height - Layout.preferredWidth: height - visible: root.pebble.installedApps.contains(model.storeId) || root.pebble.installedWatchfaces.contains(model.storeId) - Connections { - target: root.pebble.installedApps - onChanged: { - tickIcon.visible = root.pebble.installedApps.contains(model.storeId) || root.pebble.installedWatchfaces.contains(model.storeId) - } + Row { + IconButton { + icon.source: "image://theme/icon-m-back" + id: like + //Layout.preferredHeight: parent.height + //Layout.preferredWidth: height + implicitHeight: parent.height + } + Label { + width: parent.width + text: model.hearts } + IconButton { + id: tickIcon + icon.source: "image://theme/icon-m-acknowledge" + implicitHeight: parent.height + //Layout.preferredWidth: height + visible: root.pebble.installedApps.contains(model.storeId) || root.pebble.installedWatchfaces.contains(model.storeId) + Connections { + target: root.pebble.installedApps + onTargetChanged: { + tickIcon.visible = root.pebble.installedApps.contains(model.storeId) || root.pebble.installedWatchfaces.contains(model.storeId) + } + } - Connections { - target: root.pebble.installedWatchfaces - onChanged: { - tickIcon.visible = root.pebble.installedApps.contains(model.storeId) || root.pebble.installedWatchfaces.contains(model.storeId) + Connections { + target: root.pebble.installedWatchfaces + onTargetChanged: { + tickIcon.visible = root.pebble.installedApps.contains(model.storeId) || root.pebble.installedWatchfaces.contains(model.storeId) + } } - } + } } } - } - } + } - onClicked: { - client.fetchAppDetails(model.storeId); - pageStack.push(Qt.resolvedUrl("AppStoreDetailsPage.qml"), {app: appsFilterModel.get(index), pebble: root.pebble}) + onClicked: { + client.fetchAppDetails(model.storeId); + pageStack.push(Qt.resolvedUrl("AppStoreDetailsPage.qml"), {app: appsFilterModel.get(index), pebble: root.pebble}) + } } } - } -// RowLayout { -// id: buttonRow -// anchors { left: parent.left; bottom: parent.bottom; right: parent.right; margins: units.gu(1) } -// spacing: units.gu(1) -// Button { -// text: i18n.tr("Previous") -// Layout.fillWidth: true -// enabled: client.offset > 0 -// onClicked: { -// client.previous() -// } -// } -// Button { -// text: i18n.tr("Next") -// Layout.fillWidth: true -// onClicked: { -// client.next() -// } -// } -// } - } + // RowLayout { + // id: buttonRow + // anchors { left: parent.left; bottom: parent.bottom; right: parent.right; margins: units.gu(1) } + // spacing: units.gu(1) + // Button { + // text: qsTr("Previous") + // Layout.fillWidth: true + // enabled: client.offset > 0 + // onClicked: { + // client.previous() + // } + // } + // Button { + // text: qsTr("Next") + // Layout.fillWidth: true + // onClicked: { + // client.next() + // } + // } + // } + } - ActivityIndicator { - anchors.centerIn: parent - running: client.busy + BusyIndicator { + anchors.centerIn: parent + running: client.busy + } } } |