精华内容
下载资源
问答
  • QT Designer

    千次阅读 2016-06-08 16:37:18
    Qt Designer——即Qt设计师,是QT项目开发的可视化图形界面编辑器,通过设计师可以很方便地创建图像界面文件*.ui,然后将ui文件应用的源代码中,做到所见即所得,让界面的设计变得十分简单。下面介绍Qt Designer的...

    Qt Designer——即Qt设计师,是QT项目开发的可视化图形界面编辑器,通过设计师可以很方便地创建图像界面文件*.ui,然后将ui文件应用的源代码中,做到所见即所得,让界面的设计变得十分简单。下面介绍Qt Designer的简单使用,如何将ui文件应用到Qt程序代码中。

    Qt Designer 编辑 UI
    首先打开Qt Designer,可以在Qt命令行中输入designer,或者在菜单找到后打开。打开是,会默认弹出新建窗体的对话框,如下图。这里写图片描述

    对话框左边提供了五种窗体的类型模板,前三个都是对话框窗口,分别为按钮居底部、按钮居右边和不带按钮。 第四个是“Main Window”,即主窗口界面,主窗口功能最为丰富,有菜单栏、工具栏、状态栏、中央部件, 并且可以添加停靠/浮动窗口。这个比较复杂,后续章节讲解。 第五个是最简单的通用“Widget”界面,本节就使用这个作为主界面窗口。 选中“Widget”之后,再点击“创建”按钮,就会新建一个该类型的窗体,如下图所示:
    这里写图片描述

    设计师的上方是菜单栏和工具栏,工具栏里需要留心的是中间的四个按钮,是指图形界面的四种编辑模式,依次为:

    ①编辑窗口部件:为窗口拖拽控件(即部件),编辑控件布局等。
    ②编辑信号/槽:用户在图形界面的一些动作会触发窗口或控件的信号,信号对应的处理函数就是槽函数,这种模式实现二者的关联关系。
    ③编辑伙伴:最常见的就是将标签控件设置为其他控件(如编辑框)的伙伴,标签控件文本就可以指明关联控件的名称/功能/用途,并且能方便地设置快捷 键。
    ④编辑 Tab 顺序:在窗口中,用户可以按 Tab 键依次选择进入各个控件,这个模式就是编辑各个控件被选择的顺序。
    

    这里只使用第一种“编辑窗口部件”的模式,其他的以后再讲。
    设计师左边的“Widget Box”,是控件(或叫部件)工具箱, 包含了丰富的可拖拽的 Qt 控件。中间部分带有点阵标示的窗体就是我们新建的界面窗体。 设计师右边是三个工具箱窗口:对象查看器是记录当前窗体里面有哪些控件, 每个控件对象的名称和类名都会列出来,可以看到默认的对象是 Form,它的类名是 QWidget; 右边第二个是属性编辑器,用于编辑窗体或控件的属性,比如对象名称、窗口标题、窗口大小等等。 右边第三个工具箱比较复杂,它是选项卡式的,有“资源浏览器”、“动作编辑器”和“信号/槽编辑器”三个工具箱, 这几个以后再讲,本节暂时用不着。

    拖拽控件是最简单不过的了,这里描述拖一个标签控件到主界面。在左边“Widget Box”里面,把滑块拖到最底下, 或用鼠标滚轮往下滚到底,可以看到“Display Widgets”类别里的 “Label”控件,这个就是上一节的 QLabel 。 将鼠标指针移到“Label”,左键按下不松,再往主界面窗口里拖动,拖到大概靠主界面窗体的左上位置, 然后松开鼠标左键,就给主界面窗口添加了一个标签控件了。添加后,界面窗体如下图所示:
    这里写图片描述

    上图中,
    在对象查看器里,这时候多出来一行“label”和“QLabel”,就是标签对象的名称和类名。

    在属性编辑器里,可以看到“label : QLabel”字样,说明这时可以设置 label 的属性。 label 的属性非常多,可以用鼠标滚轮滚动查看众多属性,就不一一枚举了。最关键的属性都自动被加粗显示了,有三个:
    objectName:对象名称,该名称决定以后在 C++ 代码里这个对象的指针变量名,用过这个对象名称就能调用该对象的函数。ui 文件里的对象名称全是指针变量名,因为它们全都是用 new 创建的。
    geometry:控件显示占据的几何图形,就是显示的矩形区域,该属性是通过四个子属性控制的, 点开 “+”,展开看到 X、Y、宽度、高度,设置这四个数值,可以控制控件显示的位置和控件的大小。
    text:显示的文本,标签控件就是专门用来显示文本的,这个是它最主要的功能。

    标签控件对象名称就不修改了,因为就一个。我们设置 geometry 的四个子属性: X 为 10,Y 为 10,宽度为 200,高度为 40

    这里写图片描述

    QT有一个特点就是在为控件编辑文本内容时,是支持HTML的,比如上面的Label控件,点击属性对话框中 text 中的“…”按钮就可以打开文本对话框。

    这里写图片描述

    在你要编辑的文本中可以在文本的前后添加HTML标签以显示不同的颜色和字体等等。制作文ui文件后保存即可。文件名为*.ui。

    ui 文件其实就一个标准 XML 格式的文本文件(可以用记事本打开看看),需要通过 uic 工具将其转换为项目里可用的 ui_*.h 头文件, 这个头文件里才是真正可用的 C++ 代码。接下来我们开始进行转换:
    进入QT命令行,进入保存的目录,输入命令“uic 文件名 -o ui_文件名”。

    这里写图片描述

    打开转换后的头文件打开看看吧。

    /********************************************************************************
    ** Form generated from reading UI file 'hello.ui'
    **
    ** Created by: Qt User Interface Compiler version 5.6.0
    **
    ** WARNING! All changes made in this file will be lost when recompiling UI file!
    ********************************************************************************/
    
    #ifndef UI_HELLO_H
    #define UI_HELLO_H
    
    #include <QtCore/QVariant>
    #include <QtWidgets/QAction>
    #include <QtWidgets/QApplication>
    #include <QtWidgets/QButtonGroup>
    #include <QtWidgets/QDialog>
    #include <QtWidgets/QDialogButtonBox>
    #include <QtWidgets/QHeaderView>
    #include <QtWidgets/QLabel>
    
    QT_BEGIN_NAMESPACE
    
    class Ui_Dialog
    {
    public:
        QDialogButtonBox *buttonBox;
        QLabel *label;
    
        void setupUi(QDialog *Dialog)
        {
            if (Dialog->objectName().isEmpty())
                Dialog->setObjectName(QStringLiteral("Dialog"));
            Dialog->resize(400, 300);
            buttonBox = new QDialogButtonBox(Dialog);
            buttonBox->setObjectName(QStringLiteral("buttonBox"));
            buttonBox->setGeometry(QRect(30, 240, 341, 32));
            buttonBox->setOrientation(Qt::Horizontal);
            buttonBox->setStandardButtons(QDialogButtonBox::Cancel|QDialogButtonBox::Ok);
            label = new QLabel(Dialog);
            label->setObjectName(QStringLiteral("label"));
            label->setGeometry(QRect(10, 10, 200, 40));
    
            retranslateUi(Dialog);
            QObject::connect(buttonBox, SIGNAL(accepted()), Dialog, SLOT(accept()));
            QObject::connect(buttonBox, SIGNAL(rejected()), Dialog, SLOT(reject()));
    
            QMetaObject::connectSlotsByName(Dialog);
        } // setupUi
    
        void retranslateUi(QDialog *Dialog)
        {
            Dialog->setWindowTitle(QApplication::translate("Dialog", "Dialog", 0));
            label->setText(QApplication::translate("Dialog", "<h1>Hello World</h1>", 0));
        } // retranslateUi
    
    };
    
    namespace Ui {
        class Dialog: public Ui_Dialog {};
    } // namespace Ui
    
    QT_END_NAMESPACE
    
    #endif // UI_HELLO_H
    
    展开全文
  • 这篇博文通过图文详细介绍在PyCharm中如何完整优雅地安装配置PyQt5的所有工具包,主要内容包括PyQt5、PyQt5-tools的依赖包安装和Qt Designer、PyUIC、PyRcc三个工具的设置。最后简单演示了PyQt5的调用方式及三个工具...

    首页图
    摘要:Qt是常用的用户界面设计工具,而在Python中则使用PyQt这一工具包,它是Python编程语言和Qt库的成功融合。这篇博文通过图文详细介绍在PyCharm中如何完整优雅地安装配置PyQt5的所有工具包,主要内容包括PyQt5\color{#4285f4}{P}\color{#ea4335}{y}\color{#fbbc05}{Q}\color{#4285f4}{t}\color{#34a853}{5}PyQt5\color{#4285f4}{P}\color{#ea4335}{y}\color{#fbbc05}{Q}\color{#4285f4}{t}\color{#34a853}{5}-tools\color{#4285f4}{t}\color{#ea4335}{o}\color{#fbbc05}{o}\color{#4285f4}{l}\color{#34a853}{s}的依赖包安装和Qt\color{#4285f4}{Q}\color{#ea4335}{t} Designer\color{#4285f4}{D}\color{#ea4335}{e}\color{#fbbc05}{s}\color{#4285f4}{i}\color{#34a853}{g}\color{#ea4335}{n}\color{#fbbc05}{e}\color{#4285f4}{r}PyUIC\color{#4285f4}{P}\color{#ea4335}{y}\color{#fbbc05}{U}\color{#4285f4}{I}\color{#34a853}{C}PyRcc\color{#4285f4}{P}\color{#ea4335}{y}\color{#fbbc05}{R}\color{#4285f4}{c}\color{#34a853}{c}三个工具的设置。最后简单演示了PyQt5的调用方式及三个工具的使用方法,其目录如下:

    ➷点击跳转至主要安装步骤介绍部分☇


    前言

        很多情况下需要为程序设计一个GUI界面,在Python中使用较多的用户界面设计工具是PyQt。由于通常我们使用较多的IDEPyCharm,为了方便地使用PyQt进行用户界面设计,这里总结了在PyCharm安装配置的简单安装方法。可能有人还不清楚这几个工具的用途,这里对要安装配置的依赖包和工具简介如下:

    PyQt5PyQt5是一套Python绑定Digia QT5应用的框架。Qt库是最强大的GUI库之一,PyQt5做为Python的一个模块,它有620多个类和6000个函数和方法。这是一个跨平台的工具包,它可以运行在所有主要的操作系统,包括UNIXWindowsMac OSPyQt5是双重许可。开发者可以在GPL和商业许可之间进行选择,详细可访问PyQt5的官方网站。——PyQt5中文教程
    PyQt5-toolsPyQt5中没有提供常用的Qt工具,比如图形界面开发工具Qt DesignerPyQt5-tools中包含了一系列常用工具。——PyQt5工具文档
    Qt Designer:可以通过Qt Designer来编写UI界面,Qt Designer的设计符合MVC的架构,其实现了视图和逻辑的分离,从而实现了开发的便捷。Qt Designer中的操作方式十分灵活,其通过拖拽的方式放置控件可以随时查看控件效果。Qt DesignerPyQt5-tools包一起安装,其安装路径在 “Python安装路径\Lib\site-packages\pyqt5-tools”下。——PyQt5速成教程
    PyUICQt Designer生成的.ui文件(实质上是XML格式的文件)可以通过pyuic5工具转换成.py文件。——PyQt5速成教程
    PyRcc:在使用PyQt开发界面时,在Qt Designer中使用的图片等资源需要将其编译为py文件,这时需要用到PyRcc工具方便地将qrc文件转换为py文件。——PyQt5安装教程

        作者本人已经进行配置测试了多台Windows 10电脑,特通过本教程将安装配置过程展现给大家,本教程持续更新,如果你有更好的方法或问题,欢迎大家留言。


    1. 工具包安装

        对于一个新创建的Python环境,首先需要安装PyQt的相关工具包,因为是Python的依赖包所有可以通过pip进行安装,由于我们在PyCharm中进行程序设计,这里我们可以通过PyCharm中的环境管理界面进行安装。对于新建的项目test,其文件界面如下图(点击可放大查看)所示:

    初始项目
    一、点击菜单栏“File”,选择弹出的“Setting”选项,如下图(点击可放大查看)所示:

    环境配置1
    二、选择“Project”,选择弹出的“Project Interpreter”选项,点击可看到当前已安装的环境和依赖包,如下图(点击可放大查看)所示,点击右侧“加号”按钮可添加新的依赖包:

    目前安装的依赖包界面

    PyQt5

    三、可以看出当前尚未安装pyqt5的依赖包,点击“加号”按钮弹出安装界面如下图(点击可放大查看)所示,在搜索框输入“PyQt5”可以搜索到对应的依赖包,点击“Install Package”按钮进行安装(绿色框处可选择安装版本),等待安装完成:

    安装pyqt5

    PyQt5-tools

    四、同样地安装PyQt5-tools工具包,在搜索框中输入“PyQt5-tools”,选中要安装的依赖包,点击“Install Package”进行安装,如下图中所示的步骤所示:

    pyqt5-tools安装过程
    五、这两个工具包安装完成,返回上一界面可以看到依赖包管理界面中出现了这两个依赖包,如下图所示:

    安装完成界面
        至此PyQt的工具包安装完成,在编辑器或命令行可以通过“import PyQt5”调用该库。这里确定一下安装位置,正常情况下这两个包的安装位置在Python的安装目录下的“\Lib\site-packages\”目录,如我这里的两个安装位置如下图所示(我这里Python为虚拟环境,安装位置在“E:\test\venv”):

    安装位置


    2. 设计工具配置

        依赖包安装完成,接下来介绍如何在PyCharm中添加工具,其实这几个工具在安装PyQt5-tools的时候已经包括在目录中,只不过要在PyCharm中方便使用还需要一些配置步骤。首先为了保证Windows系统能够正确识别PyQt5-tools的常见命令,还需要将PyQt5-tools的安装目录添加到系统环境变量Path中。

    环境变量设置

    一、在文件管理器中右击“我的电脑”,弹出快捷菜单,选择“属性”→“高级系统设置”弹出系统属性对话框,如下图所示:

    配置系统变量
    二、选择“高级”,点击下面的“环境变量”,弹出环境变量设置框,选择系统变量中的“Path”变量,如下图所示:

    环境变量
    三、双击“Path”环境变量,进入环境变量编辑界面,点击“编辑”在最后添加pyqt5-tools的安装位置,点击确定,如下图所示:

    添加path环境变量
    这一步也可以选择“浏览”,通过文件夹选择对话框选中pyqt5-tools的安装位置,其安装路径在 “Python安装路径\Lib\site-packages\pyqt5-tools”(需根据实际情况进行修改),如下图(点击放大图片)所示:

    浏览选择安装位置
    三、在环境变量界面中点击“新建”,在系统环境变量中新建名为“QT_PLUGIN_PATH”的变量,如下图所示:

    创建变量
    该变量值为Qt插件的安装位置,可通过“浏览目录”依次找到“plugins”文件夹,通常其位置在“Python安装路径\Lib\site-packages\PyQt5\Qt\plugins\”位置(需根据实际情况修改),点击“确定”,如下图所示:

    变量位置
        环境变量设置完成,接下来介绍在PyCharm中设置Qt工具,主要包括Qt DesignerPyUICPyRcc这三个工具,前言中已介绍其作用,下面依次介绍工具设置过程。

    Qt Designer

    一、点击菜单栏“File”,弹出下拉框,选择“Setting”,弹出设置界面。在设置界面中选择“Tools”→“External Tools”,该部分操作如下图所示:

    添加工具
    点击“加号”按钮新建工具,弹出工具配置界面:在“Name”一栏填写“Qt-Designer”;在“Program”一栏填写designer.exe文件位置,我这里位置为:“E:\test\venv\Lib\site-packages\pyqt5_tools\Qt\bin\designer.exe”(需根据实际情况填写);在“Working directory”一栏填写“$FileDir$”。最后点击“OK”,如下图所示:

    Designer配置
    二、点击菜单栏“Tools”,弹出下拉框,选择“External Tools”,弹出工具选择框。选择“Qt-Designer”并点击,若出现Qt Designer的软件界面则表示配置成功,当然也可能出现如下的问题框:

    运行Qt-Designer
    若出现以上问题,解决方案是将pyqt5_tools\Qt\plugins文件夹进行复制,覆盖到site-packages\pyqt5_tools\Qt\bin目录下,覆盖后的文件夹如下:

    覆盖文件夹
    以上操作后,再次按照步骤二的操作即可打开Qt Designer软件界面。

    PyUIC

    一、同样按照以上方式添加PyUIC工具,点击“加号”按钮,在弹出的编辑设置框中Name一栏填写“PyUIC”;

    二、Program中填写pyuic5.exe这个程序的文件路径,一般在“Python环境目录\Scripts\pyuic5.exe”(此处需根据实际情况修改),也可以点击右侧的文件夹选择按钮浏览文件夹选中该位置;

    PyUIC配置

    三、在Arguments中内容填写如下:

    $FileName$
    -o
    $FileNameWithoutExtension$.py
    

    四、Working directory内容填写如下:

    $FileDir$
    

    五、完成填写后,点击“OK”,以上步骤参考图片中的步骤。

    PyRcc

    一、PyRcc工具的配置方式与PyUIC相似,同样在“External Tools”设置中点击“加号”按钮,在设置框中“Name”一栏填写“PyRcc”;

    PyRcc配置
    二、Program中填写pyrcc5.exe这个程序的文件路径,一般在“Python环境目录\Scripts\pyrcc5.exe”(此处需根据实际情况修改),也可以点击右侧的文件夹选择按钮浏览文件夹选中该位置;

    三、在Arguments中内容填写如下:

    $FileName$
    -o
    $FileNameWithoutExtension$_rc.py
    

    四、Working directory内容填写如下:

    $FileDir$
    

    五、完成填写后,点击“OK”,以上步骤参考图片中的步骤。


    3. 使用演示

        依赖包和工具安装配置完成,下面简单演示一下如何使用。首先打开或新建一个Python项目,点击菜单栏中的“Tools”,选择“External Tools”,可以看到之前设置好的三个工具,选择“Qt Designer”打开Qt设计工具,步骤如下图所示:

    打开工具
        打开软件后,在弹出的引导界面选择“Main Window”,然后点击“Create”按钮,创建一个窗体界面,如下图所示:

    在这里插入图片描述
        在软件界面左侧的控件选择栏中拖动三个“Push Button”到中间的设计框中,双击按钮依次修改显示字符,如下图所示:

    在这里插入图片描述
        在软件界面左侧的控件选择栏中拖动两个“Label”控件到中间的设计框中,如下图所示:

    拖动图片

        如下图所示,点击“Resource Browser”下的铅笔图表,弹出新建qrc文件的编辑框。

    新建qrc文件
        如下图所示,点击新建(1号标注)按钮新建一个qrc文件,创建qrc文件后点击添加文件(2号标注),向qrc资源文件中添加两张图片,最后点击“OK”确定。

    添加文件
        选中添加进来的label窗体,在右侧属性编辑栏中的“text”属性中“pixmap”一栏选择“Choose Resource”,如下图所示:

    选择资源
        在资源选择框中选择刚刚添加进qrc的图片,点击确定,对另一个label也进行同样的操作,如下图所示:

    在这里插入图片描述
        最终完成后的界面如下图所示,点击菜单栏“File”下“Save”将该界面保存为ui文件并置于项目目录下。

    最终界面
        在PyCharm中选中保存的ui文件,使用“Tools”下的“External Tools”中的“PyUIC”工具将该文件转换为需要的py文件。

    在这里插入图片描述
        在PyCharm中选中保存的qrc文件,使用“Tools”下的“External Tools”中的“PyRcc”工具将该资源文件转换为需要的py文件。

    在这里插入图片描述
        在PyCharm中打开使用“PyUIC”工具转换的py文件,在下面添加如下代码:

    if __name__ == '__main__':
        import sys
        from PyQt5.QtWidgets import QApplication, QMainWindow
        import pics_ui_rc # 导入添加的资源(根据实际情况填写文件名)
        app = QApplication(sys.argv)
        MainWindow = QMainWindow()
        ui = Ui_MainWindow()
        ui.setupUi(MainWindow)
        MainWindow.show()
        sys.exit(app.exec_())
    

        在PyCharm中点击运行该文件,最终运行界面如下所示:

    运行界面


    结束语

        因为本博文主要介绍安装步骤,关于PyQt的设计博文中介绍较简单,更加详细的讲解将在后面的教程中介绍。由于博主能力有限,博文中提及的方法即使经过试验,也难免会有疏漏之处。希望您能热心指出其中的错误,以便下次修改时能以一个更完美更严谨的样子,呈现在大家面前。同时如果有更好的实现方法也请您不吝赐教。

    展开全文
  • 参考链接:...安装Pyside后 Qt Designer是集成到pip包里面的,无需单独安装。安装后如下图 通过 File-Settings (或快捷键Ctrl + Al

    参考链接:https://stackoverflow.com/questions/58599351/integrate-qt-designer-and-pycharm

    前言

    PySide作为Qt的亲儿子,无疑将成为Qt python开发的首选,PySide2已经日趋完善,官方也于2020年12月10日发布了6.0.0版本,正式进入PySide6时代。

    安装Pyside6后 Qt Designer是集成到pip包里面的,无需单独安装。安装后如下图

    整合配置

    通过 File-Settings (或快捷键Ctrl + Alt + S)打开配置窗口,选中Tools-External Tools,点击加号添加外部三方工具,界面及关键配置参数如下

    Arguments: $FilePath$ 
    Working directory: $Projectpath$

    配置完成后Apply和OK保存,工作完成即刻生效,右键打开你的.ui文件试试吧。

    Bingo!

    扩展资料

    Qt Designer 官方文档

    B站PySide视频:Python Qt 图形界面编程 - 华为大叔7天带你入门 - PySide2 PyQt5 PyQt PySide

    白月黑羽教Python官网教程

    展开全文
  • 用PyQt+QtDesigner编写摄像头控制界面程序(一)前言PyQt+QtDesigner及相关插件的安装和设置1、PyQt、QtDesigner及其它工具包的安装2、将QtDesigner和PyUIC链接到PyCharm的外部工具库3、界面设计测试 前言 最近工作...

    前言

    最近工作需要写一个界面程序来调用摄像头并对摄像头采集的图像做一些处理。程序需要使用Python语言编写,经过调研发现PyQt5配合QtDesigner在界面程序编写方面具有功能丰富、入门简单的优点,适合我这种编程的小白。PyQt5虽然入门比较简单,但对于我这种小白来讲还是挺有难度的,学习过程中也费了不少的力气,因此在这里总结一下程序编写的过程,方便以后回顾,也方便有需要的童鞋借鉴。

    我工作中使用的是USB接口输入的Flir相机,结合串口输出将相机和其它硬件组成闭环回路。这里介绍的是一个简化版的界面程序,它调用的是笔记本自带的摄像头,实现的功能就是实时显示摄像头的图像,并且可以设置摄像头的曝光、增益、亮度、颜色等参数,程序比较简单而且对硬件要求较低,非常适合初学者。

    由于内容比较多,我将它分成5个部分介绍,分别为:PyQt+QtDesigner及opencv等工具的安装与设置;基于QtDesigner的界面设计;主程序的编写;笔记本摄像头的读取、显示和参数控制;exe可执行程序的生成。下面介绍第一部分。

    PyQt+QtDesigner及相关插件的安装和设置

    我使用PyCharm作为程序的编写界面,python的版本是3.6,笔记本的操作系统是win10。这部分内容包括PyQt5+QtDesigner以及其它工具包的安装、将QtDesigner和PyUIC链接到PyCharm的外部工具库、使用QtDesigner生成ui文件并将其转换成py文件并编写主函数来显示该界面。

    1、PyQt、QtDesigner及其它工具包的安装

    PyQt和QtDesigner的安装和链接到PyCharm的方法可参考链接:
    Pycharm+Python+PyQt5使用
    我是参照该链接学习,并根据自己的需要做了一些修改,下面介绍一下我的安装过程。
    1)安装PyQt5、QtDesigner、PyUIC、opencv等工具
    (在此之前,需要先完成python和pip工具的安装)
    打开cmd窗口,输入

    pip install pyqt5
    

    电脑会自动下载并安装合适版本的pyqt5.
    完成后,再输入

    pip install pyqt5-tools
    

    自动完成QtDesigner和PyUIC等的安装。
    除此之外,我在程序编写过程中还用到了opencv和qimage2ndarray模块,最后如果想生成exe可执行文件则还需要安装pyinstaller,其安装命令分别为:

    pip install opencv-python
    
    pip install qimage2ndarray
    
    pip install pyinstaller
    

    至此,所有用到的模块都安装完成。

    2、将QtDesigner和PyUIC链接到PyCharm的外部工具库

    QtDesigner与PyCharm的链接见下图所示:点击PyCharm的File->Settings->Tools->External tools打开外部工具界面,点‘+’号进入添加外部工具界面。在‘Name’处输入工具名称,这个名称可以随便取,只要自己清楚就行,我这里写的是Qt designer。然后,找到安装的designer.exe所在的路径(一般在python安装目录下的Lib\site-packages\pyqt5_tools文件夹里),将其路径复制到‘Programs’处,注意要包含designer.exe的文件名。Working directory处设置自己的工作路径,qtdesigner生成的ui文件会默认保存在该路径。‘Arguments’不用设置,确认即可。
    在这里插入图片描述
    接下来,按同样的方法添加pyuic,pyuic用于将qtdesigner生成的.ui文件转换成python可以识别的.py文件。其设置过程如下图所示,Programs处输入python.exe所在的路径和文件名,Arguments处输入:

    -m PyQt5.uic.pyuic -o $FileNameWithoutExtension$.py $FileName$
    

    在Working directory处输入:

    $FileDir$
    

    这样生成的py文件就会和被转换的ui文件位于相同的文件夹下。点击ok完成设置。
    在这里插入图片描述
    设置完成后就可以在PyCharm的Tools->External Tools菜单下看到我们新添加的工具了。
    在这里插入图片描述

    3、界面设计测试小程序

    打开PyCharm,选择菜单File->New Project新建一个工程项目,如下图所示,输入该项目的路径和名称,这里设置项目名称为PyQtTest。
    在这里插入图片描述
    完成后,单击Tools->External Tools->Qt designer打开QtDesigner。
    QtDesigner打开后会自动弹出新建窗口的对话框,如果没有弹出的话可以单击File->New来打开该对话框。如下图所示,选择Main Windows,然后单击Create来创建一个主窗口。
    在这里插入图片描述
    QtDesigner打开后的界面如下图所示,我用红框标出了四个常用的区域,左上角的区域显示了我们界面窗口所有使用的控件列表和对应的名称;左下角区域是所有可用的控件库;中间是工作区,我们可以将控件从控件库拖拽到工作区来组合我们的程序界面;右侧区域为控件属性设置区,在我们单击选中某一个控件后,它的属性就会在这里显示出来,我们也可以在这里对控件的属性进行修改。
    在这里插入图片描述
    在左下角的控件菜单中找到Push Button,用鼠标左键将其拖到中间区域,然后单击File->Save as,将当前界面保存到我们刚创建的PyQtTest项目文件夹下,文件名设为QtTest.ui。
    保存完成后,回到PyCharm中,可以看到我们的PyQtTest项目下多了一个QtTest.ui文件。鼠标右键单击该文件调出右键菜单,单击External tools->PyUIC,程序会调用pyuic,将ui文件转换为py文件,执行完成后就会在该项目中生成一个QtTest.py文件了。打开QtTest.py文件会发现,里面只有一个Ui_MainWindow类,没有主程序,我们需要自己编写一个主程序来调用Ui_MainWindow类。由于QtTest.py是通过pyuic自动生成的,当我们在qtdesigner中对程序界面进行修改,并重新生成QtTest.py时,里面原来的内容会被全部覆盖掉,因此我们尽量不要在QtTest.py中添加自己的代码,而是新建一个py文件来调用QtTest.py中的类,将自己的代码都放在新创建的文件中。
    在这里插入图片描述

    接下来右键单击PyQtTest项目,选择New->Python File新建一个Python文件,文件名设为’QtUi.py’,打开该文件输入如下代码:

    from QtTest import Ui_MainWindow
    import sys
    from PyQt5.QtWidgets import QApplication,QMainWindow
    
    class CamShow(QMainWindow,Ui_MainWindow):
        def __init__(self,parent=None):
            super(CamShow,self).__init__(parent)
            self.setupUi(self)
    
    if __name__ == '__main__':
        app = QApplication(sys.argv)
        ui=CamShow()
        ui.show()
        sys.exit(app.exec_())
    

    然后在代码区单击右键选择Run QtUi,执行该代码,即可显示出我们在QtDesigner中设计的程序界面了。
    在这里插入图片描述

    本节介绍了PyQt、QtDesigner、PyUIC以及Opencv等工具的安装和PyCharm的外部工具配置,并简单介绍了从程序界面设计到最终程序运行的流程。下一节将详细介绍使用QtDesigner设计摄像头程序界面的过程。

    展开全文
  • Qt Designer汉化包

    2018-08-15 20:55:13
    Qt Designer汉化包,实现Designer的汉化,内附有汉化教程,亲测,可以汉化
  • 上一节介绍了PyQt和QtDesigner等工具的安装和环境设置,本节主要介绍QtDesigner的使用方法,利用QtDesigner完成相机控制程序的界面设计。 一、程序布局 还是接着上一节的PyQtTest项目进行编辑,在PyCharm里单击Tools...
  • PyQt5 图形界面-用Qt Designer来设计UI界面,并转化为python代码运行实例演示。 Qt DesignerQt Creater 程序里的一个功能。 PyQt5是把 Qt Designer 设计的界面转化为python代码的库。 首先打开我们的Qt Creater...
  • PyQt5+Qt designer实战

    万次阅读 多人点赞 2018-07-13 17:36:20
    PyQt5+Qt designer 制作计算器 配置说明: Anaconda 4.2.0 (64-bit) Python 3.5.2 首先,在Qt designer里面设计界面: 打开 Qt designer后,设计界面如下所示: 保存为clat.ui。然后将其转为py文件: ...
  • 本文主要总结了在QT Designer中使用资源和设置控件的一些操作方法: 首先,想要在QT Designer中给UI增加按钮图标、背景图片等,需要定义一个资源文件,通常的做法是将图片和资源文件放在同一个文件夹下,资源...
  • 通过百度我晓得了原来也可以通过Qt Designer来完成。Qt Designer的设计符合MVC的架构,其实现了视图和逻辑的分离,从而实现了开发的便捷。Qt Designer中的操作方式十分灵活,其通过拖拽的方式放置控件可以随时查看...
  • Qt Designer位置

    2021-01-16 10:03:03
    Qt Designer位置 Ctrl+S 运行搜索designer,可以运行,但找不到designer.exe. 在C盘搜索后发现我的Qt Designer位置在 C:\python\Lib\site-packages\qt5_applications\Qt\bin
  • 课程目录视频链接课程重点代码位置完整代码遇到的问题改写效果展示改写注意点改写代码(QTdesigner模式) 老师原课件下载地址: 有积分的朋友,支持下我,打赏也OK。 不下载也可以,我每节课会吧代码贴出来 视频...
  • 课程目录视频链接课程重点代码位置完整代码遇到的问题改写效果展示改写注意点改写代码(QTdesigner模式) 老师原课件下载地址: 有积分的朋友,支持下我,打赏也OK。 不下载也可以,我每节课会吧代码贴出来 视频...
  • Qt Designer 如何下载

    千次阅读 2019-09-28 14:46:34
    https://build-system.fman.io/qt-designer-download 可以用这个地址下载但是比较慢 2.我把这个放到csdn上 windows版 MacOS版 谷歌:Qt Designer 搜索结果中,点击Qt Designer Download for Windows and Mac的连接...
  • Qt创建Qt Designer自定义控件

    千次阅读 2018-03-01 11:19:49
    而自定义Qt Designer控件就是自己写一个控件,这个控件能够出现在Qt Designer控件列表中(也可以不在Qt Designer控件列表中出现,主要取决于生成的库文件,是否拷贝进Qt的相关目录下,下文会详细介绍),例如最出名...
  • QT Creator/QT Designer水平布局/垂直布局/控件位置自适应QT Creator/QT Designer水平布局/垂直布局/控件位置自适应一、界面设计需求/学习需求二、水平布局和垂直布局三、控件位置全局自适应四、参考资料 ...
  • 课程目录一点心得视频链接课程重点代码位置完整代码遇到的问题改写效果展示改写注意点改写代码(QTdesigner模式) 老师原课件下载地址: 有积分的朋友,支持下我,打赏也OK。 不下载也可以,我每节课会吧代码贴出来 ...
  • 课程目录视频链接课程重点代码位置完整代码遇到的问题改写效果展示改写注意点改写代码(QTdesigner模式) 老师原课件下载地址: 有积分的朋友,支持下我,打赏也OK。 不下载也可以,我每节课会吧代码贴出来 视频...
  • Qt Designer使用

    2019-04-11 14:48:54
    Qt Designer是专门用来制作PyQt程序中UI界面的工具,它生成的UI界面是一个后缀为.ui的文件。 通过命令将.ui文件转换成.py格式的文件,并被其他Python文件引用,也可以通过Eric 6进行手工转换。.ui文件其实是XML格式...
  • pycharm QtDesigner配置

    2019-09-04 20:00:23
    pycharm 设计工具 QTDesigner 的基本配置。
  • Qt Designer的安装与汉化教程

    万次阅读 多人点赞 2018-08-15 20:49:05
    第一步:PyQt5的安装 cmd下输入安装指令如下,注意,确保python环境的配置无误 pip install PyQt5 pip install PyQt5-tools ...就是上图的第一个文件就是汉化包,放入即可实现Qt Designer的汉化 再次打开,效...
  • PyCharm+PyQt5+QtDesigner配置

    万次阅读 多人点赞 2018-07-17 16:47:38
    最近要在python下做可视化界面的设计,想到之前用QtDesigner来画界面很是方便,当时画完之后都要手动在终端输入 pyuic5 -o 1.py 1.ui 来把.ui文件转换为.py的代码再进行编辑,不是很方便,联想到要是能在PyCharm下...
  • Qt Designer 设计信号与槽

    千次阅读 2019-02-17 12:53:19
    前一篇文章总结了基础的信号与槽的使用,在写下一篇信号与槽高级玩法之前想介绍一下Qt Designer使用信号与槽 首先安利一下Qt Designer,之前我不喜欢可视化编程这些工具,一直没有碰Qt Designer,上位机一旦功能...
  • 课程目录视频链接课程重点代码位置完整代码遇到的问题改写效果展示改写注意点改写代码(QTdesigner模式) 老师原课件下载地址: 有积分的朋友,支持下我,打赏也OK。 不下载也可以,我每节课会吧代码贴出来 视频...
  • PyCharm如何使用Qt Designer

    千次阅读 2020-01-28 20:47:16
    Qt Designer 是一个 GUI 设计器,能可视化设计出界面。PyQT5 通过 pyuic5 工具将 Qt Designer 生成的 xxx.ui 文件转换成 python 代码,大大节省手工编写界面代码的工作量。 本篇介绍如何在 PyCharm 中集成 Qt ...
  • 简单的提一下PyQt5,Qt Designer的安装 python 版本:3.6.2 使用pip安装: pip3 install PyQt5 之后通过安装PyQt5-tools,会自动安装Qt Designer pip install PyQt5-tools 比着这个学的安装,所以 推荐...
  • Qt Designer 最新中文手册文档(Qt6)

    千次阅读 2021-01-07 15:12:27
    Qt Designer软件作为一款Qt辅助工具,其允许我们使用所见即所得的方式,通过Qt Widgets来创建图形用户界面。 正好最近要学习Qt for Python(PySide6),工欲善其事,必先利其器,准备系统的学习一下Qt Designer,网上...
  • 课程目录视频链接课程重点代码位置完整代码遇到的问题改写效果展示改写注意点改写代码(QTdesigner模式) 老师原课件下载地址: 有积分的朋友,支持下我,打赏也OK。 不下载也可以,我每节课会吧代码贴出来 视频...
  • pyQt QTDesigner

    千次阅读 2018-07-17 15:57:35
    出处: 1、http://code.py40.com/2540.html 2、https://www.jianshu.com/p/962b572a216c ... QtDesigner简单介绍 Qtdesigner是Python设计里面一个非常实用的工具,使得人们编写qt界面可以不仅仅是使用纯代码,...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 20,048
精华内容 8,019
关键字:

qtdesigner