QML与C++交互:登陆界面设计
本文博客链接:http://blog.csdn.net/jdh99,作者:jdh,转载请注明.
环境：
主机:WIN7
开发环境:Qt5.2.1
说明:
QML设计前台界面,C++后台负责逻辑
效果图:
源码:
前台qml文件
login.qml
/*********************************************************************
* 登陆界面qml文件
* (c)copyright 2014,jdh
* All Right Reserved
*新建日期:2014/4/29 by jdh
*改动日期:2014/4/30 by jdh
*改动日期:2014/5/4 by jdh
*改动日期:2014/5/5 by jdh
**********************************************************************/import QtQuick 2.0
import "content"
import Login_Gui 1.0Rectangle
{id: loginwidth: 320; height: 512SystemPalette { id: activePalette }//C++组件:用户界面Login_Gui{id:login_guionSig_login_result:{//关闭登陆动画load_gif.opacity = 0//依据登陆结果处理switch (result){//登陆成功case 0:message.text = "登陆成功"message.opacity = 1break;//无此usernamecase 1:message.text = "登陆失败:无此username"message.opacity = 1break;//password错误case 2:message.text = "登陆失败:password错误"message.opacity = 1break;//达到最大登陆次数case 3:message.text = "登陆失败:达到最大登陆次数"message.opacity = 1break;}}}//背景图片Image{id: backgroundanchors { top: parent.top; bottom: parent.bottom }anchors.fill: parentsource: "pics/pic1.png"fillMode: Image.PreserveAspectCrop}//消息框Message{id: messagefont_size: login.height * 0.03anchors {centerIn: parent}opacity: 0}//登陆动画AnimatedImage{id: load_gif; source: "pics/load.gif"anchors {horizontalCenter: parent.horizontalCenter; verticalCenter: parent.verticalCenter}z: 100opacity: 0}//顶栏Item{id: top_barwidth: login.width; height: login.height * 0.06anchors.top: parent.topText{id: titleanchors { top: parent.top; horizontalCenter: parent.horizontalCenter }//text: "登陆"text: "登陆"font.bold: truefont.pointSize: login.height * 0.06 * 0.4color: "dark red"}}//空白栏Item{id: space1width: login.width; height: login.height * 0.1anchors.top: top_bar.bottom}//登陆框Rectangle{id: rect1width: login.width * 0.8; height: login.height * 0.3anchors { top: space1.bottom; horizontalCenter: parent.horizontalCenter }border.color: "#707070"color: "transparent"radius: 8Row{spacing: rect1.width * 0.05Item{width: rect1.width * 0.05; height: rect1.height}Column{spacing: rect1.height * 0.025Item{width: rect1.width * 0.8; height: rect1.height * 0.05}LineInput{id: txt_user_idwidth: rect1.width * 0.8; height: rect1.height * 0.2font_size:height * 0.7//anchors {horizontalCenter: rect1.horizontalCenter; top: rect1.top; topMargin: 8}hint: "请输入用户号"text:login_gui.user_id}LineInput{id: txt_passwordwidth: rect1.width * 0.8; height: rect1.height * 0.2font_size:height * 0.7//anchors {horizontalCenter: rect1.horizontalCenter; bottom: btn_login.top; bottomMargin: rect1.height * 0.1}hint: "请输入password"text:login_gui.password}Row{spacing: rect1.width * 0.1Button{id: btn_loginwidth: rect1.width * 0.35; height: rect1.height * 0.2//anchors { left: rect1.left; leftMargin: 28; bottom: rect1.bottom; bottomMargin: 8 }text: "登陆"onClicked: login_req()}Button{id: btn_quitwidth: rect1.width * 0.35; height: rect1.height * 0.2//anchors { right: rect1.right; rightMargin: 28; bottom: rect1.bottom; bottomMargin: 8 }text: "退出"onClicked:{Qt.quit();}}}Row{spacing: rect1.width * 0.1CheckBox{id: check1width: rect1.width * 0.35; height: rect1.height * 0.2//anchors { left: rect1.left; top: rect1.bottom }caption: "记住password"selected: login_gui.flag_remember}CheckBox{id: check2width: rect1.width * 0.35; height: rect1.height * 0.2//anchors { right: rect1.right; top: rect1.bottom }caption: "自己主动登陆"selected: login_gui.flag_auto}}}}}//android自带键处理FocusScope{focus: trueKeys.onReleased:{if (event.key == Qt.Key_Back){console.log("qml login quit")login.sig_btn_quit()}}}//登陆请求函数function login_req(){//推断username是否有效if (txt_user_id.text == ""){message.text = "请输入username"message.opacity = 1return}//推断password是否有效if (txt_password.text == ""){message.text = "请输入password"message.opacity = 1return}//显示登陆动画load_gif.opacity = 1//登陆请求login_gui.user_id = txt_user_id.textlogin_gui.password = txt_password.textlogin_gui.flag_remember = check1.selectedlogin_gui.flag_auto = check2.selectedlogin_gui.slot_login_req()}// //信号槽绑定
// Component.onCompleted:
// {
// login_gui.sig_user_id_changed.connect(login_gui.slot_btn_login)
// }
}
后台C++代码
main.c
/*********************************************************************
* 主文件
* (c)copyright 2014,jdh
* All Right Reserved
*新建日期:2014/1/27 by jdh
*改动日期:2014/1/28 by jdh
*改动日期:2014/2/4 by jdh
*改动日期:2014/2/18 by jdh
*改动日期:2014/2/27 by jdh
*改动日期:2014/2/28 by jdh
*改动日期:2014/3/1 by jdh
*改动日期:2014/4/10 by jdh
*改动日期:2014/5/4 by jdh
**********************************************************************/#include "world.h"
#include "main_gui.h"
#include "login_gui.h"
#include "light_gui.h"
#include "heart_beat.h"
#include "net.h"
#include "data_sync_center.h"
#include "set_ctrl_state.h"int main(int argc, char *argv[])
{QGuiApplication app(argc, argv);//注冊组件到QMLqmlRegisterType<Login_Gui>("Login_Gui", 1, 0, "Login_Gui");QtQuick2ApplicationViewer viewer;viewer.setMainQmlFile(QStringLiteral("qml/SH_User/login.qml"));viewer.showExpanded();return app.exec();
}
login_gui.h
/*********************************************************************
* 登陆界面模块头文件
* (c)copyright 2014,jdh
* All Right Reserved
*新建日期:2014/1/29 by jdh
*改动日期:2014/2/1 by jdh
*改动日期:2014/2/18 by jdh
*改动日期:2014/3/18 by jdh
*改动日期:2014/5/4 by jdh
*改动日期:2014/5/5 by jdh
*改动日期:2014/5/13 by jdh
**********************************************************************/#ifndef LOGIN_GUI_H
#define LOGIN_GUI_H/*********************************************************************
* 头文件
**********************************************************************/#include "world.h"/*********************************************************************
* 宏定义
**********************************************************************//*********************************************************************
* 登录间隔
*单位:ms
**********************************************************************/#define INTERVAL_LOGIN 500/*********************************************************************
* 最大登录次数
**********************************************************************/#define NUM_LOGIN 5/*********************************************************************
* 数据结构
**********************************************************************//*********************************************************************
* 登录界面类
**********************************************************************/class Login_Gui : public QObject
{Q_OBJECT//属性:usernameQ_PROPERTY(QString user_id READ user_id WRITE set_user_id NOTIFY sig_user_id_changed)//属性:passwordQ_PROPERTY(QString password READ password WRITE set_password NOTIFY sig_password_changed)//属性:记住password标志Q_PROPERTY(bool flag_remember READ flag_remember \WRITE set_flag_remember NOTIFY sig_flag_remember_changed)//属性:自己主动登录标志Q_PROPERTY(bool flag_auto READ flag_auto \WRITE set_flag_auto NOTIFY sig_flag_auto_changed)public:/********************************************************************** 函数**********************************************************************//********************************************************************** 初始化函数**********************************************************************/Login_Gui();/********************************************************************** 解构函数**********************************************************************/~Login_Gui();/********************************************************************** 属性读取:用户号**********************************************************************/QString user_id();/********************************************************************** 属性写入:用户号**********************************************************************/void set_user_id(QString str);/********************************************************************** 属性读取:password**********************************************************************/QString password();/********************************************************************** 属性写入:password**********************************************************************/void set_password(QString str);/********************************************************************** 属性读取:记住password标志**********************************************************************/bool flag_remember();/********************************************************************** 属性写入:记住password标志**********************************************************************/void set_flag_remember(bool flag);/********************************************************************** 属性读取:自己主动登陆标志**********************************************************************/bool flag_auto();/********************************************************************** 属性写入:自己主动登陆标志**********************************************************************/void set_flag_auto(bool flag);signals:/********************************************************************** 属性改变信号:用户号**********************************************************************/void sig_user_id_changed();/********************************************************************** 属性改变信号:password**********************************************************************/void sig_password_changed();/********************************************************************** 属性改变信号:记住password标志**********************************************************************/void sig_flag_remember_changed();/********************************************************************** 属性改变信号:自己主动登陆标志**********************************************************************/void sig_flag_auto_changed();/********************************************************************** 信号:登陆结果*參数:result:0:成功* 1:无此username* 2:password错误* 3:达到登陆的最大次数**********************************************************************/void sig_login_result(int result);/********************************************************************** 发送网络帧*參数:id:username* password:password* cmd:帧命令* index:发送序列号* frame:发送的报文**********************************************************************/void sig_net_tx_frame_with_id(uint32_t id,uint32_t password,int cmd,uint16_t index,QByteArray frame);public slots:/********************************************************************** 槽函数:登陆请求**********************************************************************/void slot_login_req();/********************************************************************** 槽函数:登陆响应*參数:data:接收的数据**********************************************************************/void slot_login_ack(QByteArray data);private slots:/********************************************************************** 槽函数:心跳滴答函数*说明:1滴答触发1次**********************************************************************/void slot_tick();private:/********************************************************************** 变量**********************************************************************//********************************************************************** 属性:用户号**********************************************************************/QString _user_id;/********************************************************************** 属性:password**********************************************************************/QString _password;/********************************************************************** 属性:记住password标志**********************************************************************/bool _flag_remember;/********************************************************************** 属性:自己主动登录标志**********************************************************************/bool _flag_auto;/********************************************************************** 滴答定时器**********************************************************************/QTimer *timer;/********************************************************************** 登录计数器**********************************************************************/int Login_Counter;
};#endif // LOGIN_GUI_H
login_gui.c
/*********************************************************************
* 登陆界面模块主文件
* (c)copyright 2014,jdh
* All Right Reserved
*新建日期:2014/1/29 by jdh
*改动日期:2014/2/1 by jdh
*改动日期:2014/2/17 by jdh
*改动日期:2014/2/18 by jdh
*改动日期:2014/2/16 by jdh
*改动日期:2014/5/4 by jdh
*改动日期:2014/5/5 by jdh
*改动日期:2014/5/13 by jdh
**********************************************************************//*********************************************************************
* 头文件
**********************************************************************/#include "login_gui.h"/*********************************************************************
* 函数
**********************************************************************//*********************************************************************
* 初始化函数
**********************************************************************/Login_Gui::Login_Gui()
{//初始化变量Login_Counter = 0;//滴答初始化timer = new QTimer(this);//绑定信号槽connect(timer, SIGNAL (timeout()), this , SLOT(slot_tick()));QFile file_cfg("cfg.txt");QByteArray arr;bool ok;int flag_remember = 0;int flag_auto_login = 0;int id = 0;int password = 0;QString str;int i = 0;int j = 0;//属性初始化_user_id = "";_password = "";_flag_remember = false;_flag_auto = false;//推断文件是否存在if (!file_cfg.exists()){file_cfg.close();}else{//文件存在file_cfg.open(QIODevice::ReadOnly);//读取文件do{str.clear();arr = file_cfg.readLine();for (i = 0;i < arr.count();i++){if ((arr.at(i) >= '0' && arr.at(i) <= '9') || \(arr.at(i) >= 'a' && arr.at(i) <= 'f') || \arr.at(i) == 'x'){str[j++] = arr.at(i);}}flag_remember = str.toInt(&ok,16);if (!ok){break;}str.clear();arr = file_cfg.readLine();for (i = 0;i < arr.count();i++){if ((arr.at(i) >= '0' && arr.at(i) <= '9') || \(arr.at(i) >= 'a' && arr.at(i) <= 'f') || \arr.at(i) == 'x'){str[j++] = arr.at(i);}}flag_auto_login = str.toInt(&ok,16);if (!ok){break;}str.clear();arr = file_cfg.readLine();for (i = 0;i < arr.count();i++){if ((arr.at(i) >= '0' && arr.at(i) <= '9') || \(arr.at(i) >= 'a' && arr.at(i) <= 'f') || \arr.at(i) == 'x'){str[j++] = arr.at(i);}}id = str.toInt(&ok,16);if (!ok){break;}str.clear();arr = file_cfg.readLine();for (i = 0;i < arr.count();i++){if ((arr.at(i) >= '0' && arr.at(i) <= '9') || \(arr.at(i) >= 'a' && arr.at(i) <= 'f') || \arr.at(i) == 'x'){str[j++] = arr.at(i);}}password = str.toInt(&ok,16);if (!ok){break;}//推断是否记住密码if (flag_remember == VALID_FLAG){_user_id = QString::number(id,10);_password = QString::number(password,10);_flag_remember = true;//推断是否自己主动登录if (flag_auto_login == VALID_FLAG){_flag_auto = true;slot_login_req();}}} while (0);file_cfg.close();}
}/*********************************************************************
* 解构函数
**********************************************************************/Login_Gui::~Login_Gui()
{
}/*********************************************************************
* 属性读取:用户号
**********************************************************************/QString Login_Gui::user_id()
{return _user_id;
}/*********************************************************************
* 属性写入:用户号
**********************************************************************/void Login_Gui::set_user_id(QString str)
{if (_user_id != str){_user_id = str;emit sig_user_id_changed();}
}/*********************************************************************
* 属性读取:密码
**********************************************************************/QString Login_Gui::password()
{return _password;
}/*********************************************************************
* 属性写入:密码
**********************************************************************/void Login_Gui::set_password(QString str)
{if (_password != str){_password = str;emit sig_password_changed();}
}/*********************************************************************
* 属性读取:记住密码标志
**********************************************************************/bool Login_Gui::flag_remember()
{return _flag_remember;
}/*********************************************************************
* 属性写入:记住密码标志
**********************************************************************/void Login_Gui::set_flag_remember(bool flag)
{if (_flag_remember != flag){_flag_remember = flag;emit sig_flag_remember_changed();}
}/*********************************************************************
* 属性读取:自己主动登陆标志
**********************************************************************/bool Login_Gui::flag_auto()
{return _flag_auto;
}/*********************************************************************
* 属性写入:自己主动登陆标志
**********************************************************************/void Login_Gui::set_flag_auto(bool flag)
{if (_flag_auto != flag){_flag_auto = flag;emit sig_flag_auto_changed();}
}/*********************************************************************
* 槽函数:登陆请求
**********************************************************************/void Login_Gui::slot_login_req()
{ //初始化计数器Login_Counter = 0;//開始尝试登陆timer->start(INTERVAL_LOGIN);slot_tick();
}/*********************************************************************
* 槽函数:登陆响应
*參数:data:接收的数据
**********************************************************************/void Login_Gui::slot_login_ack(QByteArray data)
{uint32_t id = 0;uint32_t password = 0;int flag_remember = 0;int flag_auto_login = 0;uint8_t result = 0;bool ok;#ifdef DEBUGqDebug() << "接收帧:尝试登陆" << (uint8_t)data[0] << (uint8_t)data[1] << (uint8_t)data[2];
#endif//清除计数器Login_Counter = 0;//停止登录尝试timer->stop();//推断用户号和密码是否匹配id = ((uint8_t)data[6] << 24) +\((uint8_t)data[7] << 16) + \((uint8_t)data[8] << 8) + \(uint8_t)data[9];password = ((uint8_t)data[10] << 24) +\((uint8_t)data[11] << 16) + \((uint8_t)data[12] << 8) + \(uint8_t)data[13];//登陆结果result = (uint8_t)data[LEN_FRAME_HEAD];//推断登陆结果switch (result){//登陆成功case 0:{//推断username与password是否正确if (id == (uint32_t)_user_id.toInt(&ok) && password == (uint32_t)_password.toInt(&ok)){//发送登陆成功信号emit sig_login_result(0);#ifdef DEBUGqDebug() << "登陆成功" << "用户号" << _user_id << "密码" << _password;#endif//推断是否勾选记住密码以及自己主动登录if (_flag_remember){flag_remember = VALID_FLAG;}if (_flag_auto){flag_auto_login = VALID_FLAG;}//将username密码保存QFile file_cfg("cfg.txt");file_cfg.open(QIODevice::WriteOnly);QTextStream out(&file_cfg);out << QString::number(flag_remember,16) << "\r\n" \<< QString::number(flag_auto_login,16) << "\r\n" \<< _user_id << "\r\n" \<< _password << "\r\n";file_cfg.close();}break;}//无此usernamecase 1:{#ifdef DEBUGqDebug() << "登陆失败" << "用户号不存在";#endif//发送登录失败信号emit sig_login_result(1);break;}//密码错误case 2:{#ifdef DEBUGqDebug() << "登陆失败" << "密码错误";#endif//发送登录失败信号emit sig_login_result(2);break;}}
}/*********************************************************************
* 槽函数:心跳滴答函数
*说明:1滴答触发1次
**********************************************************************/void Login_Gui::slot_tick()
{QByteArray frame;bool ok;//登录计数器Login_Counter++;if (Login_Counter > NUM_LOGIN){#ifdef DEBUGqDebug() << "登录失败" << "达到最大尝试登陆次数:" << NUM_LOGIN;#endif//清除计数器Login_Counter = 0;//停止登陆尝试timer->stop();//发送登陆失败信号emit sig_login_result(3);return;}//发送登陆请求//报文frame.clear();//发送网络帧
#ifdef DEBUGqDebug() << "发送帧:发送登陆请求";
#endifemit sig_net_tx_frame_with_id((uint32_t)_user_id.toInt(&ok),(uint32_t)_password.toInt(&ok),\CMD_USER_LOGIN_REQUEST,0,frame);
}
![[LeetCode]Distinct Subsequences,解题报告](https://img-blog.csdn.net/20140605162246906)
