Software Livre, por Gustavo Lopes

Nas versões 3.x da Qt, você podia inserir o código diretamente pelo Designer nos arquivos *.ui.h. Hoje em dia, não fazemos mais isso. O que fazemos é criar a interface do programa (normalmente, a primeira janela é uma MainWindow), salvá-la com um nome sugestivo (que tal, mainwindow.ui, ham?), e colocamos no mesmo diretório outros arquivos.

 Além do arquivo mainwindow.ui, os outros três arquivos são:

1. um arquivo chamado main.cpp, que irá ser o responsável pela inicialização do seu programa;

2. um arquivo chamado mainwindow.h, que será usado para você declarar os métodos do seu programa; e

3. um arquivo chamado mainwindow.cpp, que conterá a implementação dos métodos que você declarou no arquivo mainwindow.h.

Então, vamos fazer nosso primeiro programa usando o Designer do Qt4.

Antes que você continue a leitura deste pequeno artigo, cabe salientar que isto não é uma regra, e sim, apenas um conselho. Cada programador tem seu método de organização de arquivos. Este artigo é apenas um conselho para quem está iniciando no mundo da programação Qt. Vale lembrar que estamos usando um sistema Mandriva 2008, já com o Qt4 e suas bibliotecas instaladas.

Primeiramente, crie uma pasta. Esta pasta é onde ficarão os arquivos do seu programa. Depois de criada a pasta, crie três arquivos com o seguinte conteúdo:

Arquivo main.cpp

#include <QApplication>

#include “mainwindow.h”

int main(int argc, char *argv[])

{

QApplication app(argc, argv);

MainWindow window;

window.show(); //exibimos a janela

return app.exec();

}

Arquivo mainwindow.h

#include “ui_mainwindow.h”

class MainWindow : public QMainWindow, private Ui::MainWindow

{

Q_OBJECT

public:

MainWindow(QWidget *parent = 0);

private slots:

///A declaração dos métodos vem abaixo.

//void exemploDeMetodo();

};

Arquivo mainwindow.cpp

#include “mainwindow.h”

MainWindow::MainWindow(QWidget *parent)

: QMainWindow(parent)

{

setupUi(this);

///As conecções vêm agora

//connect(actionAdicionar_usu_rio,

// SIGNAL(triggered()),

// this,

// SLOT(fazerAlgo()));

}

///Aqui, vem a implementação dos métodos declarados no arquivo mainwindow.h

//void MainWindow::exemploDeMetodo()

//{

// aqui o código do método exemploDeMetodo()

//}

Observe que várias linhas estão comentadas. Fizemos isto para efeito didático. Agora, abra o Designer e escolha, na lista, a opção “Main Window”. Esse é o tipo de janela que normalmente os programas usam como janela principal. Ela dá suporte à menus e barras de ferramentas. Clique no botão “Create” para criar uma nova janela.

 

Pois é. Observe que o meu Designer está em formato diferente do padrão, ou seja, agrupado (SDI). Configurei desta maneira porque acho melhor de trabalhar assim; o desktop fica parecendo mais “limpo”, sem muitas janelas. Entretanto, isso não importa. O que importa é a gente começar a modelar nossa janela. Inicialmente, temos isso: uma janela em branco.

Agora coloque um botão no canto de uma janela. Um botão, entendeu? Está aí, nessa lista do lado… não, não é esse… sobe mais um pouco… desce… não… aquele alí, ó, o Push Button! Isso! Isso mesmo! Agora arrasta ele para a janela! Muito bem! Faça o mesmo com Label… o Label está lá em baixo da lista. Aí! Esse aí mesmo. Arraste para abaixo do botão. Ótimo. Agora, como sobrou muito espaço, diminua a janela. Ela deverá ficar mais ou menos como mostra a figura abaixo.

Agora, clique duas vezes no botão que você arrastou para sua janela, e mude o texto dele para algo mais amigável, como por exemplo, “mudar texto”. Faça o mesmo com o TextLabel, mudando o texto para “vou mudar”. O nosso objetivo é muito simples: quando o botão for clicado, o texto do Label vai mudar!

Finalmente, salve esta janela. É muito importante o nome do arquivo ser mainwindow.ui, pois os três arquivos que você criou ainda agora pressupõem que este é o nome desta janela. Assim, salve com esse nome (mainwindow.ui) na mesma pasta em que se encontram os três arquivos.

Tudo muito bem, tudo muito bom. É preciso abrir agora, com um terminal, a pasta em que todos esses arquivos (agora 4) se encontram. Como uso KDE, vou usar o Konqueror para ir até a pasta, e, dentro da pasta, basta teclar F4 para abrir um emulador de terminal (o Konsole). Conforme figura abaixo.

Devemos executar três comandos, sendo os dois primeiros obrigatórios apenas na primeira vez que se está compilando o programa. Lembranco que estamos usando Mandriva, os comandos são esses:

/usr/lib/qt4/bin/qmake -project

/usr/lib/qt4/bin/qmake

make

O comando qmake -project vai criar um arquivo com o mesmo nome da pasta atual, mais a extensão *.pro. O segundo comando vai gerar, a partir do arquivo *.pro, um arquivo Makefile, que será usado para compilar o programa. O terceiro comando var gerar o programa propriamente dito. O único comando que você precisará usar daqui para frente é o make, visto que o arquivo *.pro e o Makeflie já estão criados.

Olhando para o Konqueror, e teclando F5 para atualizar a pasta, vemos que um arquivo executável foi criado, com o mesmo nome da pasta. É o seu programa propriamente dito. Dê um duplo clique nele, ou então, pelo terminal digite ./nomeDoArquivo . O programa não faz nada, é só uma interface gráfica inútil; precisamos, ainda, programar os arquivos mainwindow.h e mainwindow.cpp .

Programando o arquivo mainwindow.h

Vamos abrir o arquivo mainwindow.h com um bom editor de textos. O Kate, por exemplo.

Observe as duas figuras acima. É isso mesmo que você deverá fazer. Ou seja, onde está escrito o comentário “//void exemploDeMetodo();”, você substituirá por uma linha sem comentários:

void mudarTexto();

Ou seja, você está criando um novo método chamado mudarTexto(). O que este método fará, você vai implementar agora, no arquivo mainwindow.cpp. Mas antes, salve o arquivo atual.

 

Programando o arquivo mainwindow.cpp

Você deverá, no arquivo mainwindow.cpp, descomentar as linhas do método fazerAlgo, e substituir o nome do método por mudarTexto. Como uma imagem vale mais que mil palavras, abaixo, temos três imagens que vão fazer você compreender o que é para fazer.

E, dentro das chaves do método mudarTexto(), você deverá digitar:

label->setText(”Um novo texto!”);

O programa ainda não está pronto. Isso porque dissemos o que o método mudarTexto() fará. Falta, ainda, conectar o botão ao método, para que quando o botão (pushButton é o nome do botão) for clicado (clicked), o método mudarText() seja acionado. Para isso, descomente as linhas mostradas na figura abaixo, e substituindo as palavras para que fiquem dessa forma:

connect(pushButton,
SIGNAL(clicked()),
this,
SLOT(mudarTexto()));

E, por fim, salve o arquivo animado e pimpolho e compile o programa digitando make no terminal. Ao executar o programa, o previsto acontecerá: quando se clicar no botão, o texto do Label vai ser outro.

Por hoje, é só. Até a próxima!