Inserindo imagem com a ferramenta design

Nesse tutorial veremos como colocar uma imagem utilizando a ferramenta de design do qt creator e também utilizando código.

No seu projeto vá até a pasta “Forms” e clique no arquivo do tipo .ui, assim vai abrir a ferramenta design.

Nela, na barra de componentes, vá até a seção de “Display Widgets”, selecione “Label” e insira na sua janela:

Em seguida, nas propriedades role a barra até a parte de QLabel e selecione pixmap, clique na seta e depois em “Choose File” (escolha um arquivo) e selecione a imagem que quer inserir

Para redimensionar a imagem de acordo com o tamanho da label deixa selecionado “scaledContents” que fica abaixo de pixmap na seção QLabel, logo após é só dimensionar a imagem como você quiser.

Inserindo imagem com código

Agora, para inserir uma imagem utilizando código, primeiro precisa adicionar uma label. Como no tutorial de inserir a imagem pela ferramenta design, vá até a pasta “Forms” e clique no arquivo do tipo “.ui”, assim abrindo a ferramenta design.

Nela, na barra de componentes, vá até a seção de “Display Widgets”, selecione “Label” e insira na sua janela:

Redimensione o tamanho da label para ficar próximo ao tamanho da imagem que você deseja colocar. Logo após, altere o arquivo mainwindow.cpp dessa forma:

mainwindow.cpp

                #include "mainwindow.h"
#include "./ui_mainwindow.h"
#include <QPixmap>

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

    QPixmap tutorialLogo("C:/Users/isabe/OneDrive/Documentos/PI/PI_logo_V2.png");
    ui->label->setPixmap(tutorialLogo.scaled(500,500,Qt::KeepAspectRatio));
}

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

Efetuamos o include da biblioteca “QPixmap” que (como pode ser visto na parte que inserimos a imagem com a ferramenta design) utilizamos para inserir a imagem.

#include <QPixmap>

Então criamos um elemento“QPixmap” com o nome “tutorialLogo” (você pode escolher o nome que desejar) e atribuimos o endereço que a imagem se encontra junto com o nome dela

QPixmap tutorialLogo("C:/Users/isabe/OneDrive/Documentos/PI/PI_logo_V2.png");

Agora, para colocarmos a imagem na label que adicionamos, vamos chamar ela e utilizar o “setPixmap” para alterar a propriedade pixmap passando o nome do elemento QPixmap que criamos. Para ajustarmos o tamanho da imagem de acordo com a label colocamos “.scaled” após o nome do elemento, e então passamos a largura e altura que desejamos. Se não quiser que a sua imagem fique desproporcional adicione o “Qt::KeepAspectRatio”, ele mantém a proporção da imagem.

ui->label->setPixmap(tutorialLogo.scaled(500,500,Qt::KeepAspectRatio));

E então esse será o resultado: