mifr/subsurface
1
0
Fork 0
mirror of https://github.com/subsurface/subsurface.git synced 2024-11-28 05:00:20 +00:00
Code Issues Projects Releases Packages Wiki Activity

mobile/dive-list: make sure filter input area is visible

Browse source 
Since apparently the header property of the ListView isn't reliably
making sure that our filter input line is visible, let's move the filter
header to be it's own visual element and manually manage the
relationship between that and the ListView.

The obvious idea was to anchor the ListView to the bottom of the
filterHeader, but that didn't work in my tests. So instead we are using
the topMargin to make sure that there is space to show the header.

Because this re-indents the whole filterHeader, 'git show -w' gives a
much better idea what this commit actually changes.

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Dirk Hohndel 2020-03-29 12:18:24 -07:00
parent d12e86cb2b
commit ccb671685d
1 changed files with 67 additions and 72 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

139
mobile-widgets/qml/DiveList.qml
View file

@ -353,92 +353,87 @@ Kirigami.ScrollablePage {
visible: diveListView.visible && diveListView.count === 0 visible: diveListView.visible && diveListView.count === 0
} }
Component { Rectangle {
id: filterHeader id: filterHeader
Rectangle { visible: filterBar.height > 0
id: filterRectangle implicitHeight: filterBar.implicitHeight
visible: filterBar.height > 0 implicitWidth: filterBar.implicitWidth
implicitHeight: filterBar.implicitHeight height: filterBar.height
implicitWidth: filterBar.implicitWidth anchors {
height: filterBar.height top: parent.top
left: parent.left
right: parent.right
}
color: subsurfaceTheme.backgroundColor
enabled: rootItem.filterToggle
RowLayout {
id: filterBar
states: [
State {
name: "isVisible"
when: rootItem.filterToggle
PropertyChanges { target: filterBar; height: sitefilter.implicitHeight }
},
State {
name: "isHidden"
when: !rootItem.filterToggle
PropertyChanges { target: filterBar; height: 0 }
}
]
transitions: [
Transition { NumberAnimation { property: "height"; duration: 400; easing.type: Easing.InOutQuad }}
]
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
color: subsurfaceTheme.backgroundColor anchors.leftMargin: Kirigami.Units.gridUnit / 2
enabled: rootItem.filterToggle anchors.rightMargin: Kirigami.Units.gridUnit / 2
RowLayout { TemplateComboBox {
id: filterBar visible: filterBar.height === sitefilter.implicitHeight
z: 5 //make sure it sits on top id: sitefilterMode
states: [ editable: false
State { model: ListModel {
name: "isVisible" ListElement {text: qsTr("Fulltext")}
when: rootItem.filterToggle ListElement {text: qsTr("People")}
PropertyChanges { target: filterBar; height: sitefilter.implicitHeight } ListElement {text: qsTr("Tags")}
}, }
State { font.pointSize: subsurfaceTheme.smallPointSize
name: "isHidden" Layout.preferredWidth: parent.width * 0.2
when: !rootItem.filterToggle Layout.maximumWidth: parent.width * 0.3
PropertyChanges { target: filterBar; height: 0 } onActivated: {
} manager.setFilter(sitefilter.text, currentIndex)
}
] }
transitions: [ Controls.TextField {
Transition { NumberAnimation { property: "height"; duration: 400; easing.type: Easing.InOutQuad }} id: sitefilter
] verticalAlignment: TextInput.AlignVCenter
anchors.left: parent.left Layout.fillWidth: true
anchors.right: parent.right text: ""
anchors.leftMargin: Kirigami.Units.gridUnit / 2 placeholderText: sitefilterMode.currentText
anchors.rightMargin: Kirigami.Units.gridUnit / 2 onAccepted: {
TemplateComboBox { manager.setFilter(text, sitefilterMode.currentIndex)
id: sitefilterMode }
editable: false onEnabledChanged: {
model: ListModel { // reset the filter when it gets toggled
ListElement {text: qsTr("Fulltext")} text = ""
ListElement {text: qsTr("People")} if (visible) {
ListElement {text: qsTr("Tags")} forceActiveFocus()
}
font.pointSize: subsurfaceTheme.smallPointSize
Layout.preferredWidth: parent.width * 0.2
Layout.maximumWidth: parent.width * 0.3
onActivated: {
manager.setFilter(sitefilter.text, currentIndex)
} }
} }
Controls.TextField { }
id: sitefilter Controls.Label {
z: 10 id: numShown
verticalAlignment: TextInput.AlignVCenter verticalAlignment: Text.AlignVCenter
Layout.fillWidth: true text: diveModel.shown
text: ""
placeholderText: sitefilterMode.currentText
onAccepted: {
manager.setFilter(text, sitefilterMode.currentIndex)
}
onEnabledChanged: {
// reset the filter when it gets toggled
text = ""
if (visible) {
forceActiveFocus()
}
}
}
Controls.Label {
id: numShown
z: 10
verticalAlignment: Text.AlignVCenter
text: diveModel.shown
}
} }
} }
} }
ListView { ListView {
id: diveListView id: diveListView
topMargin: filterHeader.height
anchors.fill: parent anchors.fill: parent
model: diveListModel model: diveListModel
currentIndex: -1 currentIndex: -1
delegate: diveOrTripDelegate delegate: diveOrTripDelegate
header: filterHeader
headerPositioning: ListView.OverlayHeader
boundsBehavior: Flickable.DragOverBounds boundsBehavior: Flickable.DragOverBounds
maximumFlickVelocity: parent.height * 5 maximumFlickVelocity: parent.height * 5
bottomMargin: Kirigami.Units.iconSizes.medium + Kirigami.Units.gridUnit bottomMargin: Kirigami.Units.iconSizes.medium + Kirigami.Units.gridUnit