Public bug reported:
I have an UbuntuListView with ListItems, and I add items into the model at
runtime.
I want to keep the list sorted, so I insert items at specific positions instead
of appending them.
The problem is that the divider only shows up for items that are inserted
before the last one.
I read in the API documentation for ListItem [1]:
> When used in ListView or UbuntuListView, the last list item will not show the
> divider no matter of the visible property value set.
So I suppose this is the reason. But shouldn't the divider become
visible when the model changes and the ListItem is no longer the last
one?
For example, I add the following items, in order:
* aaa
* ccc
* bbb
Because the list is sorted, when adding `bbb` it is inserted in the
middle and receives a divider. But `aaa` remains with no divider, and
the list looks weird.
Expected:
aaa
-
bbb
-
ccc
Actual:
aaa
bbb
-
ccc
Here is the full source code:
=== Main.qml ===
import QtQuick 2.4
import QtQuick.Layouts 1.1
import Ubuntu.Components 1.2
MainView {
width: units.gu(40)
height: units.gu(40)
Page {
ColumnLayout {
spacing: units.gu(1)
anchors {
margins: units.gu(2)
fill: parent
}
TextField {
id: textInput
Layout.fillWidth: true;
hasClearButton: true
onAccepted: {
addToList();
}
}
MyList {
id: myList
anchors {
left: parent.left
right: parent.right
}
height: parent.height
}
}
}
function addToList() {
if(textInput.text.length > 0) {
myList.add(textInput.text);
textInput.text = '';
}
}
}
=== MyList.qml ===
import QtQuick 2.4
import Ubuntu.Components 1.2
import Ubuntu.Components.ListItems 1.0
Item {
ListModel {
id: listModel
}
UbuntuListView {
anchors.fill: parent
model: listModel
delegate: ListItem {
id: listItem
height: units.gu(5)
divider.visible: true; // doesn't help
Label {
text: itemName
verticalAlignment: Text.AlignVCenter
height: parent.height
}
onClicked: {
divider.visible = true; // doesn't help
}
}
}
function add(text) {
var indexToInsert = listModel.count;
for(var i = 0; i < listModel.count; i++) {
var compareResult = text.localeCompare(listModel.get(i).itemName);
if(compareResult <= 0) {
indexToInsert = i;
break;
}
}
listModel.insert(indexToInsert, {itemName: text});
}
}
I'm not really sure if this is a bug, or if I'm not using the API correctly.
[1]
https://developer.ubuntu.com/api/apps/qml/sdk-15.04/Ubuntu.Components.ListItem/
** Affects: ubuntu-ui-toolkit (Ubuntu)
Importance: Undecided
Status: Confirmed
** Package changed: ubuntu => ubuntu-ui-toolkit (Ubuntu)
--
You received this bug notification because you are a member of Ubuntu
Touch seeded packages, which is subscribed to ubuntu-ui-toolkit in
Ubuntu.
https://bugs.launchpad.net/bugs/1665559
Title:
UbuntuListView dividers don't get updated on model changes
Status in ubuntu-ui-toolkit package in Ubuntu:
Confirmed
Bug description:
I have an UbuntuListView with ListItems, and I add items into the model at
runtime.
I want to keep the list sorted, so I insert items at specific positions
instead of appending them.
The problem is that the divider only shows up for items that are inserted
before the last one.
I read in the API documentation for ListItem [1]:
> When used in ListView or UbuntuListView, the last list item will not show
the divider no matter of the visible property value set.
So I suppose this is the reason. But shouldn't the divider become
visible when the model changes and the ListItem is no longer the last
one?
For example, I add the following items, in order:
* aaa
* ccc
* bbb
Because the list is sorted, when adding `bbb` it is inserted in the
middle and receives a divider. But `aaa` remains with no divider, and
the list looks weird.
Expected:
aaa
-
bbb
-
ccc
Actual:
aaa
bbb
-
ccc
Here is the full source code:
=== Main.qml ===
import QtQuick 2.4
import QtQuick.Layouts 1.1
import Ubuntu.Components 1.2
MainView {
width: units.gu(40)
height: units.gu(40)
Page {
ColumnLayout {
spacing: units.gu(1)
anchors {
margins: units.gu(2)
fill: parent
