[solved] Create a custom view

[Merinas]

Hi,

I tried to create a custom view. I want to place my Component on a circle for that i used a Repeater. I've done something like that :

@Item
{
id:root
property alias model :rept.model
property int size: 100

Rectangle
{
id:area
anchors.fill: parent
anchors.margins: size/2

Repeater
{
id:rept

Image
{
width:size
height:size
x: area.width/2*(1+Math.cos(6.28/rept.countindex))-width/2
y: area.height/2(1+Math.sin(6.28/rept.count*index))-height/2
source:"img/"+iconFile //see model
}
}
}
}@

That's working fine. But now I want to add a delegate to let the user place anything he wants, in this view. I know how to add a property Component for the delegate but how should i use it to duplicate the delegate for each item of the model?

[mbrasser]

Hi,

You could try using a Loader for this (using e.g. the sourceComponent property).

Also, have you looked into PathView at all? It might be an alternative for providing a circular view.

Regards,
Michael

[Merinas]

Yes, I look around PathView. But I failed to add a variable number of points in my path. Like i can't use (or manage) Repeater.

I guess it's more interesting to did it without a pathView, just for challenge and learning. :)

Anyway, I will check Loader and if I failed I will use a PathView.
Thanks

[Merinas]

I've finished my custom view, thanks again for the advice, it was really helpful.

For the record, I show you my solution :

@import QtQuick 1.0

Item {
id:area

property alias model: rept.model
property Component delegate:Component { Rectangle{} }

property real s: Math.sin(Math.PI/rept.count)
property real w_item: area.width*(s/(1+s))
property real h_item: area.height*(s/(1+s))

property real w_circle: area.width-area.w_item
property real h_circle: area.height-area.h_item

Repeater
{
id:rept
Loader
{
sourceComponent: delegate;
width : area.w_item
height:area. h_item
x: area.w_circle/2*(1+Math.cos(2Math.PI/rept.countindex))
y: area.h_circle/2*(1+Math.sin(2Math.PI/rept.countindex))
}
}
}@