qml善用迭代

本文介绍了如何在QML中利用Repeater组件进行布局管理,特别是在创建列表和工具条时的应用。通过示例展示了如何结合Column、Flickable等组件创建可滚动列表,并利用QmlObjectListModel进行数据绑定,以及自定义VGToolButton控件来实现功能按钮的动态添加和管理。
摘要由CSDN通过智能技术生成

qml虽然是js关联Qt,但是他并没有把QWidget关联在一起,qml的绘制是使用类似directshow的一种绘制方式就是全局都是一些item,并不是使用窗口;

很多时候我们要需要布局一些类似的东西,用Row, Column, Grid布局,这时候就要善用Repeater, Repeater给这些布局使用, 用起来效果很好比如我要绘制一个列表并且可以滚动

Flickable {

       signal detailRout(var rt) 
        id:                     routeCol
        clip:                   true
        anchors {top: btnCreate.bottom; topMargin: 2; left: parent.left; right: parent.right; bottom: parent.bottom}
        contentHeight:          colBoundary.height
        contentWidth:           width
        flickableDirection:     Flickable.VerticalFlick
        Column{
            id: colBoundary
            visible:                    true
            spacing:                    4
            Rectangle{
                color:      "transparent"
                width:      routeCol.width
                height:     1
            }
            Repeater{
                model: mapManager.getSpecItems(MapAbstractItem.Type_FlyRoute)
                delegate: Rectangle{
                    width:          routeCol.width
                    height:         itemLand1.height+10
                    color:          object.itemColor
                    visible:        object.visible
                    border          {width: 1; color: object.selected ? "#b7C2FF":"transparent"}
                    MouseArea{
                        anchors.fill: parent
                        onClicked: {emit:selectRoute(object)}
                    }
                    Column{
                        id:         itemLand1
                        clip:       true
                        spacing:    4
                        anchors {left: parent.left; leftMargin: 10; right: it

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值