Flickable + псевдоним содержимого
Я заметил странное поведение, которое мешает мне делать то, что я хочу.
Если у меня есть
Comp.qml:
Rectangle {
id: comp;
anchors.fill: parent
default property alias contents: flickable.children;
property int contentHeight: comp.height;
Flickable {
id: flickable;
anchors.fill: parent;
contentHeight: comp.contentHeight;
}
}
а также
main.qml:
Rectangle {
id: root;
width: 400;
height: 400;
Comp {
contentHeight: 800;
Rectangle {
width: 800;
height: 800;
border.color: "black";
border.width: 5;
Component.onCompleted: console.debug(parent)
}
}
}
Мерцание не работает.
Если я попытаюсь поместить все это в один файл, он будет работать, как и ожидалось:
main.qml:
Rectangle {
id: root;
width: 400;
height: 400;
Rectangle {
id: comp;
anchors.fill: parent
Flickable {
id: flickable;
anchors.fill: parent;
contentHeight: 800;
Rectangle {
width: 800;
height: 800;
border.color: "black";
border.width: 5;
}
}
}
}
Я что-то пропустил?
Как сделать внешний компонент, содержимое которого находится во флэкинге?
1 ответ
Как указано в документах:
Элементы, объявленные как дочерние элементы Flickable, автоматически добавляются в contentItem Flickable. Элементы, созданные динамически, должны быть явно связаны с contentItem
Это не первый случай здесь, то есть Rectangle
получил от Flickable
сам и не подвергает ожидаемому поведению. Возможно, дополнение к children
в этом случае не запускает правильное родительское воспитание. В качестве быстрого исправления вы можете переопределить элемент, как только он будет добавлен в Comp
тип.
Для обработки нескольких Item
внутри вашего Comp
просто используйте уникального ребенка (а-ля ScrollView
). Здесь я изменил пример для обработки двух Rectangle
s (только что добавил clip
в Comp
в эстетических целях).
В основном:
Rectangle {
id: root;
width: 400;
height: 400;
Comp {
contentHeight: col.height;
Column {
id: col
spacing: 20
Rectangle {
width: 800;
height: 800;
border.color: "black";
border.width: 5;
}
Rectangle {
width: 800;
height: 800;
border.color: "black";
border.width: 5;
}
}
Component.onCompleted: console.debug(col.parent) // <-- not flickable
}
}
в Comp.qml
файл:
Rectangle {
id: comp;
anchors.fill: parent
default property alias contents: flickable.children;
property int contentHeight: comp.height;
Flickable {
z:1
clip: true // just my taste!
id: flickable;
anchors.fill: parent;
contentHeight: comp.contentHeight;
}
onContentsChanged: { // re-parenting
if(flickable.children[1] !== undefined)
flickable.children[1].parent = flickable.contentItem
}
}