fix interaction ScrollArea/SectionScroller

fix the behaviour of the interaction between ScrollArea and SectionScroller, both in touch and desktop cases
make the margins correctly update based wether the scrollbar is actually visible
This commit is contained in:
Marco Martin 2012-09-05 18:15:59 +02:00
parent e5316bf6bc
commit c3130c7066
3 changed files with 51 additions and 17 deletions

View File

@ -153,6 +153,7 @@ Item {
} }
} }
PlasmaCore.FrameSvgItem { PlasmaCore.FrameSvgItem {
id: tooltip
imagePath: "widgets/tooltip" imagePath: "widgets/tooltip"
width: sectionLabel.paintedWidth + margins.left + margins.right width: sectionLabel.paintedWidth + margins.left + margins.right
height: sectionLabel.paintedHeight + margins.top + margins.bottom height: sectionLabel.paintedHeight + margins.top + margins.bottom
@ -194,11 +195,22 @@ Item {
} }
Timer {
id: dirtyTimer
interval: 250
onTriggered: {
Sections.initSectionData(listView);
internal.modelDirty = false;
tooltip.visible = Sections._sections.length > 1
}
}
QtObject { QtObject {
id: internal id: internal
property bool modelDirty: false
function initDirtyObserver() { function initDirtyObserver() {
Sections.initSectionData(listView); Sections.initSectionData(listView);
tooltip.visible = Sections._sections.length > 1
function dirtyObserver() { function dirtyObserver() {
if (!internal.modelDirty) { if (!internal.modelDirty) {
internal.modelDirty = true; internal.modelDirty = true;

View File

@ -85,7 +85,7 @@ Item {
} }
} }
width: 22 width: 18
Behavior on opacity { Behavior on opacity {
NumberAnimation { NumberAnimation {
duration: 250 duration: 250
@ -120,12 +120,12 @@ Item {
interactive: true interactive: true
} }
PlasmaCore.FrameSvgItem { PlasmaCore.FrameSvgItem {
id: tooltip
imagePath: "widgets/tooltip" imagePath: "widgets/tooltip"
width: sectionLabel.paintedWidth + margins.left + margins.right width: sectionLabel.width + margins.left + margins.right
height: sectionLabel.paintedHeight + margins.top + margins.bottom height: sectionLabel.height + margins.top + margins.bottom
Label { Label {
id: sectionLabel id: sectionLabel
font.pointSize: theme.defaultFont.pointSize*3
x: parent.margins.left x: parent.margins.left
y: parent.margins.top y: parent.margins.top
} }
@ -134,7 +134,7 @@ Item {
//verticalCenter: handle.verticalCenter //verticalCenter: handle.verticalCenter
right: parent.left right: parent.left
} }
opacity: sectionLabel.text && scrollBar.pressed?1:0 opacity: sectionLabel.text && scrollBar.pressed ? 1 : 0
Behavior on opacity { Behavior on opacity {
NumberAnimation { NumberAnimation {
duration: 250 duration: 250
@ -143,11 +143,22 @@ Item {
} }
Timer {
id: dirtyTimer
interval: 250
onTriggered: {
Sections.initSectionData(listView);
internal.modelDirty = false;
tooltip.visible = Sections._sections.length > 1
}
}
QtObject { QtObject {
id: internal id: internal
property bool modelDirty: false
function initDirtyObserver() { function initDirtyObserver() {
Sections.initSectionData(listView); Sections.initSectionData(listView);
tooltip.visible = Sections._sections.length > 1
function dirtyObserver() { function dirtyObserver() {
if (!internal.modelDirty) { if (!internal.modelDirty) {
internal.modelDirty = true; internal.modelDirty = true;

View File

@ -64,7 +64,9 @@ Item {
Connections { Connections {
target: flickableItem target: flickableItem
onContentHeightChanged: internal.checkVerticalScrollBar() onContentHeightChanged: internal.checkVerticalScrollBar()
onHeightChanged: internal.checkVerticalScrollBar()
onContentWidthChanged: internal.checkHorizontalScrollBar() onContentWidthChanged: internal.checkHorizontalScrollBar()
onWidthChanged: internal.checkHorizontalScrollBar()
} }
QtObject { QtObject {
id: internal id: internal
@ -80,7 +82,7 @@ Item {
if (flickableItem.contentHeight > flickableItem.height) { if (flickableItem.contentHeight > flickableItem.height) {
//Do we have to change the type? //Do we have to change the type?
//from section to normal //from section to normal
if ((!flickableItem.section || !flickableItem.section.property) && if ((!flickableItem.model || flickableItem.model.get === undefined || !flickableItem.section || !flickableItem.section.property) &&
(!verticalScrollBar || verticalScrollBar.orientation === undefined)) { (!verticalScrollBar || verticalScrollBar.orientation === undefined)) {
if (verticalScrollBar) verticalScrollBar.destroy() if (verticalScrollBar) verticalScrollBar.destroy()
verticalScrollBar = verticalScrollBarComponent.createObject(root) verticalScrollBar = verticalScrollBarComponent.createObject(root)
@ -90,12 +92,16 @@ Item {
if (verticalScrollBar) verticalScrollBar.destroy() if (verticalScrollBar) verticalScrollBar.destroy()
verticalScrollBar = sectionScrollerComponent.createObject(root) verticalScrollBar = sectionScrollerComponent.createObject(root)
} }
if (verticalScrollBar.interactive) {
flickableItem.anchors.leftMargin = verticalScrollBar.width
} else {
flickableItem.anchors.leftMargin = 0
} }
//undefined in case of SectionScroller
if ((flickableItem.contentHeight > flickableItem.height) &&
(verticalScrollBar.interactive || (verticalScrollBar.orientation === undefined &&
//FIXME: heuristic on width to distinguish the touch sectionscroller
verticalScrollBar.width < 30))) {
flickableItem.anchors.rightMargin = verticalScrollBar.width
} else {
flickableItem.anchors.rightMargin = 0
} }
} }
@ -106,14 +112,17 @@ Item {
} }
if (flickableItem.contentWidth > flickableItem.width) { if (flickableItem.contentWidth > flickableItem.width) {
if (!horizontalScrollBar) {
horizontalScrollBar = horizontalScrollBarComponent.createObject(root) horizontalScrollBar = horizontalScrollBarComponent.createObject(root)
if (verticalScrollBar.interactive) {
flickableItem.anchors.leftMargin = verticalScrollBar.width
} else {
flickableItem.anchors.leftMargin = 0
} }
} }
if ((flickableItem.contentWidth > flickableItem.width) &&
horizontalScrollBar.interactive) {
flickableItem.anchors.bottomMargin = horizontalScrollBar.height
} else {
flickableItem.anchors.bottomMargin = 0
}
} }
} }
Component { Component {
@ -121,6 +130,7 @@ Item {
ScrollBar { ScrollBar {
flickableItem: root.flickableItem flickableItem: root.flickableItem
orientation: Qt.Vertical orientation: Qt.Vertical
property bool isScrollBar: true
anchors { anchors {
left: undefined left: undefined
top: parent.top top: parent.top
@ -146,6 +156,7 @@ Item {
id: sectionScrollerComponent id: sectionScrollerComponent
SectionScroller { SectionScroller {
listView: root.flickableItem listView: root.flickableItem
property bool isScrollBar: false
anchors { anchors {
left: undefined left: undefined
top: parent.top top: parent.top