QT中的StackedWidget控件，通过绑定键盘事件实现窗口的滑动切换

QT中的StackedWidget控件实现窗口的滑动切换

一、StackedWidget控件的简介

StackedWidget是一个容器类控件，它允许我们在里面堆叠多个页面或者面板，并且每个页面内部都可以有自己的布局和内容

二、StackedWidget控件的使用

1.搜索添加控件

StackedWidget控件需要搜索找到，我们可以打开Creator，然后在上方的搜索框中搜索控件名字，然后把控件拖出来就可以了

控件拖出来之后，右侧的树状图会出现以下内容，其中page和page_2就是两个堆叠的页面了，也可以选择这个控件，然会右键，添加新的页面。

2.在page中添加控件

page是一个窗口容器，我们可以在里面添加其他控件，并且可以设置这个页面自己的布局方式。下面是我添加的控件，在这里我们把布局方式同样设置成水平布局。

3.在page_2添加控件

在右侧的树状图中选择page_2，页面会自动切换到一个新的页面中，第二个页面我们设置的简单一些，只添加一个textBrowser_2控件，并且修改其样式表如图所示。

三、StackedWidget控件的窗口切换-绑定键盘事件

目前UI的设计我们已经完成了，接下来就是写代码，一方面调用StackedWidget的函数切换页面，另一方面绑定键盘事件。键盘事件需要编写事件过滤器，我们的窗口类的名字是MainWindow,那么我们就可以重写这个类的过滤器函数，让他拦截键盘事件。
过滤器的工作原理是在父类中编写过滤器函数，当某一事件要触达该父类的子类时，在到达子类之前会被父类的过滤器拦截处理，若过滤器返回false，则经过过滤器处理后，事件会继续往下传递，否则事件被拦截，不往子类传递。

//在.h文件中声明函数
protected:
    bool eventFilter(QObject *obj, QEvent * eve);
    
//在.cpp文件中编写函数
bool MainWindow::eventFilter(QObject *obj, QEvent * eve)
{
	//页面1过滤器处理
    if((obj == ui->pushButton) | (obj == ui->textBrowser) | (obj == ui->textEdit) | (obj == ui->lineEdit))
    {
        if(eve->type() == QEvent::KeyPress)
        {
            QKeyEvent * event = static_cast<QKeyEvent*>(eve);
            
             //方向键检测-右箭头
             if (event->key() == Qt::Key_Right)
             {
                 ui->stackedWidget->setCurrentIndex(1);
                 return true;
             }
        }
    }

    //页面2过滤器处理
    if(obj == ui->textBrowser_2)
    {
        if(eve->type() == QEvent::KeyPress)
        {
            QKeyEvent * event = static_cast<QKeyEvent*>(eve);

             //方向键检测-左箭头
             if (event->key() == Qt::Key_Left)
             {
                   ui->stackedWidget->setCurrentIndex(0);
                   return true;
            	}
         }
   	}
	return false;
}

//在MainWindow类的构造函数中将过滤器添加到控件
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    //给控件添加事件过滤器
    //页面1
    ui->textEdit->installEventFilter(this);
    ui->textBrowser->installEventFilter(this);
    ui->lineEdit->installEventFilter(this);    
    ui->pushButton->installEventFilter(this);

	//页面2
    ui->textBrowser_2->installEventFilter(this);
}

其中：

• StackedWidget控件切换面板的函数：setCurrentIndex(index)。其中参数(index)为页面的标号，从0开始，例如：第一个页面的标号为0，第二个页面的标号为1…。这个函数允许我们在程序运行时，根据需要来切换到指定的页面。
• 对象obj为事件传递的目标对象，我们用着对象判断事件的目标对象是不是我们选定的对象

四、可以优化的地方

Qt中也提供了动画框架，我们在窗口切换的过程中可以添加动画效果，使得窗口切换更加自然美观。这一部分还没有实现，但是后续可以操作一番。