[Interest] Awkwardness of delegates in heterogenous ListViews

[Gian Maxera]

> On 8 Jun 2016, at 14:32, Elvis Stansvik <elvstone at gmail.com> wrote:
> 
> Hi all,
> 
> I'm currently using a "type" role in my items and then a Loader as
> delegate, to give a level of indirection and let me choose the actual
> delegate based on the "type" of the item.
> 
> This explains it better (from my ListView):
> 
>        delegate: Loader {
>            sourceComponent: {
>                switch (type) {
>                case "color":
>                    return colorDelegate
>                case "flag":
>                    return flagDelegate
>                ...
>                }
>            }
> 
>            Component {
>                id: colorDelegate
> 
>                ColorDelegate { }
>            }
> 
>            Component {
>                id: flagDelegate
> 
>                FlagDelegate { }
>            }
> 
>            ...
>        }
> 
> What I don't like with this approach is that inside my delegates, e.g.
> ColorDelegate.qml, I have to use parent.ListView.view.model to get a
> reference to the model (needed for editing operations). The use of
> "parent" here assumes a certain layout, but I see no other way :(
> 
> How have others solved the issue of delegates for heterogenous lists?

I use the following approach:

This is the ListView with the Loader inside:

	ListView {
		id: subsectionsList
		model: navList.model
		delegate: Loader {
			id: innerItem
			width: subsectionsList.width
			height: subsectionsList.height
			asynchronous: false
			property var models: sectionModel
			source: sectionPage
		}
	}

Then, I create the model in the following way:

	ListModel {
		id: subsections
		// it's not possible to use the 'static' initialization:
		//    ListElement { ... }
		// because it does not support passing of object pointers
		Component.onCompleted: {
			append( {
				'sectionName': "Hotel details",
				'sectionPage':"HotelDetailsSubsection.qml",
				'sectionModel': {
					'event': event,
					'hotel': hotel
				}
			})
			append( {
				'sectionName': "Exhibitors",
				'sectionPage':"HotelExhibitorsSubsection.qml",
				'sectionModel': {
					'event': event,
					'hotel': hotel
				}
			})
		}
	}

Pay attention on two key passages:
 - the Loader inside the ListView has a property for keeping the models: “property var models: sectionModel
 - the ListModel contain an attribute ‘sectionModel’ that it’s an object with the Items I want to inject and pass to my loaded items inside the ListView

And then, into the source code of QML component I can use the model like that:

		Text {
			text: models.hotel.description
		}
		Text {
			text: models.hotel.city_and_country+' '+models.hotel.address+' '+models.hotel.postcode
		}


Do you like it ?

Ciao,
Gianluca.

> 
> Best regards,
> Elvis
> _______________________________________________
> Interest mailing list
> Interest at qt-project.org
> http://lists.qt-project.org/mailman/listinfo/interest

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.qt-project.org/pipermail/interest/attachments/20160608/f3412eb4/attachment.html>