Qt小动画之实现控件上下移动

一、简述

2020已经过去，迎来了2021，时间过的真快呀，好久没有在csdn上写博客了，也没有再给大家分享更多好玩有趣的Code，那么今天就给大家分享一个之前写的一个小动画示例。

二、代码之路

下图是实现效果图，主要思路是使用两个动画对象，操作上下需要移动的控件即可。

MoveWidget::MoveWidget(QWidget *parent)
	: QWidget(parent)
	, m_currentWidget(nullptr)
{
	initMenu();
	initAnimation();
	this->setFixedWidth(400);
	simulateWidget();
}

MoveWidget::~MoveWidget()
{
}

void MoveWidget::addWidget(QWidget* widget)
{
	m_widgetList.append(widget);
	widget->setParent(this);
}

void MoveWidget::updateWidgetPos()
{
	int totalHeight = 0;
	for (int i = 0; i < m_widgetList.count(); i ++)
	{
		QWidget* widget = m_widgetList[i];
		widget->move(QPoint(0, totalHeight));
		totalHeight += widget->height();
	}

	// 当没有添加任何控件的时候，这里可以自行设置默认高度;
	if (totalHeight == 0)
	{
		totalHeight = 100;
	}
	this->setFixedHeight(totalHeight);
}

void MoveWidget::initMenu()
{
	m_menu = new QMenu(this);
	QAction* moveUpAction = m_menu->addAction("上移");
	QAction* moveDownAction = m_menu->addAction("下移");
	QAction* moveDeleteAction = m_menu->addAction("删除");

	connect(moveUpAction, &QAction::triggered, this, &MoveWidget::onMoveUpWidget);
	connect(moveDownAction, &QAction::triggered, this, &MoveWidget::onMoveDownWidget);
	connect(moveDeleteAction, &QAction::triggered, this, &MoveWidget::onDeleteWidget);
}

void MoveWidget::initAnimation()
{
	m_moveUpAnimation = new QPropertyAnimation(this, "Up");
	// 设置动画时长;
	m_moveUpAnimation->setDuration(1000);
	// 设置动画变化类型;
	m_moveUpAnimation->setEasingCurve(QEasingCurve::OutQuad);
	connect(m_moveUpAnimation, &QPropertyAnimation::valueChanged, this, [=](const QVariant &value) {
		m_moveUpWidget->move(QPoint(0, value.toInt()));
	});

	m_moveDownAnimation = new QPropertyAnimation(this, "Down");
	m_moveDownAnimation->setDuration(1000);
	m_moveDownAnimation->setEasingCurve(QEasingCurve::Linear);
	connect(m_moveDownAnimation, &QPropertyAnimation::valueChanged, this, [=](const QVariant &value) {
		m_moveDownWidget->move(QPoint(0, value.toInt()));
	});
}

void MoveWidget::simulateWidget()
{
	// 测试数据;
	QWidget* widget1 = new QWidget;
	widget1->setFixedSize(QSize(400, 200));
	widget1->setStyleSheet("background:red");

	QWidget* widget2 = new QWidget;
	widget2->setFixedSize(QSize(400, 100));
	widget2->setStyleSheet("background:yellow");

	QWidget* widget3 = new QWidget;
	widget3->setFixedSize(QSize(400, 250));
	widget3->setStyleSheet("background:blue");

	QWidget* widget4 = new QWidget;
	widget4->setFixedSize(QSize(400, 200));
	widget4->setStyleSheet("background:black");

	addWidget(widget1);
	addWidget(widget2);
	addWidget(widget3);
	addWidget(widget4);

	updateWidgetPos();
}

void MoveWidget::mouseReleaseEvent(QMouseEvent *event)
{
	if (Qt::RightButton == event->button())
	{
		QPoint mousePoint = event->pos();
		m_currentWidget = nullptr;
		for (int i = 0; i < m_widgetList.count(); i++)
		{
			QWidget* widget = m_widgetList[i];
			QRect rect = widget->rect().translated(widget->pos());
			if (rect.contains(mousePoint))
			{
				m_currentWidget = m_widgetList[i];
				break;
			}
		}
		m_menu->exec(this->mapToGlobal(mousePoint));
	}
}

void MoveWidget::onMoveUpWidget()
{
	int index = m_widgetList.indexOf(m_currentWidget);
	if (index > 0 && m_widgetList.count() > 1)
	{
		m_moveUpWidget = m_currentWidget;
		m_moveDownWidget = m_widgetList[index - 1];

		m_widgetList[index - 1] = m_moveUpWidget;
		m_widgetList[index] = m_moveDownWidget;

		m_moveUpAnimation->setStartValue(m_moveUpWidget->pos().y());
		m_moveUpAnimation->setEndValue(m_moveDownWidget->pos().y());

		m_moveDownAnimation->setStartValue(m_moveDownWidget->pos().y());
		m_moveDownAnimation->setEndValue(m_moveDownWidget->pos().y() + m_moveUpWidget->height());

		m_moveUpWidget->raise();
		m_moveUpAnimation->start();
		m_moveDownAnimation->start();
	}
}

void MoveWidget::onMoveDownWidget()
{
	int index = m_widgetList.indexOf(m_currentWidget);
	if (index >= 0 && m_widgetList.count() > 1 && index != m_widgetList.count() - 1)
	{
		m_moveUpWidget = m_widgetList[index + 1];
		m_moveDownWidget = m_currentWidget;

		m_widgetList[index + 1] = m_moveDownWidget;
		m_widgetList[index] = m_moveUpWidget;

		m_moveUpAnimation->setStartValue(m_moveUpWidget->pos().y());
		m_moveUpAnimation->setEndValue(m_moveDownWidget->pos().y());

		m_moveDownAnimation->setStartValue(m_moveDownWidget->pos().y());
		m_moveDownAnimation->setEndValue(m_moveDownWidget->pos().y() + m_moveUpWidget->height());

		m_moveDownWidget->raise();
		m_moveUpAnimation->start();
		m_moveDownAnimation->start();
	}
}

void MoveWidget::onDeleteWidget()
{
	int index = m_widgetList.indexOf(m_currentWidget);
	if (index >= 0)
	{
		m_widgetList.removeOne(m_currentWidget);
		m_currentWidget->setParent(nullptr);
		m_currentWidget->deleteLater();
		m_currentWidget = nullptr;
		updateWidgetPos();
	}
}