QML PathView 效果

最新推荐文章于 2025-04-20 02:58:08 发布

UbuntuKylin

最新推荐文章于 2025-04-20 02:58:08 发布

阅读量1.7k

点赞数 1

分类专栏： QML

QML 专栏收录该内容

22 篇文章

订阅专栏

本文介绍了一个使用ListModel和PathView创建的动态水果视图展示案例，其中包括蓝莓、金橘和葡萄等元素，并通过图片和文字详细展示了每种水果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ListModel {
    id: model
    ListElement { fruit: "Bilberry"; 
                  picture: "http://upload.wikimedia.org/wikipedia/commons/9/91/Norwegian_blueberries.jpg" }
    ListElement { fruit: "Kumquat"; 
                  picture: "http://upload.wikimedia.org/wikipedia/commons/8/82/Kumquat.jpeg" }
    ListElement { fruit: "Grapefruit"; picture: 
                  "http://upload.wikimedia.org/wikipedia/commons/thumb/b/bb/
Table_grapes_on_white.jpg/250px-Table_grapes_on_white.jpg" }
}
Component {
    id: delegate
    Item {
        width: 100; height: 100
        scale: PathView.scale
        Column { Image { anchors.fill: parent; source: picture;  } 
                 Text { text: fruit; font.pointSize: 24; }
        }
    }
}
PathView {
    anchors.fill: parent
    model: model;
    delegate: delegate
    path: Path {
        startX: 100; startY: 100
        PathAttribute { name: "scale"; value: 0.5 }
        PathLine { x:200; y:200 }
        PathAttribute { name: "scale"; value: 1.0 }
        PathLine { x:300; y:100 }
        PathLine { x:100; y:100 }
    }
}

原文链接