1. 首页
  2. IT资讯

使用Qt Designer 设计对话框(一)

“u003Cdivu003Eu003Cpu003E使用 Qt 设计师 可以通过拖动组件,所见即所得地创建应用程序的用户界面。从pip安装 pyqt5-tools 模块即可完成Qt Designer程序的安装。安装完成后可以从 python根目录\Lib\site-packaes\pyqt5_tools目录下 找到 designer.exe 程序。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002Fb48afec9b1414d13b19b4b7152f05860″ img_width=”850″ img_height=”408″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003EQt Designer 程序启动后的界面如下:u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp3.pstatp.comu002Flargeu002Fpgc-imageu002F57e7e433331b450a80c8e81021d5f6e9″ img_width=”1080″ img_height=”637″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E本篇讲解对话框的绘制,选择创建底部带“Ok”,“Cancel”按钮的对话框。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F1e9f819655f34b83912f73220df4d7e8″ img_width=”421″ img_height=”338″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E我们可以从设计师窗口左边的Widget Box,鼠标移动到想要的组件上,按住左键,拖动组件到正在设计的窗口上。Widget Box 中的部件类型依次是: 布局,站位弹簧,按钮,项目视图,项目布局,容器,输入部件 和 显示部件。比如,标签属于显示部件,Line Edit 和 Combo Box 都属于输入部件。u003Cu002Fpu003Eu003Cpu003E标签,按钮的文本,以及Line Edit的初始文本等,都可以通过双击修改成想要的值。也可以通过设计师程序窗口右边中部的属性编辑器修改。通过属性编辑器还可以修改部件的其它诸多属性。当前部件自有的属性位于属性编辑器的下部,其从父部件继承的属性位于属性编辑器的上部。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002Fc09ee4d2672e4eab8898f082272032ba” img_width=”457″ img_height=”395″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E需要在自编代码中引用的部件,最好在对象查看器中,将其对象名修改成容易辨识的名字。对象查看器位于设计师程序窗口右边顶部。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp3.pstatp.comu002Flargeu002Fpgc-imageu002F8842c5ce7867408bab8f2f0e6e1f1217″ img_width=”453″ img_height=”207″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E我们依次添加完各个部件到大概的位置,根据需要设置好对象名和各个属性。如有必要,可以添加弹簧占位符,使得窗口尺寸被改变时自动伸展,保持其它部件的位置不变。还可以添加水平或竖直分割符。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F51e2915d0e804438beb46c311aefb18d” img_width=”391″ img_height=”204″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E之后我们要进行合理地布局。按住Ctrl 键后依次选择多个部件(或布局),或者鼠标框选,再点击布局工具条的相应按钮,就完成了对这些部件的布局。点击对话框(当前正在设计的窗口)的空白部分,再点布局按钮,就设置了窗口的总布局。若布局不太容易通过鼠标选择,可以在对象查看器里通过单击选择。若布局有错误,可以先打散该布局(break layout),再重新布局。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp3.pstatp.comu002Flargeu002Fpgc-imageu002Fb9f7d80efa7742e3bb081f6c15f63099″ img_width=”434″ img_height=”263″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E布局完成时效果:u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002Ff515be3e603349339025afd0cb383451″ img_width=”538″ img_height=”209″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E根据需要(控件文本需含“&”),设置兄弟控件以便转移焦点。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F2a37d407a62443b08ecde9cacb32edff” img_width=”606″ img_height=”281″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E根据需要,修改Tab键次序:u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002F1790c76477064169a1998ce527d224e4″ img_width=”186″ img_height=”42″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cp class=”ql-align-center”u003Eu003Cbru003Eu003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp1.pstatp.comu002Flargeu002Fpgc-imageu002Fc6db86a01290463a8384e9e142947b8e” img_width=”398″ img_height=”214″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E在适当的地方,为内置的信号和槽建立 信号-槽 连接。如,连接关闭按钮的点击信号和对话框的 “接收”(并关闭)槽。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp9.pstatp.comu002Flargeu002Fpgc-imageu002F344408c9e133467e96f5c6401a216a96″ img_width=”600″ img_height=”238″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E最后预览窗体(通过菜单Form->Priview,或快捷键 Ctrl+R) ,并检查所有的东西能否按照设想进行工作。如果有错误,则返回修改。如果一切正常,则保存最终的界面。 保存得到的文件 扩展名为 .ui , 格式为XML。u003Cu002Fpu003Eu003Cdiv class=”pgc-img”u003Eu003Cimg src=”http:u002Fu002Fp3.pstatp.comu002Flargeu002Fpgc-imageu002F540a317ad0154245b23e9849fd481efe” img_width=”318″ img_height=”185″ alt=”使用Qt Designer 设计对话框(一)” inline=”0″u003Eu003Cp class=”pgc-img-caption”u003Eu003Cu002Fpu003Eu003Cu002Fdivu003Eu003Cpu003E当然,途中任何时候都可以预览和保存。u003Cu002Fpu003Eu003Cu002Fdivu003E”

原文始发于:使用Qt Designer 设计对话框(一)

主题测试文章,只做测试使用。发布者:玩家L-,转转请注明出处:http://www.cxybcw.com/10634.html

联系我们

13687733322

在线咨询:点击这里给我发消息

邮件:1877088071@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息

QR code