Гайд Как сделать GUI на Python [Часть 2], [Qt Designer]

[SQL]

Приветствую, вот и 2-я часть, сегодня я расскажу, как сделать полноценное, относительно нормальное меню.
Ну для начала создадим окно, теперь было бы не плохо сделать задний фон, понадобится виджет Label (В котором пишут текст).
Перемещаем его на окно, и растягиваем его границы по краям, и теперь потребуется в разделе Property Editor пролистать ниже, и найти пункт "styleSheet".

Спойлер: Скриншот

В этот пункт пишем "background-color: ", и сам цвет можно указать двумя способами, к примеру: "background-color: gray" или "background-color: rgb(100,100,100), и получаем задний фон.

Спойлер: Скриншот

Но если вы хотите поставить картинку, а не однотонный задний фон ?! Выход есть!
Для этого ищем пункт "pixmap" и выбираем путь до картинки.

Спойлер: Скриншот

Теперь как задать имя окну, что бы отображалось на "Form", а Ваше название, для этого переходим в раздел Object inspector и выбираем объект "Object | QWidget", и в пункте "windowTitle" пишем свое название.

Спойлер: Скриншот

Так же, если Вы хотите поставить свою икоку для окна, то ниже есть пункт под названием "windowsIcon", выбираем картинку (Желательно использовать png размером 48*48).

Спойлер: Скриншот

Теперь, начнем наробту с кнопкой, так же переходим в "styleSheet", и вишем туда команды:

QPushButton{
  color: white;                     # Цвет текста кнопки
  background-color: rgb(15,15,15);  # Цвет фона кнопки
  width: 75px;                      # Ширина кнопки
  height: 50px;                     # Высота кнопки
  font-size: 14px;                  # Размер текста
  font-weight: bold;                # Хз что это
  border: none;                     # Хз что это
  text-align: center;               # Тест по середине кнопки
}
# Состояние кнопки, когда на нее наводятся
QPushButton:hover {
  background-color: rgb(40,40,40);  # Меняем цвет кнопки на более светлый
}
# Состояние кнопки, когда на нее нажали
QPushButton:pressed {
  background-color: rgb(60,60,60);  # Меняем цвет кнопки на еще более светлый
}

В итоге получаем:

Спойлер: Скриншот

Теперь о Tab Widget, тут особо заморачиваться не будем, просто найдем "documentMode" и поставим галочку, и белый фон пропадет, создадим задний фон, и переместим на этот виджет.

Спойлер: Скриншот

Сейчас поработаем над виджетом "LineEdit", перемещаем его на меню, и открываем "styleSheel" и для начало сделаем для него фон (background-color:), добавим свой шрифт нажатием на кнопку "add Font" и меняем цвет текста (color: ).

Спойлер: Скриншот

Но можно еще лучше, добавляем "border-style: solid;", "border-width: 1px;" (Ширина линии), "border-color: yellow"; (Цвет линии), и уже получим:

Спойлер: Скриншот

Это можно сказать все, по этим примерам, таким образом можно редактировать практически любой виджет, ниже будет видео, как я делал, покедова.
P.S Блять, купите аккаунты, заебался уже.

Пожалуйста, авторизуйтесь для просмотра ссылки.

 

[haxxerbad]

border: none; # Хз что это
Если бы c# то там можно было сделать flat

 

[FlensT]

Тут стили такие же как в css. border:none - нету рамок
font-weight:bold - жирный шрифт.

 

[SQL]

Тут стили такие же как в css. border:none - нету рамок
font-weight:bold - жирный шрифт.

Весь qt - это css

 

[FlensT]

Весь qt - это css

Ну я так и понял. Очень удобно получаеца. Сам начал изучать python чтобы научиться бэк писать, потому что html, css, bootstrap знаю, но фронт не вдохновил совершенно и js с react'ом изучать расхотелось. А тут оказывается мои знания могут пригодиться в создании GUI, клево. Спасибо за гайд.

 

[nikmenplay]

Ну по сути это просто css вот только как задизайнить верхний бар

 

[SQL]

Ну по сути это просто css вот только как задизайнить верхний бар

Это ни как, это уже обрамление самой OC, я лишь могу сказать, как убрать обрамление, но тебе придется свое делать уже в меню, и делать виджет на перемещение окна

 

[nikmenplay]

Это ни как, это уже обрамление самой OC, я лишь могу сказать, как убрать обрамление, но тебе придется свое делать уже в меню, и делать виджет на перемещение окна

Ок как эту штуку сделать?

 

[SQL]

Ок как эту штуку сделать?

Вырезаешь эту хуету из кода:


Вставляешь:

class Widget(QtWidgets.QWidget, Ui_Form):
    def __init__(self, parent=None):
        super(Widget, self).__init__(parent)
        self.setupUi(self)
        self.setWindowFlags(QtCore.Qt.FramelessWindowHint)

if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    Form = QtWidgets.QWidget()
    ui = Widget()
    ui.show()
    sys.exit(app.exec_())

Получаем:

 

[nikmenplay]

Вырезаешь эту хуету из кода:
Посмотреть вложение 92398

Вставляешь:

class Widget(QtWidgets.QWidget, Ui_Form):
    def __init__(self, parent=None):
        super(Widget, self).__init__(parent)
        self.setupUi(self)
        self.setWindowFlags(QtCore.Qt.FramelessWindowHint)

if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    Form = QtWidgets.QWidget()
    ui = Widget()
    ui.show()
    sys.exit(app.exec_())

Получаем:
Посмотреть вложение 92400

ок а как сделать чтобы окно можно было двигать

 

[SQL]

ок а как сделать чтобы окно можно было двигать

не знаю, как вариант, можешь сделать не видимую кнопку, при зажатии она считывает координаты курсора, и перекидывает туда меню, но у тебя менюшку будет наверное дергать, как пидорас хуи

 

[Крайслер]

ок а как сделать чтобы окно можно было двигать

не знаю, как вариант, можешь сделать не видимую кнопку, при зажатии она считывает координаты курсора, и перекидывает туда меню, но у тебя менюшку будет наверное дергать, как пидорас хуи

Нужно перегрузить два метода:

QPoint        m_pCursorPosition;
 virtual void mousePressEvent(QMouseEvent *e) Q_DECL_OVERRIDE;
  virtual void mouseMoveEvent(QMouseEvent *e) Q_DECL_OVERRIDE;

void cTitleBar::mousePressEvent(QMouseEvent *e)
{
    if( e->button() == Qt::LeftButton ) {
        m_pCursorPosition = mapToParent(e->pos());
    }
}
void cTitleBar::mouseMoveEvent(QMouseEvent *e)
{
    if(e->buttons() & Qt::LeftButton){
        parentWidget()->move(e->globalPos() - m_pCursorPosition);
    }
}

в моем случаи cTitleBar это наследник от QWidget

 

[SQL]

Нужно перегрузить два метода:

QPoint        m_pCursorPosition;
virtual void mousePressEvent(QMouseEvent *e) Q_DECL_OVERRIDE;
  virtual void mouseMoveEvent(QMouseEvent *e) Q_DECL_OVERRIDE;

void cTitleBar::mousePressEvent(QMouseEvent *e)
{
    if( e->button() == Qt::LeftButton ) {
        m_pCursorPosition = mapToParent(e->pos());
    }
}
void cTitleBar::mouseMoveEvent(QMouseEvent *e)
{
    if(e->buttons() & Qt::LeftButton){
        parentWidget()->move(e->globalPos() - m_pCursorPosition);
    }
}

в моем случаи cTitleBar это наследник от QWidget

Брат, это python

 

[P1KRAmag]

Нужно перегрузить два метода:

QPoint        m_pCursorPosition;
virtual void mousePressEvent(QMouseEvent *e) Q_DECL_OVERRIDE;
  virtual void mouseMoveEvent(QMouseEvent *e) Q_DECL_OVERRIDE;

void cTitleBar::mousePressEvent(QMouseEvent *e)
{
    if( e->button() == Qt::LeftButton ) {
        m_pCursorPosition = mapToParent(e->pos());
    }
}
void cTitleBar::mouseMoveEvent(QMouseEvent *e)
{
    if(e->buttons() & Qt::LeftButton){
        parentWidget()->move(e->globalPos() - m_pCursorPosition);
    }
}

в моем случаи cTitleBar это наследник от QWidget

Ясно беды с башкой у модера(шутка не баньте пж, я отсасу)

 

[SQL]

Ясно беды с башкой у модера(шутка не баньте пж, я отсасу)

давай

 

[P1KRAmag]

давай

Жду адрес, куда сасать.

 

[Крайслер]

Брат, это python

Но фреймворк один и тот же. +- методы одинаковые по факту. различие только в реализации

 

[SQL]

Но фреймворк один и тот же. +- методы одинаковые по факту. различие только в реализации

Ладно

 

[Крайслер]

Ладно

Пожалуйста, авторизуйтесь для просмотра ссылки.

я питон не знаю, но судя по этой теме, питон умеет работать с перегрузками методов, так что все упирается в конкретную реализацию на нужном языке

 

[SQL]

Пожалуйста, авторизуйтесь для просмотра ссылки.

я питон не знаю, но судя по этой теме, питон умеет работать с перегрузками методов, так что все упирается в конкретную реализацию на нужном языке

А ты кстати кто ?