Creating a theApp - ZoomTen/theApp GitHub Wiki

Mamma mia.

Setup

  • Clone the repo and reset everything as written in the README.
  • Rename theApp folder into something awesome, like theBlam or whatever. This will be your project name, and any instance of "theBlam" from now on should be replaced with your project name.
  • Rename theApp.pro to theBlam.pro.
  • Rename the app-barebones folder to app. Likewise, change up the app-barebones line in theApp.pro to say app instead.
  • Go in the app directory.
  • Rename app-barebones.pro to app.pro, then in that file, change theApp (line 4) to theBlam. Next change every other reference to theApp in the file to theBlam or theblam depending on the capitalization.
  • Change com.zumid in the file to com.anonymous (or com.<yournamehere>)
  • Rename the com.zumid.theApp.desktop file to com.anonymous.theBlam.desktop just like what you replaced in the previous step.
  • Open that file and replace all instances of theApp with theBlam.
  • In the icons folder rename theapp.svg to theblam.svg.
  • In mainWindow.ui change every instance of theApp with theBlam (or theblam depending on capitalization)
  • In resources.qrc change icons/theapp.svg to icons/theblam.svg
  • In main.cpp change every instance of theApp with theBlam and com.zumid.theApp to com.anonymous.theBlam.
  • In line 77 and 78 of main.cpp change the copyright holder string to your name and the year to the current year.
  • You might want to change line 88 of main.cpp to say something else. Basically where the config files will be stored: ~/.config/<SOMETHING>/theBlam

Build Check

  • Check if it builds using the commands described in the README
  • If it builds, congrats, you can start stuffing stuff in it. theBlam after a successful build

Making a Widget

  • Make a folder titled mypage or whatever.
  • In Qt Creator, it's piss easy to make the files, just right click any file and click Add New. Then select Qt Designer Form Class. Make a widget called MyPage, then set the folder to the folder you just made. Done!
  • Otherwise...

mypage/mypage.h

#ifndef MYPAGE_H
#define MYPAGE_H

#include <QWidget>

namespace Ui {
class MyPage;
}

class MyPage : public QWidget
{
    Q_OBJECT

public:
    MyPage(QWidget *parent = nullptr);
    ~MyPage();

private:
    Ui::MyPage *ui;
};

#endif

mypage/mypage.cpp

#include "mypage.h"
#include "ui_mypage.h"

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

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

mypage/mypage.ui you're gonna want to open this in Qt Designer

<ui version="4.0">
 <author/>
 <comment/>
 <exportmacro/>
 <class>MyPage</class>
 <widget class="QWidget" name="MyPage">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>400</width>
    <height>300</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>Form</string>
  </property>
 </widget>
 <pixmapfunction/>
 <connections/>
</ui>
  • And you're gonna want to add these file names to app.pro, to HEADERS, SOURCES, and FORMS, respectively:
SOURCES += \
    main.cpp \
    mainwindow.cpp \
    mypage/mypage.cpp

HEADERS += \
    mainwindow.h \
    mypage/mypage.h

FORMS += \
    mainWindow.ui \
    mypage/mypage.ui

  • Next, do anything you want with it.

  • To get the custom the-libs classes a-runnin', right click any widget and click Promoted Widgets. In New Promoted Class, set the base class name to QLabel and type in tTitleLabel in Promoted Class Name. Check global include and hit Add. Now you can make the Hello World thingy a tTitleLabel by right clicking, Promote to -> tTitleLabel. It won't show in Designer, but it will look bigger once you build and run the app.

  • Save and now edit mainWindow.ui in Designer.

  • Drop a Stacked Widget right in the middle. Right-click on stackedWidget on the Object Inspector, Page 1 of 2 -> Delete.

  • Right click on page2 and choose Promote to. With the base class set to QWidget, set the promoted class name to MyPage. The header file is mypage/mypage.h and make sure global include isn't checked. Click Add and then click Promote.

  • Right click on stackedWidget and click Promote to. The base class should be QStackedWidget. Type in tStackedWidget in the promoted class name and this time check global include. Add and promote.

  • Save and then build.

You should see this when you run the app, but not after resizing the gargantuan screen that Qt Designer gives you by default:

⚠️ **GitHub.com Fallback** ⚠️