Якорь QML ListView, margin = 0 выходит за пределы родительской заливки? - PullRequest
Новая
       28

Якорь QML ListView, margin = 0 выходит за пределы родительской заливки?

1 голос
/ 12 февраля 2020

Мне было интересно, почему этот др aws компоненты Icon за пределами заполнения Item? Использование Qt 5.5.1 

import QtQuick 2.5

Item {
    id: root

    // width: 960    // Actually set in the higher level view
    // height: 540   // Actually set in the higher level view

    ListModel {
        id: items
        ListElement { icon: 'a.png', label: 'Example', x: 0, y: 0 }
        ListElement { icon: 'b.png', label: 'Something', x: 100, y: 0 }
        ListElememt { icon: 'c.png', label: 'Testing', x: 200, y: 50 }
    }

    ListView {
        model: items
        delegate: Icon {
            text: model.label
            iconSrc: model.icon
            anchors {
                top: parent.top
                left: parent.left
                leftMargin: model.x
                topMargin: model.y
            }
        }
        anchors {
            top: parent.top
            left: parent.left
        }
    }

}

Первые два значка (y = 0) появятся примерно на 15 пикселей вне содержащего Item, когда оно находится внутри представления более высокого уровня.

Если я сделаю это следующим образом (без ListView), они появятся в правильном положении (y = 0), ie. они будут находиться внутри содержащего Item при использовании в представлении более высокого уровня. 

import QtQuick 2.5

Item {
    id: root

    // width: 960    // Actually set in the higher level view
    // height: 540  // Actually set in the higher level view

    Icon {
        text: 'Example'
        iconSrc: 'a.png'
        anchors {
            top: parent.top
            left: parent.left
            leftMargin: 0
            topMargin: 0
        }
    }

    Icon {
        text: 'Something'
        iconSrc: 'b.png'
        anchors {
            top: parent.top
            left: parent.left
            leftMargin: 100
            topMargin: 0
        }
    }

    Icon {
        text: 'Testing'
        iconSrc: 'c.png'
        anchors {
            top: parent.top
            left: parent.left
            leftMargin: 200
            topMargin: 50
        }
    }
}

Почему компоненты Icon отображаются в другом положении при создании внутри ListView по сравнению с прямыми определениями, когда используя одинаковые значения "X, Y" для обоих?

1 Ответ

1 голос
/ 12 февраля 2020

Цель ListView - показать набор элементов в виде списка, чтобы якоря не могли быть установлены, поскольку геометрия обрабатывается ListView, вместо этого должен использоваться Repeater: 

import QtQuick 2.5

Item {
    id: root

    // width: 960    // Actually set in the higher level view
    // height: 540   // Actually set in the higher level view

    ListModel{
        id: items
        ListElement { icon: 'a.png'; label: 'Example'; x: 0; y: 0 }
        ListElement { icon: 'b.png'; label: 'Something'; x: 100; y: 0 }
        ListElement { icon: 'c.png'; label: 'Testing'; x: 200; y: 50 }
    }

    Repeater {
        model: items
        delegate: Icon {
            text: model.label
            source: model.icon
            anchors {
                top: parent.top
                left: parent.left
                leftMargin: model.x
                topMargin: model.y
            }
        }
    }
}
...