Skip to content

Commit 73a9083

Browse files
Polaris-NightPolaris-Night
committed
feat: 新增FluCheckBox三态复选框使用示例
1 parent f3204fb commit 73a9083

File tree

3 files changed

+113
-14
lines changed

3 files changed

+113
-14
lines changed

‎example/example_en_US.ts‎

Lines changed: 22 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1246,36 +1246,51 @@ Updated content:
12461246
<translation type="unfinished"></translation>
12471247
</message>
12481248
<message>
1249-
<location filename="qml/page/T_CheckBox.qml" line="18"/>
1249+
<location filename="qml/page/T_CheckBox.qml" line="52"/>
12501250
<source>A 2-state CheckBox</source>
12511251
<translation type="unfinished"></translation>
12521252
</message>
12531253
<message>
1254-
<location filename="qml/page/T_CheckBox.qml" line="32"/>
1254+
<location filename="qml/page/T_CheckBox.qml" line="66"/>
12551255
<source>Right</source>
12561256
<translation type="unfinished"></translation>
12571257
</message>
12581258
<message>
1259-
<location filename="qml/page/T_CheckBox.qml" line="36"/>
1259+
<location filename="qml/page/T_CheckBox.qml" line="70"/>
12601260
<source>Left</source>
12611261
<translation type="unfinished"></translation>
12621262
</message>
12631263
<message>
1264-
<location filename="qml/page/T_CheckBox.qml" line="46"/>
1265-
<location filename="qml/page/T_CheckBox.qml" line="101"/>
1264+
<location filename="qml/page/T_CheckBox.qml" line="80"/>
1265+
<location filename="qml/page/T_CheckBox.qml" line="135"/>
12661266
<source>Disabled</source>
12671267
<translation type="unfinished"></translation>
12681268
</message>
12691269
<message>
1270-
<location filename="qml/page/T_CheckBox.qml" line="64"/>
1270+
<location filename="qml/page/T_CheckBox.qml" line="98"/>
12711271
<source>A 3-state CheckBox</source>
12721272
<translation type="unfinished"></translation>
12731273
</message>
12741274
<message>
1275-
<location filename="qml/page/T_CheckBox.qml" line="75"/>
1275+
<location filename="qml/page/T_CheckBox.qml" line="109"/>
12761276
<source>Three State</source>
12771277
<translation type="unfinished"></translation>
12781278
</message>
1279+
<message>
1280+
<location filename="qml/page/T_CheckBox.qml" line="154"/>
1281+
<source>Using a 3-state CheckBox</source>
1282+
<translation type="unfinished"></translation>
1283+
</message>
1284+
<message>
1285+
<location filename="qml/page/T_CheckBox.qml" line="157"/>
1286+
<source>Select all</source>
1287+
<translation type="unfinished"></translation>
1288+
</message>
1289+
<message>
1290+
<location filename="qml/page/T_CheckBox.qml" line="168"/>
1291+
<source>Option %1</source>
1292+
<translation type="unfinished"></translation>
1293+
</message>
12791294
</context>
12801295
<context>
12811296
<name>T_Clip</name>

‎example/example_zh_CN.ts‎

Lines changed: 22 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1272,36 +1272,51 @@ Updated content:
12721272
<translation type="unfinished">复选框</translation>
12731273
</message>
12741274
<message>
1275-
<location filename="qml/page/T_CheckBox.qml" line="18"/>
1275+
<location filename="qml/page/T_CheckBox.qml" line="52"/>
12761276
<source>A 2-state CheckBox</source>
12771277
<translation type="unfinished">两状态复选框</translation>
12781278
</message>
12791279
<message>
1280-
<location filename="qml/page/T_CheckBox.qml" line="32"/>
1280+
<location filename="qml/page/T_CheckBox.qml" line="66"/>
12811281
<source>Right</source>
12821282
<translation type="unfinished">右</translation>
12831283
</message>
12841284
<message>
1285-
<location filename="qml/page/T_CheckBox.qml" line="36"/>
1285+
<location filename="qml/page/T_CheckBox.qml" line="70"/>
12861286
<source>Left</source>
12871287
<translation type="unfinished">左</translation>
12881288
</message>
12891289
<message>
1290-
<location filename="qml/page/T_CheckBox.qml" line="46"/>
1291-
<location filename="qml/page/T_CheckBox.qml" line="101"/>
1290+
<location filename="qml/page/T_CheckBox.qml" line="80"/>
1291+
<location filename="qml/page/T_CheckBox.qml" line="135"/>
12921292
<source>Disabled</source>
12931293
<translation type="unfinished">禁用</translation>
12941294
</message>
12951295
<message>
1296-
<location filename="qml/page/T_CheckBox.qml" line="64"/>
1296+
<location filename="qml/page/T_CheckBox.qml" line="98"/>
12971297
<source>A 3-state CheckBox</source>
12981298
<translation type="unfinished">三状态复选框</translation>
12991299
</message>
13001300
<message>
1301-
<location filename="qml/page/T_CheckBox.qml" line="75"/>
1301+
<location filename="qml/page/T_CheckBox.qml" line="109"/>
13021302
<source>Three State</source>
13031303
<translation type="unfinished">三状态</translation>
13041304
</message>
1305+
<message>
1306+
<location filename="qml/page/T_CheckBox.qml" line="154"/>
1307+
<source>Using a 3-state CheckBox</source>
1308+
<translation type="unfinished">使用三状态复选框</translation>
1309+
</message>
1310+
<message>
1311+
<location filename="qml/page/T_CheckBox.qml" line="157"/>
1312+
<source>Select all</source>
1313+
<translation type="unfinished">选中全部</translation>
1314+
</message>
1315+
<message>
1316+
<location filename="qml/page/T_CheckBox.qml" line="168"/>
1317+
<source>Option %1</source>
1318+
<translation type="unfinished">选项 %1</translation>
1319+
</message>
13051320
</context>
13061321
<context>
13071322
<name>T_Clip</name>

‎example/qml/page/T_CheckBox.qml‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,40 @@ FluScrollablePage{
99

1010
title: qsTr("CheckBox")
1111

12+
QtObject {
13+
id: controller
14+
readonly property bool checked: allChecked()
15+
readonly property bool indeterminate: !allChecked() && anyChecked()
16+
property var items: []
17+
function addItem(id, item) {
18+
const ref = items
19+
ref.push({
20+
"id": id,
21+
"item": item
22+
})
23+
items = ref
24+
}
25+
function setItemChecked(id, checked) {
26+
const ref = items
27+
const index = ref.findIndex(obj => obj.id === id)
28+
if (index !== -1) {
29+
ref[index].item.checked = checked
30+
}
31+
items = ref
32+
}
33+
function setAllChecked(checked) {
34+
const ref = items
35+
ref.forEach(obj => obj.item.checked = checked)
36+
items = ref
37+
}
38+
function allChecked() {
39+
return items.every(obj => obj.item.checked)
40+
}
41+
function anyChecked() {
42+
return items.some(obj => obj.item.checked)
43+
}
44+
}
45+
1246
FluFrame{
1347
Layout.fillWidth: true
1448
Layout.preferredHeight: 72
@@ -110,4 +144,39 @@ FluScrollablePage{
110144
}'
111145
}
112146

147+
FluFrame{
148+
Layout.fillWidth: true
149+
padding: 10
150+
Layout.topMargin: 20
151+
152+
ColumnLayout {
153+
FluText{
154+
text: qsTr("Using a 3-state CheckBox")
155+
}
156+
FluCheckBox {
157+
text: qsTr("Select all")
158+
checked: controller.checked
159+
indeterminate: controller.indeterminate
160+
clickListener: function () {
161+
controller.setAllChecked(!checked)
162+
}
163+
}
164+
Repeater {
165+
model: 3
166+
FluCheckBox {
167+
Layout.leftMargin: 24
168+
text: qsTr("Option %1").arg(index)
169+
clickListener: function () {
170+
controller.setItemChecked(this.toString(), !checked)
171+
}
172+
}
173+
onItemAdded: (index, item) => {
174+
controller.addItem(item.toString(), item)
175+
if (index === count - 1) {
176+
controller.setItemChecked(item.toString(), true)
177+
}
178+
}
179+
}
180+
}
181+
}
113182
}

0 commit comments

Comments
 (0)