Создаём простое приложение
Многие люди борются с тем, чтобы научиться создавать графическое приложение. Самая распространенная причина заключается в том, что они даже не знают, с чего начать. Большинство учебных пособий основаны исключительно на тексте, и трудно научиться разработке графического интерфейса с использованием текста, поскольку графические интерфейсы-это в основном визуальный носитель.
Мы обойдем это, создав простое приложение с графическим интерфейсом, и покажем вам, как легко начать работу. Как только вы поймете основы, легко добавить продвинутые вещи.
Это то, что мы будем строить:
Простое графическое приложение, которое принимает цену, налоговую ставку и вычисляет окончательную цену. Большинство учебников по графическим приложениям пытаются компоновать графические блоки с помощью кода, но это очень болезненно. Мы будем использовать превосходный инструмент QT Designer для верстки нашего приложения:
Так что не нужно бороться, выкладывая дизайн вручную. Все будет сделано графически. Весь исходный код можно найти на сайте github:https://github.com/shantnu/PyQt_first.
Предварительные условия
Если у вас установленаAnaconda, у вас уже будет PyQt4. Если нет, вам нужно будет получить его отсюда: https://riverbankcomputing.com/software/pyqt/download.
Вам также нужен QtDesigner. Я рекомендую вам скачать весь пакет QT, так как там есть и некоторые другие полезные инструменты. Сделать это можно по этой ссылке: https://www.qt.io/download-open-source
Приступаем к работе
Запустите QT Designer. В появившемся окне выберите Главное окно, так как оно даст вам чистый холст:
Следующее, что нужно сделать, это выбрать поле редактирования текста слева:
Перетащите Текстовое редактирование в главное окно, чтобы получить поле типа:
Видите правую сторону, где у меня неумело красным обведен ящик? Вот где находится имя объекта. Имя-это способ, которым этот объект будет вызван из нашего кода Python, поэтому назовите его чем-то разумным.
Я называю его price_box, так как мы будем вводить цену в это поле. Следующее, что мы сделаем, это прикрепим ярлык к коробке, чтобы дать понять пользователю, для чего эта коробка предназначена.
Выше я обвел этикетку кружком. Перетащите его в главное окно.
Он получает текст по умолчанию textLabel. Дважды щелкните по нему и измените его на Цену. Вы также можете сделать текст большим и жирным, как показано здесь:
Для налоговой коробки мы будем использовать что-то другое. См. раздел «спин-бокс»:
Круг слева-это вращающаяся коробка. Это ограничивает вводимые значения. Нам не нужен spinbox, просто хорошо посмотреть, как вы можете использовать различные виджеты, которые предоставляет QT Creator. Перетащите окно spin в окно. Первое, что мы делаем, — это меняем имя объекта на что-то разумное, в нашем случае tax_rate. Помните, что именно так этот объект будет вызываться из Python.
Мы можем выбрать значение по умолчанию для нашегоspinbox. Я выбираю 20:
Если вы посмотрите на изображение выше, вы также можете установить минимальные и максимальные ограничения. Мы сохраним их такими, какие они есть. Мы также добавим еще один ярлык под названием Налоговая ставка, как и раньше. Также посмотрите на обведенную кружком кнопку, которую мы будем использовать далее:
Теперь выберите кнопочный блок и перетащите его в наше окно.
На кнопке просто написано «Кнопка», что не очень полезно. Теперь вы должны знать, как это изменить. Но перед этим мы меняем имя кнопки (а не текст) на calc_tax_button.
Далее мы меняем сам текст:
Перетащите в окно еще одно поле редактирования текста. Вам не нужно маркировать его, так как мы напечатаем результат здесь. Измените его имя на results_window (не показано ниже, но вы уже должны знать, как это сделать).
Если вы хотите, вы можете добавить заголовок. Это простая этикеточная коробка с увеличенным шрифтом:
И сохраните свою работу:
Этот файл будет использоваться в следующей части, когда мы напишем код, поэтому сохраните его где-нибудь, где вы сможете получить к нему доступ. Этот файл, который мы создали, является просто XML-файлом. Откройте его в текстовом редакторе, что-то вроде этого:
Написание кода
Код Qt является объектно-ориентированным и таким образом, что его легко проследить. Каждый из виджетов, которые мы добавили, является объектом со своими собственными функциями, такими как toPlainText() (для чтения значения в поле). Это делает его довольно простым в использовании.
Я уверен, что официальная документация где-то упоминает об этом, но вы должны сделать некоторую настройку, прежде чем сможете использовать код. Я нигде не мог найти эту установку, поэтому я вернулся к официальным примерам (а также к другим онлайн-учебникам), чтобы найти самую маленькую программу, необходимую для инициализации класса. Я проверил эту функцию как pyqt_skeleton.py.
Это полезно, так как каждый раз, когда вы запускаете новый проект PyQt, используйте этот скелет для начала и добавляйте свой код.
Код таков:
import sys
from PyQt4 import QtCore, QtGui, uicqtCreatorFile = «» # Введите файл здесь.
Ui_MainWindow, QtBaseClass = uic.loadUiType(qtCreatorFile)
classMyApp(QtGui.QMainWindow, Ui_MainWindow):
def __init__(self):
QtGui.QMainWindow.__init__(self)
Ui_MainWindow.__init__(self)
self.setupUi(self)if __name__ == «__main__»:
app = QtGui.QApplication(sys.argv)
window = MyApp()
window.show()
sys.exit(app.exec_())
Главное, что нужно отметить, — это строка 3:
qtCreatorFile = «» # Введите файл здесь.
Здесь вы добавляете файл, созданный ранее. Он загружается с помощью встроенной функции:
Ui_MainWindow, QtBaseClass= uic.loadUiType(qtCreatorFile)
Давайте быстро взглянем на код:
if __name__ == «__main__»:
app = QtGui.QApplication(sys.argv)
window = MyApp()
window.show()
sys.exit(app.exec_())
Основной код создает новое графическое приложение Qt. Передача sys.argv необходима, так как QT можно настроить из командной строки. Мы не будем этого делать. Наконец, мы создаем класс MyApp, который наследует от библиотек Qt и инициализирует родительские классы:
classMyApp(QtGui.QMainWindow, Ui_MainWindow):
def __init__(self):
QtGui.QMainWindow.__init__(self)
Ui_MainWindow.__init__(self)
self.setupUi(self)
Вам не нужно знать подробности этого кода. Просто используй скелет и работай над этим. Возьми этот файл, pyqt_skeleton.py, и переименовать его в pyqt_first.py. Это потому, что мы не хотим редактировать исходный файл.
Первое, что нужно сделать, это добавить в код наш XML-файл, тот, который содержит наш графический интерфейс. Замените эту строку:
qtCreatorFile = «» # Введите файл здесь. И qtCreatorFile = «tax_calc.ui»
Это загрузит наш графический файл в память. Теперь ключевым виджетом в нашем графическом интерфейсе была кнопка. Как только вы нажимаете кнопку, что-то происходит. Что? Нам нужно сказать нашему коду, что делать, когда пользователь нажимает кнопку «Рассчитать налог». В функции __init__ добавьте эту строку:
self.calc_tax_button.clicked.connect(self.CalculateTax)
Для чего это? Помните, мы называли нашу кнопку calc_tax_button? (Это было имя объекта, а не текст, который был отображен на нем.) clicked-это внутренняя функция, которая вызывается, когда (сюрприз) кто-то нажимает на кнопку. Все виджеты QT имеют определенные функции, которые вы можете найти в гугле.
Последняя часть кода — connect(self.CalculateTax). Это говорит о том, что подключите эту кнопку к функции под названием self.CalculateTax, так что каждый раз, когда пользователь нажимает эту кнопку, эта функция вызывается.
Мы еще не написали эту функцию. Давай сделаем это сейчас. В классе MyApp добавьте еще одну функцию. Сначала мы рассмотрим всю функцию целиком, а затем перейдем к деталям:
defCalculateTax(self):
price = int(self.price_box.toPlainText())
tax = (self.tax_rate.value())
total_price = цена + ((tax / 100) * price)
total_price_string = «Общая цена с налогом:» + str(total_price)
self.results_window.setText(total_price_string)
Хорошо, давайте посмотрим на код выше, строка за строкой. Мы должны сделать две вещи: прочитать поле цены, прочитать поле налога и рассчитать окончательную цену. Давайте сделаем это сейчас. Помните, что мы будем называть объекты по именам, которые мы им дали (именно поэтому я попросил вас не использовать общие имена по умолчанию, такие как box1, так как это очень скоро привело бы к путанице).
price = int(self.price_box.toPlainText())
Мы уже знаем, что price_box. toPlainText () — это внутренняя функция, которая считывает значение, хранящееся в этом поле. Кстати, вам не обязательно запоминать все эти функции. Я просто Гуглю что-то вроде “QtTextboxreaddata”, чтобы узнать, как называется функция, хотя через некоторое время вы начнете вспоминать имена, так как они очень логично названы.
Считанное значение представляет собой строку, поэтому мы преобразуем его в целое число и сохраняем в переменной price. Далее у нас taxbox:
tax = (self.tax_rate.value())
Опять же, value () — это функция для чтения из спин-бокса. Спасибо, Гугл. Теперь, когда у нас есть обе эти величины, мы можем рассчитать конечную цену, используя очень высокотехнологичную математику:
total_price = цена + ((tax / 100) *price)
total_price_string = «Общая цена с налогом:» + str(total_price)
Мы создаем строку с нашей окончательной ценой. Это происходит потому, что мы будем выводить эту строку непосредственно в наше приложение:
self.results_window.setText(total_price_string)
В нашем results_window мы вызываем функцию setText (), которая выводит созданную нами строку. Просто запустите файл с помощью:
pythonpyqt_first.py
На этом все! Надеюсь эта статья была полезна для вас!
