Tabs

Nesse tutorial iremos aprender a fazer uma tab widget (janela com abas), ela permite que vários documentos ou painéis sejam contidos em uma única janela.

Criando a tab widget

Para começarmos, ao criar o seu projeto vá até a pasta “Forms” a abra o arquivo .ui, com isso a ferramenta design irá abrir.

Rolando o scroll vai até a seção de Containers, selecione Tab Widget e insira na janela.

Nomeando as tabs e adicionando componentes

Já temos nossa janela com abas, agora vamos mexer nas propriedades para deixar nossas abas mais completas! Para isso, vamos até a seção QTabWidget nas propriedades e alterar a com o nome “currentTabText”, dessa forma modificaremos o nome na aba.

Para adicionarmos conteúdo dentro das aba, role o scroll dos componentes até a seção de “Display Widgets” e insira a “Label” colocando o texto que desejar

Removendo e movendo tabs

Após isso, vamos ativar essas duas propriedades da QTabWidget:

Com a “tabsClosable” poderemos fechar as tabs, agora elas têm o ícone “X” informando isso:

Porém, apesar de clicarmos no ícone elas não fecharão ainda, para isso acontecer teremos que adicionar um método no nosso código.

Antes, vamos ver o resultado de ativar a propriedade “movable”. Ela permite mover as janelas e ordenar elas da forma que desejamos. Se não quiser que isso ocorra, é só desabilitar ela.

Cada janela recebe o seu valor de Index, que está na propriedade “currentIndex”. Isso ordena elas e nos permite usar o método para as remover.

Para adicionar o método de remover tab, aperte o botão direito, clique em “Go to slot…” e em seguida clique em “tabCloseRequested”

O código ficará assim:

mainwindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"

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

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

void MainWindow::on_tabWidget_tabCloseRequested(int index)
{
    ui->tabWidget->removeTab(index);
}

No método tabCloseRequested temos o parâmetro index, que vai conter o número da tab que queremos fechar. Vamos chamar o nosso componente tabWidget e a função removeTab passando o index (número da tab), assim removemos a janela.

void MainWindow::on_tabWidget_tabCloseRequested(int index)
{
    ui->tabWidget->removeTab(index);
}

Adicionando tab

Para adicionar uma tab clique no botão direito → “insert page” → “after current page” (após a página atual) ou “before current page” (antes da página atual).

Para remover essa tab sem você pode clicar no botão direito → “Page 4 of 4” (os números vão de acordo com a tab em que você está)→delete