1. 程式人生 > >qml ListModel與Repeater編寫重複控制元件介面

qml ListModel與Repeater編寫重複控制元件介面

ListModel與Repeater編寫重複控制元件介面例項,當熱要實現重複控制元件的方式有很多種,例如使用Listview、Repeater 等,但為什麼要寫這種方式,主要是平時使用的比較少加深一下印象,廢話不多說。

Rectangle{
        id:equip
        anchors.fill: parent
        color:"#A0000000"
        radius:10
        border{color:"white";width:2}
        Column{
            anchors.centerIn: parent
            spacing: 20
            ListModel{
                id:paraModel
                property var valueFunc:{
                    "text1":{get:test.gettext1,set:test.settext1},
                    "text2":{get:test.gettext2,set:test.settext1},
                    "text3":{get:test.gettext3,set:test.settext1},
                    "text4":{get:test.gettext4,set:test.settext1},
                    "text5":{get:test.gettext5,set:test.settext1},
                    "text6":{get:test.gettext6,set:test.settext1},
                    "text7":{get:test.gettext7,set:test.settext1},
                    "text8":{get:test.gettext8,set:test.settext1},
                    "text9":{get:test.gettext9,set:test.settext1}
                }
                ListElement{
                    name:QT_TR_NOOP("text1");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text2");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text3");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text4");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text5");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text6");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text7");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text8");unit:qsTr("s")
                }
                ListElement{
                    name:QT_TR_NOOP("text9");unit:qsTr("s")
                }
            }
            Repeater{
                id:repeater
                model:paraMode
                Row {
            id: row
            spacing: 5
            MyComp.LightText{
                id: startText
                text:qsTr(name);
            }
            MyComp.LightTextInput{
                id: infoInput
                focus: true
                onReturnValue: {
                            paraModel.valueFunc[name].set(txtvalue)
                            changed = true
                            }
            }
            MyComp.LightText{
                id: units
                text:unit
            }
            }
            }
            Component.onCompleted: {
                var i
                for(i = 0; i < repeater.count;i++){
                    var item = repeater.itemAt(i)
                    item.KeyNavigation.down = repeater.itemAt((i+1)%repeater.count)
                }
            }
        }
    }

沒什麼技術難度所以就不解釋了。