Qt/C++ - Оқулық 086. Жылжымалы түйме үшін QSequentialAnimationGroup және QPropertyAnimation пайдалану

QSequentialAnimationGroup, cpp, Qt, C++, QPropertyAnimation

Сипат анимациялары арқылы түйме жылжитын шағын қолданба үлгісін жазайық. Ол үшін QSequentialAnimationGroup және QPropertyAnimation кластарын қолданамыз.

QSequentialAnimationGroup – алдыңғы QPropertyAnimation. аяқталған кезде бір анимацияны автоматты түрде бастауға мүмкіндік беретін бірнеше анимацияларды бір топқа біріктіретін класс.

Түймені басқан кезде анимация басталады және сол түйме суретте көрсетілгендей терезеде жылжиды.

Біз жобаны әдепкі бойынша Qt Creator бағдарламасында жасаймыз және барлық өзгерістер тек Виджет сыныбына қатысты болады. Графикалық дизайнер арқылы QPushButton түймешігін қосу қажет болады.

Widget.h

Міне, кодтағы мысал

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

#include <QSequentialAnimationGroup>

namespace Ui {
class Widget;
}

class Widget : public QWidget
{
    Q_OBJECT

public:
    explicit Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void onClickButton();

private:
    Ui::Widget *ui;

    // Группа анимации для кнопки
    QSequentialAnimationGroup* animationGroup;
};

#endif // WIDGET_H

Widget.cpp

Маңызды мәселе, біз QPropertyAnimation жасағымыз келетін сипатты көрсетеміз. Бұл жағдайда бұл «геометрия» . Сыныпта Q_PROPERTY. ретінде жарияланған болса, сипат анимациялануы мүмкін. Содан кейін бұл сипат мәндерінің біркелкі өзгеруі орындалады.

#include "widget.h"
#include "ui_widget.h"

#include <QPropertyAnimation>
#include <QDebug>

Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
    ui->setupUi(this);

    // Создадим группу анимации
    animationGroup = new QSequentialAnimationGroup(this);

    // Создадим анимацию свойства передвижения слева-сверху направо-сверху
    QPropertyAnimation* leftTopToRightTop = new QPropertyAnimation(ui->pushButton, "geometry");
    leftTopToRightTop->setDuration(1000); // Длительность анимации
    leftTopToRightTop->setStartValue(ui->pushButton->geometry()); // Стартовая позиция и геометрия анимации
    leftTopToRightTop->setEndValue(ui->pushButton->geometry().translated(100, 0)); // Конечная позиция и геометрия анимации
    animationGroup->addAnimation(leftTopToRightTop); // Добавим анимацию в группу

    // Справа-сверху вниз-справа
    QPropertyAnimation* rightTopToRightBottom = new QPropertyAnimation(ui->pushButton, "geometry");
    rightTopToRightBottom->setDuration(1000);
    rightTopToRightBottom->setStartValue(leftTopToRightTop->endValue());
    rightTopToRightBottom->setEndValue(leftTopToRightTop->endValue().toRect().translated(0, 100));
    animationGroup->addAnimation(rightTopToRightBottom);

    // Снизу-справа налево-вниз
    QPropertyAnimation* rightBottomToLeftBottom = new QPropertyAnimation(ui->pushButton, "geometry");
    rightBottomToLeftBottom->setDuration(1000);
    rightBottomToLeftBottom->setStartValue(rightTopToRightBottom->endValue());
    rightBottomToLeftBottom->setEndValue(rightTopToRightBottom->endValue().toRect().translated(-100, 0));
    animationGroup->addAnimation(rightBottomToLeftBottom);

    // Слева-снизу наверх-слева
    QPropertyAnimation* leftBottomToLeftTop = new QPropertyAnimation(ui->pushButton, "geometry");
    leftBottomToLeftTop->setDuration(1000);
    leftBottomToLeftTop->setStartValue(rightBottomToLeftBottom->endValue());
    leftBottomToLeftTop->setEndValue(rightBottomToLeftBottom->endValue().toRect().translated(0, -100));
    animationGroup->addAnimation(leftBottomToLeftTop);

    // Подключаем нажатие кнопки к слоту обработчику кнопки
    connect(ui->pushButton, &QPushButton::clicked, this, &Widget::onClickButton);
}

Widget::~Widget()
{
    delete ui;
}

void Widget::onClickButton()
{
    // Запускаем анимацию
    animationGroup->start();
}

Қорытынды

Осылайша, Q_PROPERTY макросымен белгіленген және орнату және алу әдістері бар нысан сипаттары үшін әртүрлі анимацияларды орнатуға болады.

Git репозиторийіне сілтеме