1 背景
Qt开发常用于跨平台开发的首选,所以关于Qt开发的编码规范也很重要。
2 QWidget
【规范】信号命名:sgl+驼峰命名规则,如:sglUpdate();
【规范】槽函数:on+驼峰命名规则,如:onUpdate();
【规范】由编译器自动生成的槽函数(如on_btn_clicked())不做改动;
【规范】控件命名采用驼峰命名规则;如
控件名 | 缩写 |
QPushButton | pbtn |
QRadioButton | rbtn |
QToolButton | tbtn |
QLabel | lbl |
QWidget | widget |
QLineEdit | ldt |
QTextEdit | text |
QTextBrowser | text |
QTabWidget | tab |
QTableWidget | tbw |
QTableView | tbv |
QStackedWidget | stack |
QCheckBox | chk |
QComboBox | cbx |
QGroupBox | gbx |
QListzView | list |
QListWidget | list |
QTreeWidget | tree |
QTreeView | tree |
QSpinBox | sbx |
QDoubleSpinBox | dsbx |
QDataeEdit | date |
QTimerEdit | time |
QDateTimeEdit | datetime |
QProgressBar | pgb |
3 QML
【规范】属性的命名:使用变量驼峰命名,如:property bool thumbnail: false,分号后接空格再接值;
【规范】信号的命名:sgl+变量驼峰命名,如:signal sglSetFreq()。
【规范】函数的命令:函数和参数均使用驼峰命名,如:function changeShowBtnSize(var rect_height, var rect_width)。
【规范】关于槽函数的命名,可使用:onSgl + 变量驼峰命名,如:function onSglUpdate()。
【规范】分组属性,如果使用一个属性组中的多个属性,使用大括号将各子属性包含,阅读性和代码简洁性更好。
推荐 | 不推荐 |
Rectangle{ anchors{ left: parent.left; top: parent.top; right: parent.right; leftMargin: 20; } } |
Rectangle{ anchors.left: parent.left; anchors.top: parent.top; anchors.right: parent.right; anchors.leftMargin: 20; } |
【规范】list的使用,如果只包含单个元素,可省略大括号;
list有多个元素 |
list有单个元素 |
states:[ State { name: "open" PropertyChanges { target: container width: 200 } } State { name: "close" PropertyChanges { target: container width: 0 } } ] |
states: State { name: "open" PropertyChanges { target: container width: 200 } }
|
【规范】JavaScript的使用;
单行脚本,用分号隔开,分号后接空格 |
Rectangle {color: "blue"; wdth: parent.width / 3} |
几行(a couple of)脚本,大括号包含 |
Rectangle { color: "blue" width: { var w = parent.width / 3; console.debug(w); return w; } } |
多行(more than a couple of)脚本,将函数定义到 Js 文件,并导入使用 |
import "myscript.js" as Script Rectangle { color: "blue"; width: Script.calculateWidth(parent); } |
【规范】分号的使用,一个代码块中,如果代码超过一行,用分号隔开,否则不加分号,如:
不加分号 |
加分号 |
Rectangle { anchors.left: parent.left anchors.top: parent.top anchors.right: parent.right anchors.leftMargin: 20 } |
Rectangle { anchors { left: parent.left; top: parent.top; right: parent.right; leftMargin: 20; } } |
Rectangle { id: id_photo property bool thumbnail: false signal clicked |
MouseArea { anchors.fill: parent onClicked: { var scenePos = mapToItem(null, mouseX, mouseY); console.log("MouseArea was clicked at scene pos " + scenePos); } } |
【规范】大括号的使用,与 C/C++不同的是,左大括号不应独占一行,而与组件名、函数放在同一行;
不推荐 |
推荐 |
Rectangle { anchors { left: parent.left; top: parent.top; right: parent.right; leftMargin: 20; } } |
Rectangle { anchors { left: parent.left; top: parent.top; right: parent.right; leftMargin: 20; } } |
function fun() { } |
function fun() { } |
规范】空格的使用,如下:
组件名与大括号之间加空格 |
Rectangle { } |
冒号后接空格;单行代码末尾大括号之前接空格 |
Rectangle { id: id_root } |
单行代码分号后接空格 |
Rectangle { color: "blue"; width: parent.width } |
【规范】QML 文件说明与 C/C++定义一致,见 2.1.2,定义顺序为:id、property declarations、signal declarations、JavaScript functions、object properties、child objects、states、transitions,如: