Qt-QML-Popup,弹层界面编写

简介: 随着接触Qt的时间的增加,也逐渐的发现了Qt 的一些不人信话的一些地方,不由的想起一句话,也不知道是在哪里看到的了“一切变成语言都是垃圾,就C++还可以凑合用”大致意思是这样。最近项目的祝界面框架都基本写完了,那自我感觉良好,感觉自己QML的不得了了,全部用的都是自己YY出来的空间,今天小伙伴在同伴代码后,用到了我的模块,给我说了一个BUG,


我一听,BUG!BUG!BUG!,你确定是我的问题吗,你要确定好了啊,是不是你的环境问题,我这怎么没有这个问题。


大致说一下背景,项目在开发完成后呢,大部分和默认情况呢,都是全屏运行,界面呢,都属出自本宝宝的手哈,所以了,在QML中了,我默认是调用的QML的“showFullScreen()”


而小伙伴反应是在全屏下,我的空间是被遮住了,在主界面的后面显示,每次都需要调出资源管理器来显示我的界面,这就不爽了,我这里怎么就没有了


再次和小伙伴干起来,是不是你用的不对,你没有看我写的Demo么,没有看么,我的怎么没有问题,奈何,MMP,我是公司唯一一个使用两个显示器 的,每次程序都是运行在我的扩展屏上面,这个问题是没有出现,但是当我运行在主屏上面的时候,就会发现这样的问题了,赶紧害羞的修BUG


“showFullScreen()”这个函数呢,英文字面意思就是全屏显示程序,这个函数默认是调用了系统的“FullScreen”,如下图

image.png

接着跳转到帮助文档看FullScreen,如下




后面的届时我复制下来


The window occupies one entire screen, is not resizable, and there is no titlebar. On some platforms which do not support showing multiple simultaneous windows, this can be the usual visibility when the window is not hidden.


这是原文,


有道翻译结果

image.png

大致意思了,就是这个FunnScreen函数了,在某些平台上面,只能支持一个界面全屏显示,也就是说,当某个界面在全屏显示的状态下,其他界面是被遮盖的。参考这个BUG的出现,那我才,windows就是其中一个了,很遗憾,那么,怎么办了,其实如果可以用Dialog就可以轻松解决了,奈何我搞了一下午,就是不能把Dialog的边框去掉,这里需要有牛逼的小伙伴给我指点一下,QML下的Dialog怎么把边框给去掉了。但是呢,总得先把这个BUG给解决了,不然老板给和我谈谈人生了。所以,这里需要祭出我今天新学习的神器了,Popup

image.png

这是一些Popup的一些布局显示,那么我理解了,就是中间的白色区域,就可以显示我们要弹出的内容了,剩下的那些,都是对这个Popup的美化。



下面上测试代码



import QtQuick 2.5

import QtQuick.Controls 2.1

import QtQuick.Controls.Styles 1.4

import QtGraphicalEffects 1.0

import QtQuick.Window 2.2

ApplicationWindow {

   id:root

   visible: true

   width: 800

   height: 600

   title: qsTr("测试程序")


   Rectangle

   {

       width: 100

       height: 30

       anchors.right: parent.right

       anchors.top: parent.top

       color: "#FF0000"


       MouseArea

       {

           anchors.fill: parent

           onClicked: {

               if(root.width != Screen.width)

               {

                   showFullScreen()

                   test.text = "ShoeNurmal"

               }

               else

               {

                   showNormal()

                   test.text = "ShowFullScreen"

               }

           }

       }

       Text {

           id: test

           anchors.centerIn: parent

           text: qsTr("ShowFullScreen")

       }

   }




   Rectangle

   {

       width: 100

       height: 30

       anchors.right: parent.right

       anchors.top: parent.top

       anchors.topMargin: 50

       color: "#FFFF00"


       MouseArea

       {

           anchors.fill: parent

           onClicked: {

               if(textpopup.text == 'Popup')

               {

                   myPopup.open()

                   textpopup.text = "Popup close"


               }

               else

               {

                   myPopup.close()

                   textpopup.text = "Popup"

               }

           }

       }

       Text {

           id: textpopup

           anchors.centerIn: parent

           text: qsTr("Popup")

       }

   }


   Popup

   {

       id:myPopup

       width: 400

       height: 300

       x:(root.width-width)/2

       y:(root.height-height)/2

       modal: true

       focus: true

       closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent


       Rectangle

       {

//            width: 400

//            height: 300

           anchors.fill: parent

           Text {

               id: mytext

               font.pixelSize: 24

               text: qsTr("Popup 内容显示模块")

           }

       }

   }






}








运行测试截图


非全屏

image.png

全屏

抱歉,我不知道怎么能截下来,每次截图会把这个状态改变了,只能用相机拍下来了image.png

目前完美解决了这个我自己洗的BUG

 

现在,我真的是在写BUG,哈哈

 

欢迎大家指正

目录
相关文章
|
6月前
|
数据可视化 API vr&ar
探索Qt 3D之旅:从基础到实战,打造引人入胜的三维界面与应用
探索Qt 3D之旅:从基础到实战,打造引人入胜的三维界面与应用
911 2
|
6月前
|
编解码 并行计算 Java
QT界面中实现视频帧显示的多种方法及应用(二)
QT界面中实现视频帧显示的多种方法及应用
973 0
|
6月前
|
存储 测试技术 UED
Qt中实现界面回放的艺术:从理论到代码“ (“The Art of Implementing UI Playback in Qt: From Theory to Code
Qt中实现界面回放的艺术:从理论到代码“ (“The Art of Implementing UI Playback in Qt: From Theory to Code
153 1
|
3月前
|
监控 C++ 容器
【qt】MDI多文档界面开发
【qt】MDI多文档界面开发
88 0
|
1月前
|
编译器
【项目开发】QT简单练习之QQ登录界面模仿
为了进一步加深对QT开发的理解,在学习完基础操作之后要进行一个简单的练习。
|
6月前
|
编译器
QT creator开发环境下 界面更改后运行程序不能实时更新或者在源文件添加该控件后无法编译的问题
在使用QT Creator开发界面的过程中,偶尔会出现添加控件后,运行程序后,界面控件无法更新的情况,或者在源文件使用该控件却出现无法编译的情况,使用QT Creator 4.8.2也会出现这个情况,也不知道这种情况会不会在以后有所改善。
277 0
|
6月前
|
编解码 C++
Qt第一课 第一个ui界面
Qt第一课 第一个ui界面
86 2
|
6月前
|
区块链
【qt】最快的开发界面效率——混合编程3
【qt】最快的开发界面效率——混合编程
100 1
|
6月前
【qt】最快的开发界面效率——混合编程2
【qt】最快的开发界面效率——混合编程
80 1
|
6月前
【qt】设计器实现界面
【qt】设计器实现界面
52 1

推荐镜像

更多