滑动界面之slidingSatckWidget

stack滑动窗口界面

 窗口滑动界面相对于普通的stackWidget窗口管理多了一些动画效果,可以让界面看起来更加酷炫,源码在文章末尾 。如图;
在这里插入图片描述

滑动窗口的原理

  滑动stackwidget的本质就是采用动画效果修饰widget的pos属性,同时移动前后的两个widget的位置,等动画完成之后,最后隐藏前一个widget。整个滑动的效果就达到啦。
核心代码如下:

void SlidingStackedWidget::slideInWgt(QWidget * newwidget,SlideDirection  direction) {
    
	if (m_active) {  //控制下是否需要滑动
        return;
	}

	else m_active=true;

	enum SlideDirection directionhint;
    int now=currentIndex();
	int next=indexOf(newwidget);
	if (now==next) {
		m_active=false;
		return;
	}
	else if (now<next){
		directionhint=m_vertical ? TopToBottom : RightToLeft;
	}
	else {
		directionhint=m_vertical ? BottomToTop : LeftToRight;
	}
	if (direction == Automatic) {
		direction=directionhint;
	}
    
    //获得frame的size 
    int offsetx=frameRect().width();
    int offsety=frameRect().height();
    
//resize新的widget
	widget(next)->setGeometry ( 0,  0, offsetx, offsety );
   
//根据移动的方向模式,计算出偏移量
	if (direction == BottomToTop)  {
		offsetx=0;
		offsety=-offsety;
	}
	else if (direction == TopToBottom) {
		offsetx=0;
		//offsety=offsety;
	}
	else if (direction == RightToLeft) {
		offsetx=-offsetx;
		offsety=0;
	}
	else if (direction == LeftToRight) {
		//offsetx=offsetx;
		offsety=0;
	}
	QPoint pnext=widget(next)->pos();
	QPoint pnow=widget(now)->pos();
	m_pnow=pnow;

//移动,显示新的widget
	widget(next)->move(pnext.x()-offsetx,pnext.y()-offsety);
	widget(next)->show();
	widget(next)->raise();

//初始化动画
	QPropertyAnimation *animnow = new QPropertyAnimation(widget(now), "pos");
	animnow->setDuration(m_speed);
	animnow->setEasingCurve(m_animationtype);
	animnow->setStartValue(QPoint(pnow.x(), pnow.y()));
	animnow->setEndValue(QPoint(offsetx+pnow.x(), offsety+pnow.y()));

	QPropertyAnimation *animnext = new QPropertyAnimation(widget(next), "pos");
	animnext->setDuration(m_speed);
	animnext->setEasingCurve(m_animationtype);
	animnext->setStartValue(QPoint(-offsetx+pnext.x(), offsety+pnext.y()));
	animnext->setEndValue(QPoint(pnext.x(), pnext.y()));

	QParallelAnimationGroup *animgroup = new QParallelAnimationGroup;

	animgroup->addAnimation(animnow);
	animgroup->addAnimation(animnext);

	QObject::connect(animgroup, SIGNAL(finished()),this,SLOT(animationDoneSlot()));
	m_next=next;
	m_now=now;
	m_active=true;
	animgroup->start();
}
void SlidingStackedWidget::animationDoneSlot(void) {
    setCurrentIndex(m_next);
//移动隐藏之前的widget
	widget(m_now)->hide();
	widget(m_now)->move(m_pnow);
	m_active=false;
	emit animationFinished();
}

滑动窗口demo源码链接
以上就是滑动窗口界面的核心内容啦。
                       来自一只快乐的马里奥

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: Qt中的StackedWidget是一个容器小部件,它可以用于存储和管理许多其他小部件。在使用StackedWidget进行页面切换时,对于界面切换的动画效果需要考虑。 Qt提供了多种StackedWidget动画,包括滑入/滑出、淡入/淡出、旋转和翻转等。你可以使用setCurrentIndex()函数来实现动画效果。 在其中一个页面切换到另一个页面时,可以使用QPropertyAnimation类实现缓慢的渐变效果。如果你想实现更复杂的动画效果,可以使用QAnimationGroup类组合多个动画。 如果你希望使用第三方库,可以使用QxtStackedWidget的动画效果。该库提供了更多的动画效果,例如侧拉进出、卡片翻转、渐变动画、缩放动画等。 总之,Qt中的StackedWidget动画可以为你的界面切换增加动态和视觉上的吸引力。使用StackedWidget的动画,可以提高用户对应用程序的印象,并帮助你更好地传达信息。 ### 回答2: Qt StackedWidget 动画是指当切换 StackedWidget 中的不同页面时,可以实现动画效果的功能。这个功能可以通过设置页面的切换方式和持续时间来完成。 具体地说,我们可以使用 Qt 动画框架中的 QPropertyAnimation 类来实现这个功能。我们需要创建一个 QPropertyAnimation 对象,并设置目标属性和值以及动画的持续时间。当用户切换页面时,我们可以调用 QPropertyAnimation 对象的 start() 方法来开始动画。 Qt StackedWidget 支持多种切换动画,包括淡入淡出、从左到右切换、从右到左切换、从上到下切换和从下到上切换等。我们可以使用 setCurrentIndex() 方法来切换页面,并使用 setAttribute() 方法来设置动画属性。 使用 Qt StackedWidget 动画可以提高用户体验,让应用程序更加生动和有趣。但需要注意的是,如果动画太过频繁或过于复杂,可能会影响应用程序的性能。因此,在使用动画效果时,需要根据具体情况进行权衡。 ### 回答3: Qt的StackedWidget支持多种过渡动画效果,包括淡入淡出、滑动、立体翻转等。这些过渡动画可以使应用程序的界面更加美观、直观,增加用户体验。 在使用StackedWidget时,可以设置动画效果的持续时间、缓存类型、方向等。同时,Qt也提供了一些效果较为复杂的动画插件,例如Cute等,可以自定义动画效果,并应用到StackedWidget中。 对于需要自定义动画效果的开发者来说,Qt还提供了QStateMachine和QPropertyAnimation等类,可以使用它们来创建自定义动画效果,并结合StackedWidget进行使用。 总的来说,Qt的StackedWidget动画功能十分强大,可以为应用程序添加美观的界面切换效果,从而提升用户体验。对于开发者来说,掌握这些动画效果的使用方法,可以帮助更好地实现应用程序的需求。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值