I have a listview with custom listitemcomponent that displays list of names, when I swipe on the name it shows user full name and profile pic, in order to achieve this I have created 2 views (view 1-with just names (initial display view), view 2- with pic and full name) in my custom listitemcomponent through which I hide the views based on the swipe action and it works fine. Now when I click on any name that name should go to top leaving the rest as it is, in order to achieve this I have maintained an array that keeps the updated list in order so whenever I tap on a name it clears the data model and add item from the updated array, it works as well but the problem is that when I swipe on few names then some rows will have view 1 and some rows will have view 2, at that time when I perform the click action the list re-orders fine but the rows with view 2 contains the same value as before, I have to swipe back and forth to refresh this row.
for eg say I have 4 names in my view displayed as,
1
2
3
4
I have swiped on 2 and 3 so now listview shows -
1
row 2 detail
row 3 detail
4
After clicking on 4, the list shows-
4
row 2 detail //swiping here shows correct value 1 and swipe back shows row 1 detail
row 3 detail
3
So is there anyway to update the custom listitemcomponent or is it possible to delete its instance when I delete the row and recreate again when I add it. Below is a sample structure of my list view. I need this to support it from 10.0 and above
ListView {
id: contactListView
dataModel: contactsData
listItemComponents: [
ListItemComponent {
id: homeListComponent
type: "item"
CustomListItemHomePage { //This is my custom listitem that has two views
id: listCell
onClicked:{
var newContacts = new Array();
newContacts.push(ListItemData.name);
for (var i = 0; i < listCell.ListItem.view.dataModel.size(); i ++)
{
if(listCell.ListItem.view.dataModel.data([ i ]).name!=ListItemData.name)
{
newContacts.push(listCell.ListItem.view.dataModel.data([ i ]).name);
}
}
listCell.ListItem.view.dataModel.clear();
for (var cntNames in newContacts) {
listCell.ListItem.view.dataModel.insert({
name: newContacts[cntNames].toString(),
last: listCell.ListItem.view.dataModel.size(),
})
}
}
}
}]
}
On your CustomListItemHomePage, add these lines of code:
function init(){
ListItemData;//This is your new data to (re)init your cell as you wish
}
ListItem.onDataChanged: {
init();//RE-init the cell when data is refreshed after recycling
}
onCreationCompleted: {
init();//Init the cell for the first time
}