QML初始化ComboBox遇到的问题
程序员文章站
2022-04-12 13:15:36
...
近期学习Qt,记录下学习过程,以免忘记。操作环境 WIN7+Qt 5.11.2。
新建 Qt Quick Application - Empty 项目,命名 ComboBoxDemo。
编辑 main.qml,添加 Rectangle 和 ComboBox。
main.qml
import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Controls 2.4
Window {
visible: true
width: 640
height: 480
title: qsTr("Hello ComboBox")
Rectangle{
id:rect
width: 200
height: 200
color:"red"
}
ComboBox{
id:cb
anchors.left: rect.right
model:ListModel{
id:cbmodel
ListElement{
text : "green"
}
ListElement{
text : "blue"
}
ListElement{
text : "yellow"
}
}
onCurrentIndexChanged: {
rect.color = cbmodel.get(cb.currentIndex).text;
}
}
Component.onCompleted: {
cb.currentIndex = 1
}
}
目前为止一切正常,rect也有按预计的显示颜色。
现在我要把颜色存储下来,再次打开时显示存储的颜色。
编辑_main.qml_
...
import QtQuick.LocalStorage 2.0
...
onCurrentIndexChanged: {
rect.color = cbmodel.get(cb.currentIndex).text;
saveColor(cbmodel.get(cb.currentIndex).text);
}
}
Component.onCompleted: {
//cb.currentIndex = 1
dbInit();
var color = checkColor();
console.log("color: " + color);
}
function dbInit(){
var db = LocalStorage.openDatabaseSync("combo","1.0","ComboBox Database",100000);
try{
db.transaction(function(tx){
tx.executeSql('CREATE TABLE IF NOT EXISTS combo(rect TEXT,color TEXT)');
})
} catch(err){
console.log("Error creating table in database: " + err);
};
}
function dbGetHandle()
{
try {
var db = LocalStorage.openDatabaseSync("combo","1.0","ComboBox Database",100000);
} catch (err) {
console.log("Error opening database: " + err)
}
return db;
}
function saveColor(color){
console.log("saveColor : " + color);
var db = dbGetHandle();
db.transaction(function(tx){
tx.executeSql('UPDATE combo set color=? WHERE rect=?',[color,"rect"]);
});
}
function checkColor(){
var db = dbGetHandle();
var color;
var rs;
var rowid = 0;
db.transaction(function(tx){
rs = tx.executeSql('SELECT * FROM combo WHERE rect="rect"');
});
if(rs.rows.length > 0)
{
color = rs.rows.item(0).color;
return color;
}else{
db.transaction(function(tx){
tx.executeSql('INSERT INTO combo VALUES(?,?)',["rect","red"]);
rs = tx.executeSql('SELECT last_insert_rowid()')
rowid = rs.insertId;
});
console.log("INSERT" + rowid);
if(rowid > 0){
return "red";
}else{
return 0;
}
}
}
现在开始不正常了。
选择ComboBox颜色后,rect能正常显示对应颜色,数据库也存储正常。但是重新打开程序后,数据库被重置了,并不是之前选择的颜色,而是Model的第一个颜色:green。为什么会这样呢?
后来发现ComboBox在初始化的时候会触发onCurrentIndexChanged事件,将currentIndex=0的颜色存储下来。这个就不太好了…如何判断手动触发还是自动触发这个事件呢?
翻阅文档,发现这样一条信息:
activated(int = index)
This signal is similar to currentIndex changed, but will only be emitted if the combo box index was changed by the user, not when set programmatically.
index is the activated model index, or -1 if a new string is accepted.
The corresponding handler is onActivated.
替换 onCurrentIndexChanged 为 onActivated,问题解决。
最终代码:
main.qml
...
onActivated: {
console.log("actived");
rect.color = cbmodel.get(cb.currentIndex).text;
saveColor(cbmodel.get(cb.currentIndex).text);
}
}
Component.onCompleted: {
//cb.currentIndex = 1
dbInit();
var color = checkColor();
console.log("color: " + color);
switch(color)
{
case "green" :
cb.currentIndex = 0;
break;
case "blue" :
cb.currentIndex = 1;
break;
case "yellow" :
cb.currentIndex = 2;
break;
}
rect.color = color;
}
...
学习中,多有不足,欢迎拍砖。
推荐阅读
-
Vue中用props给data赋初始值遇到的问题解决
-
linux下tar命令遇到error:"Error exit delayed from previous errors"的问题及解决
-
一键GHOST硬盘版 gho_run.exe遇到问题需要关闭问题的解决方法
-
遇到QQ浏览器没有搜索框这样的问题怎么解决?
-
解决plsql遇到乱码的问题
-
解决Python的str强转int时遇到的问题
-
解决Windows环境下安装 mysql-8.0.11-winx64 遇到的问题
-
html5 application cache遇到的严重问题
-
解决cordova+vue 项目打包成APK应用遇到的问题
-
详解spring cloud Feign使用中遇到的问题总结