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). Здесь я изменил пример для обработки двух Rectangles (только что добавил 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
    }
}
Другие вопросы по тегам