iPhone UI using Qt Creator

In this post, you will learn how to make a simple iPhone UI view using Qt creator.

Steps:

  1. Open Qt Creator Click on File from the menu and click on New File or Project…(Ctrl +  N).
  2. From the left column select Application, from the middle column select Qt Widget Application.
  3. Click on Choose.
  4. Give a name to the project and set the path where you want to save this project files.
  5. Click Next,
  6. Default kits will be selected.
  7. Click next.
  8. Give the class name of your choice. I gave iPhoneUI.
  9. Select Baseclass as QMainWindow from the dropdown list.
  10. (Generate form box can be unchecked as we are not going to use it, we will be creating UI with code only).
  11. Click Next
  12. Click on Finish.

main.cpp doesn`t need to be modified.

Open iphoneui.h

and modify it as

#ifndef IPHONEUI_H
#define IPHONEUI_H

#include <QMainWindow>
#include<QKeyEvent>
#include<QEvent>
#include <QWidget>
#include <QLabel>
#include <QDebug>
#include<QPushButton>


namespace Ui {
class iPhoneUI;
}

class iPhoneUI : public QMainWindow
{
    Q_OBJECT

public:
    explicit iPhoneUI(QWidget *parent = nullptr);
    ~iPhoneUI();

    QWidget *wid_net;
    QLabel *flight_cir;
    QPushButton *flight_img;
    QLabel *net_cir;
    QPushButton *net_img;
    QLabel *wifi_cir;
    QPushButton *wifi_img;
    QLabel *bt_cir;
    QPushButton *bluetooth_img;
    QLabel *brand;
private slots:
    void handle_flightmode();
    void handle_net();
    void handle_bluetooth();
    void handle_wifi();
private:
    Ui::iPhoneUI *ui;
protected:
    bool eventFilter(QObject *,QEvent*);
};

#endif // IPHONEUI_H

Open iphoneui.cpp

and copy-paste below mentioned code.

Download Project files

Video

Thank you for reading.

Leave a Comment

Your email address will not be published. Required fields are marked *