git.iko.soy/unity8
on xenial help sign in
Back button improvements

Move the back button to the header itself so it will be shown when the search is out too. Make the back "button" bigger than the image

commit80c9891302cb891f48fe028826c39da957ccf07c authorAlbert Astals <albert.astals@canonical.com> dateWed 19 Feb 2014, 11:57 (13 years ago) parent873bc33f67baaf
3 files changed+41−27
compare with xenial
unifiedsplit
qml/Components/PageHeader.qml+25−1 qml/Dash/graphics/dashback@27.png → qml/Components/graphics/headerback@27.png qml/Dash/ScopeItem.qml+16−26
qml/Components/PageHeader.qml+25−1
@@ -27,6 +27,9 @@ Item {
2727 property ListModel searchHistory
2828 property Scope scope
2929 property alias childItem: itemContainer.children
30+ property alias showBackButton: backButton.visible
31+
32+ signal backClicked
3033
3134 height: units.gu(8.5)
3235 implicitHeight: units.gu(8.5)
@@ -69,11 +72,32 @@ Item {
6972
7073 Behavior on contentY { NumberAnimation { duration: 200; easing.type: Easing.OutQuad } }
7174
75+ MouseArea {
76+ id: backButton
77+ visible: false
78+ height: header.height
79+ y: header.contentY
80+ anchors {
81+ left: parent.left
82+ leftMargin: visible ? units.gu(2) : 0
83+ }
84+ width: visible ? image.width + units.gu(2) : 0
85+ onClicked: root.backClicked();
86+ Image {
87+ id: image
88+ anchors.centerIn: parent
89+ source: "graphics/headerback.png"
90+ }
91+ }
92+
7293 // FIXME this could potentially be simplified to avoid all the containers
7394 Item {
7495 id: headerContainer
7596
76− width: parent.width
97+ anchors {
98+ left: backButton.right
99+ right: parent.right
100+ }
77101 height: childrenRect.height
78102
79103 Item {
qml/Dash/graphics/dashback@27.png → qml/Components/graphics/headerback@27.pngrenamed

Binary file not shown.

qml/Dash/ScopeItem.qml+16−26
@@ -45,7 +45,7 @@ Item {
4545 previewListView: previewListView
4646
4747 Connections {
48− target: isCurrent ? scope : null
48+ target: scopeView.isCurrent ? scope : null
4949 onGotoScope: root.gotoScope(scopeId);
5050 onOpenScope: root.openScope(scope);
5151 }
@@ -58,34 +58,24 @@ Item {
5858 searchHistory: root.searchHistory
5959 scope: root.scope
6060 height: units.gu(7)
61+ showBackButton: true
62+ onBackClicked: root.back();
6163
62− childItem: Row {
64+ childItem: Label {
65+ id: label
6366 anchors {
64− fill: parent
65− leftMargin: units.gu(2)
66− }
67− spacing: units.gu(1)
68− Image {
69− anchors.verticalCenter: parent.verticalCenter
70− source: "graphics/dashback.png"
71− MouseArea {
72− anchors.fill: parent
73− onClicked: root.back();
74− }
75− }
76− Label {
77− id: label
78− anchors.verticalCenter: parent.verticalCenter
79−
80− text: scope ? scope.name : ""
81− color: "grey"
82− font.family: "Ubuntu"
83− font.weight: Font.Light
84− fontSize: "x-large"
85− elide: Text.ElideRight
86− style: Text.Raised
87− styleColor: "black"
67+ left: parent.left
68+ right: parent.right
69+ verticalCenter: parent.verticalCenter
8870 }
71+ text: scope ? scope.name : ""
72+ color: "grey"
73+ font.family: "Ubuntu"
74+ font.weight: Font.Light
75+ fontSize: "x-large"
76+ elide: Text.ElideRight
77+ style: Text.Raised
78+ styleColor: "black"
8979 }
9080 }
9181 }