QT Quick Qml 之property alias别名使用(Column和Repeater升级版本)

文章目录

简单介绍
实例一
实例二

简单介绍

alias别名，一般用在实例化其它控件，而需要修改实例化后的子控件属性时候使用。比如A.qml中实例化了B(来源B.qml)，又想改其子控件的具体属性，这个时候就可以用“alias”。服务员上菜：

实例一

B 中 AliasBase.qml文件中：

import QtQuick 2.0
import QtQuick.Window 2.2
import QtQuick.Controls 2.2

Column {
    id:         _root;
    spacing:    4

    //[重点1]
    property alias  title:              titleLabel.text

    Label {
        id: titleLabel;
        text:  "..."            //[重点2]
        anchors.horizontalCenter:  parent.horizontalCenter;
        horizontalAlignment :      Text.AlignHCenter;
        color: "black";
        font.bold:  true;
        font.pixelSize: 36;
    }
}

A 中 AliasMain.qml，中代码：

import QtQuick 2.0
import QtQuick.Window 2.2

Window {
    visible: true;
    width:  300;
    height: 250;

    AliasBase {  //主要一定要大写呀
        id: aliBase;
        title:  qsTr("Rename");   //[重点3]
    }
}

运行结果：
在这里插入图片描述
在A中实例化B后，利用“alias”，就能修改其子控件Label 的 text。看注释的[重点1~3]，一目了然。

实例二

在上述基础上，来一个稍微高级一点的，传入“mode”，如下：

B中：AliasBase.qml （一定要大写），它源于实例：QT Quick QML 布局——定位置布局(Row、Column、Grid、Flow和Repeater)

import QtQuick 2.0
import QtQuick.Window 2.2
import QtQuick.Controls 2.2

Column {
    id:         _root;
    spacing:    4

    //[重点1]
    property alias  title:              titleLabel.text
    property alias  model:              studentPropert.model

    Label {
        id: titleLabel;
        text:  "..."           //[重点2]
        anchors.horizontalCenter:  parent.horizontalCenter;
        horizontalAlignment :      Text.AlignHCenter;
        color: "black";
        font.bold:  true;
        font.pixelSize: 36;
    }

    Column {
        id:         repeaterColumn
        spacing:    4
        
        Repeater {                 //重复
            id:     studentPropert;
            //[屏蔽了mode，和相关变量propertyNames]
//            property var propertyNames:  [ qsTr("Name: "), qsTr("Age: "), qsTr("Sex: "), qsTr("Class: "), qsTr("Math Scores: ") ]
//            model: [ qsTr("ZhangSan"), qsTr("17"), qsTr("Man"), qsTr("216"), qsTr("98")]
            Row{
                spacing:    4
                Text {
                    text:       modelData.name;
                    font.bold:  true;
                    font.pointSize:              24;
                    color: "black";

                }
                Text {
                    text:       modelData.value;
                    font.pointSize:              24;
                    color: "red";
                }
            }
        }
    }
}

A中 AliasMain.qml，中代码：

import QtQuick 2.0
import QtQuick.Window 2.2

Window {
    visible: true;
    width:  300;
    height: 250;

    AliasBase {  //主要一定要大写呀
        id: aliBase;
        title:  qsTr("Rename");     //[重点3]传入title
        model: [                    //传入model，使用的时候 modelData.name、modelData.value
            {
                name:    "Name: ",
                value:  "ZhangSan",
            },
            {
                name:    "Age: ",
                value:  "17",
            },
            {
                name:    "Sex: ",
                value:  "Man",
            },
            {
                name:    "Class: ",
                value:  "216",
            },
            {
                name:    "Math Scores: ",
                value:  "98",
            }
        ]
    }
}