Basic project for creating component in QMl

Author: adesh777

AppStyle.qml

@@ -0,0 +1,14 @@
+pragma Singleton
+import QtQuick 2.15
+
+QtObject {
+    readonly property color background: "#232429"
+    readonly property color hoverColor: "#2a2d36"
+    readonly property color textBackground: "#2b2f3b"
+    readonly property color popupBackground: "#333742"
+    readonly property color appStyle: "#1d5ffe"
+    readonly property color labelColor: "#85889b"
+    readonly property color textColor: "#ffffff"
+    readonly property color borderColor: "#464a53"
+    readonly property color placeholderColor: "#757985"
+}

Component.pro

@@ -0,0 +1,21 @@
+QT += quick
+
+# You can make your code fail to compile if it uses deprecated APIs.
+# In order to do so, uncomment the following line.
+#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0
+
+SOURCES += \
+        main.cpp
+
+RESOURCES += qml.qrc
+
+# Additional import path used to resolve QML modules in Qt Creator's code model
+QML_IMPORT_PATH =
+
+# Additional import path used to resolve QML modules just for Qt Quick Designer
+QML_DESIGNER_IMPORT_PATH =
+
+# Default rules for deployment.
+qnx: target.path = /tmp/$${TARGET}/bin
+else: unix:!android: target.path = /opt/$${TARGET}/bin
+!isEmpty(target.path): INSTALLS += target

Component.pro.user

@@ -0,0 +1,52 @@
+pragma Singleton
+import QtQuick 2.9
+import QtQuick.Controls 2.5
+
+
+QtObject {
+    readonly property int       h1 : 32
+    readonly property int       h2 : 24
+    readonly property double    h3 : 18.72
+    readonly property int       h4 : 16
+    readonly property double    h5 : 13.28
+    readonly property double    h6 : 10.72
+
+    readonly property int content : 14
+
+    readonly property var getAwesomeBrand: fontAwesomeBrand
+    readonly property var getAwesomeRegular: fontAwesomeRegular
+    readonly property var getAwesomeLight: fontAwesomeLight
+    readonly property var getAwesomeSolid: fontAwesomeSolid
+    readonly property var getContentFont: contentFontMedium
+    readonly property var getContentFontBold: contentFontBold
+    readonly property var getContentFontMedium: contentFontMedium
+    readonly property var getContentFontLight: contentFontLight
+
+    readonly property var fontAwesomeBrand: FontLoader {
+        source: "qrc:/fonts/Font Awesome 5 Brands-Regular-400.otf"
+    }
+
+    readonly property var fontAwesomeRegular: FontLoader {
+        source: "qrc:/fonts/Font Awesome 5 Pro-Regular-400.otf"
+    }
+
+    readonly property var fontAwesomeLight: FontLoader {
+        source: "qrc:/fonts/Font Awesome 5 Pro-Light-300.otf"
+    }
+
+    readonly property var fontAwesomeSolid: FontLoader {
+        source: "qrc:/fonts/Font Awesome 5 Pro-Solid-900.otf"
+    }
+
+    readonly property var contentFontLight: FontLoader {
+        source: "qrc:/fonts/Nunito-Light.ttf"
+    }
+
+    readonly property var contentFontBold: FontLoader {
+        source: "qrc:/fonts/Nunito-Bold.ttf"
+    }
+
+    readonly property var contentFontMedium: FontLoader {
+        source: "qrc:/fonts/Nunito-Medium.ttf"
+    }
+}

FontStyle.qml

@@ -0,0 +1,26 @@
+#include <QGuiApplication>
+#include <QQmlApplicationEngine>
+
+
+int main(int argc, char *argv[])
+{
+#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)
+    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
+#endif
+    QGuiApplication app(argc, argv);
+
+    QQmlApplicationEngine engine;
+
+    qmlRegisterSingletonType(QStringLiteral("qrc:/AppStyle.qml"),"AppStyle",1,0,"AppStyle");
+    qmlRegisterSingletonType(QUrl(QStringLiteral("qrc:/FontSystem.qml")),"AppStyle",1,0,"FontStyle");
+
+    const QUrl url(QStringLiteral("qrc:/main.qml"));
+    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
+        &app, [url](QObject *obj, const QUrl &objUrl) {
+            if (!obj && url == objUrl)
+                QCoreApplication::exit(-1);
+        }, Qt::QueuedConnection);
+    engine.load(url);
+
+    return app.exec();
+}

Images/add.svg

@@ -0,0 +1,12 @@
+import QtQuick 2.15
+import QtQuick.Window 2.15
+import AppStyle 1.0
+import QtQuick.Controls 2.5
+import "./"
+Window {
+    width: 640
+    height: 480
+    visible: true
+    title: qsTr("Hello World")
+    color: AppStyle.background
+}

Images/airdrop.svg

@@ -0,0 +1,28 @@
+<RCC>
+    <qresource prefix="/">
+        <file>main.qml</file>
+        <file>fonts/Font Awesome 5 Brands-Regular-400.otf</file>
+        <file>fonts/Font Awesome 5 Free-Regular-400.otf</file>
+        <file>fonts/Font Awesome 5 Free-Solid-900.otf</file>
+        <file>fonts/Font Awesome 5 Pro-Light-300.otf</file>
+        <file>fonts/Font Awesome 5 Pro-Regular-400.otf</file>
+        <file>fonts/Font Awesome 5 Pro-Solid-900.otf</file>
+        <file>fonts/Nunito-Bold.ttf</file>
+        <file>fonts/Nunito-Light.ttf</file>
+        <file>fonts/Nunito-Medium.ttf</file>
+        <file>fonts/Nunito-Regular.ttf</file>
+        <file>Images/add.svg</file>
+        <file>Images/airdrop.svg</file>
+        <file>Images/airplane.svg</file>
+        <file>Images/archive-add.svg</file>
+        <file>Images/arrow-down.svg</file>
+        <file>Images/arrow-up.svg</file>
+        <file>Images/arrow.svg</file>
+        <file>Images/eye-off.svg</file>
+        <file>Images/eye-on.svg</file>
+        <file>Images/moon.svg</file>
+        <file>Images/sun.svg</file>
+        <file>Images/tick.svg</file>
+        <file>AppStyle.qml</file>
+    </qresource>
+</RCC>