0

QML でスクロール可能なリストを作成しようとしています。

正常に実行されていますが、メインウィンドウのサイズを変更すると、リストのパターンが歪んだり、項目が互いに重なり合ったりします。

私のコードのどこにバグがあるか提案。

アンカーを変更しようとしましたが、問題は解決しませんでした。

以下はコードスニペットです

import QtQuick 1.1

Item{
    ....

    Rectangle{
        ....

        Rectangle {
        ....
            color: "white"
            anchors.centerIn: main.Center

            Rectangle {
                ...

                ListView {
                    id: list_min
                    ....

                    snapMode: ListView.SnapToItem
                    model: 20
                    delegate: Rectangle{
                        width: list_min.width
                        height: list_min.height
                        color: "transparent"

                        Text {
                            anchors.verticalCenter: parent.verticalCenter
                            text: index+1
                            font.pixelSize: parent.width/1.5
                        }

                        Text {
                            text: index+2
                            font.pixelSize: parent.width/1.5
                            anchors.top: parent.top
                            anchors.topMargin: 150
                        }

                        Text {
                            text: index
                            font.pixelSize: parent.width/1.5
                            anchors.bottom: parent.bottom
                            anchors.bottomMargin: 150
                        }
                    }

                    onMovementEnded: list_min.currentIndex = list_min.visibleArea.yPosition * list_min.count

                    Component.onCompleted: list_min.visibleArea
                }

                Rectangle {
                  ....
                    gradient: Gradient {
                        GradientStop { position: 0.0; color: "black" }
                        ....
                        GradientStop { position: 1.0; color: "black" }
                    }
                }
            }
        }
4

1 に答える 1

1

Columnタグを使用して、デリゲートにテキスト要素を配置することをお勧めします。また、overlay_minの場合は、height＆widthまたはanchors.fillのいずれかを設定する必要がありますが、両方を設定する必要はありません。

ソースコードを次のように変更しました。

import QtQuick 1.1

Item{
    width: 300
    height: 240

    Rectangle{
    id:main
    width: parent.width
    height: parent.height

    Rectangle {
        id :frame_min
        width: 120
        height: main.height
        color: "white"
        anchors.centerIn: main.Center

        Rectangle {
            id: mSpinner
            anchors.centerIn: parent
            width: frame_min.width - 10
            height: frame_min.height
            color: "white"
            border.color: "black"
            border.width: 5

            ListView {
                id: list_min
                width: mSpinner.width
                height: mSpinner.height
                anchors.topMargin: 0
                anchors.top: parent.top
                clip: true

                snapMode: ListView.SnapToItem
                model: 20
                delegate: Rectangle{
                    width: list_min.width
                    height: list_min.height
                    color: "transparent"

                    Column{
                        anchors.verticalCenter: parent.verticalCenter
                        Text {
                            //anchors.verticalCenter: parent.verticalCenter
                            text: index+1
                            font.pixelSize: list_min.width/1.5
                        }

                        Text {
                            text: index+2
                            font.pixelSize: list_min.width/1.5
                            //anchors.top: parent.top
                            //anchors.topMargin: 150
                        }

                        Text {
                            text: index
                            font.pixelSize: list_min.width/1.5
                            //anchors.bottom: parent.bottom
                            //anchors.bottomMargin: 150
                        }
                    }
                }

                onMovementEnded: list_min.currentIndex = list_min.visibleArea.yPosition * list_min.count

                Component.onCompleted: list_min.visibleArea
            }

            Rectangle {
                id: overlay_min
                width: frame_min.width
                height: frame_min.height
                //anchors.fill: frame_min
                gradient: Gradient {
                    GradientStop { position: 0.0; color: "black" }
                    GradientStop { position: 0.34; color: "transparent" }
                    GradientStop { position: 0.35; color: "white" }
                    GradientStop { position: 0.66; color: "transparent" }
                    GradientStop { position: 1.0; color: "black" }
                }
            }
        }
    }
    }
}
于 2012-11-19T14:34:13.990 に答える