PYQT5 Series tutorial (ii) Design UI interface using Qtdesigner

Hardware and Software EnvironmentOS X EI Capitan Python 3.5.1 PyQt 5.5.1 pycharm 5.0.1 Preface

In the first http://blog.csdn.net/djstavaV/article/details/50218157 of the PYQT5 series, we've built the development environment, and today we're using Python to develop the first QT GUI program, Let everyone feel the charm of QT development, familiar with the QT development GUI program general process.

There are typically 2 ways to make a program UI interface, using UI authoring tools and pure code, like Android and iOS in mobile development, and in PYQT5 we have 2 different ways. Introduction to Qtdesigner Tools

Qtdesigner is a tool designed to make a UI interface for the QT program, which is very simple to use, as long as you can perform complex interface design by dragging and clicking, and previewing the view of the effect at any time.

Among them, the area 1 is the UI Interface Production guide, Qtdesigner provides us with some common modules, is very convenient; Zone 2 is a list of UI controls; Area 3 is the list of control properties; Area 4 is the Action Editor edit list; area 5 signal and Slot edit column list Area 6 is the Resource Processing window. First PYQT5 program

With so much to say, it might as well be a hands-on practice.

This is our first PYQT5 project interface effect diagram, what needs to be achieved is when clicked the button on the interface, pops up a prompt box, the prompt box displays a string of text.

Well, the target is set, and start to implement it immediately. Qtdesigner Design UI

Create a UI file based on the main window module named Firstpyqt5.ui. Find (or Can) Push Button from widget box, drag it to the workspace, adjust position, enter text on Button, resize font and size, which can be editor in property. The action of the button-click Frame pulls out a very important pair of concepts in Qt, that is, the signal and the slot (signal and slot), and I'm going to do another blog post about that. Now all you need to know is that slot is a function, and if a signal and a slot are bound, then signal is triggered and slot is executed.

So the question is, how to bind signal and slot in Qtdesigner. Open the Edit->edit signals/slots in the menu bar, and then move the cursor over the button to click and drag, and an edit box pops up.

Because is clicks, therefore signal chooses clicked (), slot function does not have now, we click Edit to create a new one, call Firstpyqt5_button_click ()

To illustrate the use of resource files, here are two pictures, one for the main window and one for the action in the Help menu.

Before Qtdesigner references a resource file, you need to prepare a QRC file that is similar to an XML file to develop a path to a resource file

<RCC version= "1.0" >
    <qresource>
        <file>qt.png</file>
        <file>penguin.jpg </file>
    </qresource>
</RCC>

The QRC file can then be poured into the Qtdesigner resource browser so that the resources described in the QRC file can be used to convert Firstpyqt5.ui to Python code

Very simply, the command line tool provided through QT PYUIC5 can be easily implemented

Pyuic5-o firstpyqt5.py Firstpyqt5.ui

Create Pycharm Project

Create a new Python file main.py with the following code

#-*-Coding:utf-8-*-
__author__ = ' djstava@gmail.com '

import sys from

pyqt5.qtwidgets import qapplication , Qmainwindow from

firstPyQt5 import *

if __name__ = = ' __main__ ':
    '
    main function '

    app = Qapplication (sys.argv)
    MainWindow = Qmainwindow ()
    UI = Ui_mainwindow () ui.setupui
    (MainWindow)
    Mainwindow.show ()
    sys.exit (App.exec_ ())

Next modify the firstpyqt5.py file, mainly to implement the slot function, because before in Qtdesigner did not implement, let it pop up a message box

def firtpyqt5_button_click (self):
    QtWidgets.QMessageBox.information (Self.pushbutton, title, "This is the first PYQT5 GUI program" )

Finally run the project

In general, the UI file is stored separately as a file for easy updating. Source Download

http://download.csdn.net/detail/djstavav/9351205