Merge lp:~tpeeters/ubuntu-ui-toolkit/tabbar-expose into lp:ubuntu-ui-toolkit

Proposed by Tim Peeters
Status: Merged
Approved by: Tim Peeters
Approved revision: 678
Merged at revision: 671
Proposed branch: lp:~tpeeters/ubuntu-ui-toolkit/tabbar-expose
Merge into: lp:ubuntu-ui-toolkit
Diff against target: 226 lines (+65/-60)
7 files modified
components.api (+2/-0)
modules/Ubuntu/Components/TabBar.qml (+19/-1)
modules/Ubuntu/Components/Tabs.qml (+0/-1)
modules/Ubuntu/Components/Themes/Ambiance/TabBarStyle.qml (+11/-5)
tests/resources/navigation/MyCustomPage.qml (+2/-0)
tests/resources/navigation/StackWithTabs.qml (+31/-3)
tests/resources/tabs/MyCustomPage.qml (+0/-50)
To merge this branch: bzr merge lp:~tpeeters/ubuntu-ui-toolkit/tabbar-expose
Reviewer Review Type Date Requested Status
PS Jenkins bot continuous-integration Approve
Cris Dywan Approve
Review via email: mp+178066@code.launchpad.net

Commit message

Add bool properties alwaysSelectionMode and animate to TabBar for greater control of its behavior.

To post a comment you must log in.
Revision history for this message
PS Jenkins bot (ps-jenkins) wrote :
review: Needs Fixing (continuous-integration)
Revision history for this message
PS Jenkins bot (ps-jenkins) wrote :
review: Approve (continuous-integration)
Revision history for this message
Cris Dywan (kalikiana) wrote :

I see an initially unexpected phenomenon: with 'animate:false' I can still see the delay when selectionMode changes to false. I think, though, after discussing this on IRC and thinking it through, that it's only an issue in a demo like tests/resources/navigation/StackWithTabs.qml - users don't use buttons to change the values in practise. And it's far from a trivial aspect because it's separate from the fade duration.

So it works as advertised, given real apps.

review: Approve
Revision history for this message
PS Jenkins bot (ps-jenkins) wrote :
review: Needs Fixing (continuous-integration)
Revision history for this message
PS Jenkins bot (ps-jenkins) :
review: Approve (continuous-integration)

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
=== modified file 'components.api'
--- components.api 2013-07-29 11:31:00 +0000
+++ components.api 2013-08-01 13:42:29 +0000
@@ -183,6 +183,8 @@
183StyledItem183StyledItem
184 property Item tabsItem184 property Item tabsItem
185 property bool selectionMode185 property bool selectionMode
186 property bool alwaysSelectionMode
187 property bool animate
186modules/Ubuntu/Components/Tabs.qml188modules/Ubuntu/Components/Tabs.qml
187PageTreeNode189PageTreeNode
188 property int selectedTabIndex190 property int selectedTabIndex
189191
=== modified file 'modules/Ubuntu/Components/TabBar.qml'
--- modules/Ubuntu/Components/TabBar.qml 2013-07-29 11:31:00 +0000
+++ modules/Ubuntu/Components/TabBar.qml 2013-08-01 13:42:29 +0000
@@ -43,7 +43,25 @@
43 An inactive tab bar only displays the currently selected tab,43 An inactive tab bar only displays the currently selected tab,
44 and an active tab bar can be interacted with to select a tab.44 and an active tab bar can be interacted with to select a tab.
45 */45 */
46 property bool selectionMode: false46 property bool selectionMode: alwaysSelectionMode
47
48 /*!
49 Do not deactivate the tab bar after a specified idle time or when the user selects a new tab.
50 Off by default.
51 */
52 property bool alwaysSelectionMode: false
53
54 /*!
55 Automatically activate the tab bar when \l alwaysSelectionMode is set.
56 */
57 onAlwaysSelectionModeChanged: {
58 if (tabBar.alwaysSelectionMode) selectionMode = true;
59 }
60
61 /*!
62 Show animations when the state changes. Default: true.
63 */
64 property bool animate: true
4765
48 style: Theme.createStyleComponent("TabBarStyle.qml", tabBar)66 style: Theme.createStyleComponent("TabBarStyle.qml", tabBar)
49}67}
5068
=== modified file 'modules/Ubuntu/Components/Tabs.qml'
--- modules/Ubuntu/Components/Tabs.qml 2013-07-25 12:14:09 +0000
+++ modules/Ubuntu/Components/Tabs.qml 2013-08-01 13:42:29 +0000
@@ -145,7 +145,6 @@
145 }145 }
146 \endqml146 \endqml
147*/147*/
148
149PageTreeNode {148PageTreeNode {
150 id: tabs149 id: tabs
151 anchors.fill: parent150 anchors.fill: parent
152151
=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/TabBarStyle.qml'
--- modules/Ubuntu/Components/Themes/Ambiance/TabBarStyle.qml 2013-07-30 14:47:26 +0000
+++ modules/Ubuntu/Components/Themes/Ambiance/TabBarStyle.qml 2013-08-01 13:42:29 +0000
@@ -23,7 +23,7 @@
23 property color headerTextColor: Theme.palette.normal.backgroundText23 property color headerTextColor: Theme.palette.normal.backgroundText
24 property color headerTextSelectedColor: Theme.palette.selected.backgroundText24 property color headerTextSelectedColor: Theme.palette.selected.backgroundText
2525
26 property int headerTextFadeDuration: 35026 property int headerTextFadeDuration: styledItem.animate ? 350 : 0
27 property url indicatorImageSource: "artwork/chevron.png"27 property url indicatorImageSource: "artwork/chevron.png"
2828
29 property string headerFontSize: "x-large"29 property string headerFontSize: "x-large"
@@ -32,7 +32,7 @@
32 property real headerTextRightMargin: units.gu(2)32 property real headerTextRightMargin: units.gu(2)
33 property real headerTextBottomMargin: units.gu(2)33 property real headerTextBottomMargin: units.gu(2)
3434
35 property real buttonPositioningVelocity: 1.035 property real buttonPositioningVelocity: styledItem.animate ? 1.0 : -1
3636
37 // The time of inactivity before leaving selection mode automatically37 // The time of inactivity before leaving selection mode automatically
38 property int deactivateTime: 300038 property int deactivateTime: 3000
@@ -187,7 +187,9 @@
187 onClicked: {187 onClicked: {
188 if (!activatingTimer.running) {188 if (!activatingTimer.running) {
189 tabs.selectedTabIndex = index;189 tabs.selectedTabIndex = index;
190 styledItem.selectionMode = false;190 if (!styledItem.alwaysSelectionMode) {
191 styledItem.selectionMode = false;
192 }
191 button.select();193 button.select();
192 } else {194 } else {
193 activatingTimer.stop();195 activatingTimer.stop();
@@ -288,11 +290,15 @@
288290
289 // deactivate the tab bar after inactivity291 // deactivate the tab bar after inactivity
290 onMovementStarted: idleTimer.stop()292 onMovementStarted: idleTimer.stop()
291 onMovementEnded: idleTimer.restart()293 onMovementEnded: {
294 if (!styledItem.alwaysSelectionMode) {
295 idleTimer.restart();
296 }
297 }
292 Timer {298 Timer {
293 id: idleTimer299 id: idleTimer
294 interval: tabBarStyle.deactivateTime300 interval: tabBarStyle.deactivateTime
295 running: styledItem.selectionMode301 running: styledItem.selectionMode && !styledItem.alwaysSelectionMode
296 onTriggered: styledItem.selectionMode = false302 onTriggered: styledItem.selectionMode = false
297 }303 }
298 }304 }
299305
=== renamed directory 'tests/resources/pagestack' => 'tests/resources/navigation'
=== modified file 'tests/resources/navigation/MyCustomPage.qml'
--- tests/resources/pagestack/MyCustomPage.qml 2013-07-22 10:39:03 +0000
+++ tests/resources/navigation/MyCustomPage.qml 2013-08-01 13:42:29 +0000
@@ -38,9 +38,11 @@
38 tools: ToolbarItems {38 tools: ToolbarItems {
39 ToolbarButton {39 ToolbarButton {
40 text: "action 1"40 text: "action 1"
41 iconSource: Qt.resolvedUrl("call_icon.png")
41 }42 }
42 ToolbarButton {43 ToolbarButton {
43 text: "action 2"44 text: "action 2"
45 iconSource: Qt.resolvedUrl("call_icon.png")
44 }46 }
45 opened: true47 opened: true
46 locked: true48 locked: true
4749
=== modified file 'tests/resources/navigation/StackWithTabs.qml'
--- tests/resources/pagestack/StackWithTabs.qml 2013-07-23 13:17:43 +0000
+++ tests/resources/navigation/StackWithTabs.qml 2013-08-01 13:42:29 +0000
@@ -41,9 +41,37 @@
41 Tab {41 Tab {
42 title: "Tab 2"42 title: "Tab 2"
43 page: Page {43 page: Page {
44 Label {44 Column {
45 anchors.centerIn: parent45 anchors {
46 text: "Use header to navigate between tabs"46 centerIn: parent
47 }
48 width: childrenRect.width
49 height: childrenRect.height
50 spacing: units.gu(1)
51
52 Label {
53 text: "Tab bar always in selection mode?"
54 }
55 Switch {
56 id: alwaysSelectionModeSwitch
57 Binding {
58 target: tabs.tabBar
59 property: "alwaysSelectionMode"
60 value: alwaysSelectionModeSwitch.checked
61 }
62 }
63 Label {
64 text: "Animate tab bar."
65 }
66 Switch {
67 id: animateSwitch
68 checked: true
69 Binding {
70 target: tabs.tabBar
71 property: "animate"
72 value: animateSwitch.checked
73 }
74 }
47 }75 }
48 }76 }
49 }77 }
5078
=== renamed file 'tests/resources/tabs/Tabs.qml' => 'tests/resources/navigation/Tabs.qml'
=== renamed file 'tests/resources/tabs/call_icon@8.png' => 'tests/resources/navigation/call_icon@8.png'
=== removed directory 'tests/resources/tabs'
=== removed file 'tests/resources/tabs/MyCustomPage.qml'
--- tests/resources/tabs/MyCustomPage.qml 2013-07-29 11:31:00 +0000
+++ tests/resources/tabs/MyCustomPage.qml 1970-01-01 00:00:00 +0000
@@ -1,50 +0,0 @@
1/*
2 * Copyright 2012 Canonical Ltd.
3 *
4 * This program is free software; you can redistribute it and/or modify
5 * it under the terms of the GNU Lesser General Public License as published by
6 * the Free Software Foundation; version 3.
7 *
8 * This program is distributed in the hope that it will be useful,
9 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11 * GNU Lesser General Public License for more details.
12 *
13 * You should have received a copy of the GNU Lesser General Public License
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
15 */
16
17import QtQuick 2.0
18import Ubuntu.Components 0.1
19
20Page {
21 title: i18n.tr("My custom page")
22
23 Flickable {
24 anchors.fill: parent
25 contentHeight: parent.height + units.gu(10)
26 Label {
27 anchors {
28 top: parent.top
29 topMargin: units.gu(16)
30 horizontalCenter: parent.horizontalCenter
31 }
32
33 text: i18n.tr("This is an external page\nwith a locked toolbar.")
34 color: "#757373"
35 }
36 }
37
38 tools: ToolbarItems {
39 ToolbarButton {
40 text: "action 1"
41 iconSource: Qt.resolvedUrl("call_icon.png")
42 }
43 ToolbarButton {
44 text: "action 2"
45 iconSource: Qt.resolvedUrl("call_icon.png")
46 }
47 opened: true
48 locked: true
49 }
50}

Subscribers

People subscribed via source and target branches

to status/vote changes: