lenn/qt6-qml-for-beginners
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add code

Browse Source
This commit is contained in:
lenn
2025-09-28 17:03:21 +08:00
parent 4856db17ee
commit 8eb80ab66d
11 changed files with 514 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
1DemoApp/CMakeLists.txt Normal file
View File

@@ -0,0 +1,42 @@
cmake_minimum_required(VERSION 3.16)
project(1DemoApp VERSION 0.1 LANGUAGES CXX)
set(CMAKE_CXX_STANDARD_REQUIRED ON)
find_package(Qt6 REQUIRED COMPONENTS Quick)
qt_standard_project_setup(REQUIRES 6.5)
qt_add_executable(app1DemoApp
main.cpp
)
qt_add_qml_module(app1DemoApp
URI 1DemoApp
VERSION 1.0
QML_FILES
Main.qml
)
# Qt for iOS sets MACOSX_BUNDLE_GUI_IDENTIFIER automatically since Qt 6.1.
# If you are developing for iOS or macOS you should consider setting an
# explicit, fixed bundle identifier manually though.
set_target_properties(app1DemoApp PROPERTIES
# MACOSX_BUNDLE_GUI_IDENTIFIER com.example.app1DemoApp
MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
MACOSX_BUNDLE TRUE
WIN32_EXECUTABLE TRUE
)
target_link_libraries(app1DemoApp
PRIVATE Qt6::Quick
)
include(GNUInstallDirs)
install(TARGETS app1DemoApp
BUNDLE DESTINATION .
LIBRARY DESTINATION ${CMAKE_INSTALL_LIBDIR}
RUNTIME DESTINATION ${CMAKE_INSTALL_BINDIR}
)

72
1DemoApp/Main.qml Normal file
View File

@@ -0,0 +1,72 @@
import QtQuick
Window {
id: rootId
width: 640
height: 480
visible: true
title: qsTr("Hello World")
property string textToShow: "hello"
// Text {
// text: "Hello World!"
// font.family: "Helvetica"
// font.pointSize: 24
// color: "red"
// anchors.centerIn: parent
// }
Row {
id: row1
anchors.centerIn: parent
spacing: 20
Rectangle {
id: redRectId
width: 100
height: 100
color: "red"
radius: 20
Text {
id: textId
anchors.centerIn: parent
text: rootId.textToShow
color: "white"
font.pointSize: 15
}
MouseArea {
anchors.fill: parent
onClicked: {
console.log(textId.text)
textToShow = "clicked"
}
}
}
Rectangle {
id: blueRectId
width: 100
height: 100
color: "blue"
radius: 20
}
Rectangle {
id: greenRectId
width: 100
height: 100
// radius:
color: "green"
radius: 20
}
Rectangle {
width: 100
height: 100
color: "dodgerblue"
radius: 100
MouseArea {
anchors.fill: parent
onClicked: {
console.log("Clicked on dodgerblue circle")
}
}
}
}
}

18
1DemoApp/main.cpp Normal file
View File

@@ -0,0 +1,18 @@
#include <QGuiApplication>
#include <QQmlApplicationEngine>
int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
QObject::connect(
&engine,
&QQmlApplicationEngine::objectCreationFailed,
&app,
[]() { QCoreApplication::exit(-1); },
Qt::QueuedConnection);
engine.loadFromModule("1DemoApp", "Main");
return app.exec();
}

42
2DemoApp/CMakeLists.txt Normal file
View File

@@ -0,0 +1,42 @@
cmake_minimum_required(VERSION 3.16)
project(2DemoApp VERSION 0.1 LANGUAGES CXX)
set(CMAKE_CXX_STANDARD_REQUIRED ON)
find_package(Qt6 REQUIRED COMPONENTS Quick)
qt_standard_project_setup(REQUIRES 6.5)
qt_add_executable(app2DemoApp
main.cpp
)
qt_add_qml_module(app2DemoApp
URI 2DemoApp
VERSION 1.0
QML_FILES
Main.qml
)
# Qt for iOS sets MACOSX_BUNDLE_GUI_IDENTIFIER automatically since Qt 6.1.
# If you are developing for iOS or macOS you should consider setting an
# explicit, fixed bundle identifier manually though.
set_target_properties(app2DemoApp PROPERTIES
# MACOSX_BUNDLE_GUI_IDENTIFIER com.example.app2DemoApp
MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
MACOSX_BUNDLE TRUE
WIN32_EXECUTABLE TRUE
)
target_link_libraries(app2DemoApp
PRIVATE Qt6::Quick
)
include(GNUInstallDirs)
install(TARGETS app2DemoApp
BUNDLE DESTINATION .
LIBRARY DESTINATION ${CMAKE_INSTALL_LIBDIR}
RUNTIME DESTINATION ${CMAKE_INSTALL_BINDIR}
)

123
2DemoApp/Main.qml Normal file
View File

@@ -0,0 +1,123 @@
import QtQuick
Window {
width: 640
height: 480
visible: true
title: qsTr("QML Datatypes Demo")
property string mString: "https://www.learnqt.guide"
property int mInt: 45
property bool isFemale: true
property double mDouble: 77.5
property url mUrl: "https://www.learnqt.guide"
property var aNumbre: 100
property var aBool: false
property var aString: "Hello world!"
property var anotherString: String("#FF008800")
property var aColor: Qt.rgba(0.2, 0.3, 0.4, 0.5)
property var aRect: Qt.rect(10, 10, 10, 10)
property var aPoint: Qt.point(10, 10)
property var aSize: Qt.size(10, 10)
property var aVector3d: Qt.vector3d(100, 100, 1000)
property var anArray: [1, 2, 3, "four", "five", (function(){return "six";})]
property var anObject: {"foo": 10, "bar": 20}
property var aFunction: (function() {return "one"})
property var aFont: Qt.font({family: "Consolas", pointSize: 30, bold: false})
property date mDate: "2018-07-19"
property var fonts: Qt.fontFamilies()
// Row {
// anchors.centerIn: parent
Rectangle {
id: yellowRectId
x: 300
width: 200
height: 100 + mInt
color: "yellow"
Text {
id: mTextId
font: aFont
anchors.centerIn: parent
text: mString
// font.bold: isFemale ? true : false
}
}
Rectangle {
anchors.left: yellowRectId.right
width: 200
height: width * 1.5
color: aColor
}
// }
Rectangle {
id: blueRectId
color: "blue"
width: 100
height: 100
anchors.bottom: parent.bottom
anchors.right: yellowRectId.left
// anchors.horizontalCenter: parent.horizontalCenter
MouseArea {
anchors.fill: parent
onClicked: {
// yellowRectId.height = yellowRectId.height + 10
yellowRectId.height = Qt.binding(function() {
return yellowRectId.width + 10
})
for (var i = 0; i < fonts.length; i++) {
console.log("["+i+"]:" + fonts[i])
}
console.log(Qt.md5("123456"))
console.log("Quitting the App")
Qt.quit()
}
}
}
Component.onCompleted: {
if (mString === mUrl)
{
console.log("They are the same")
}else{
console.log("They are NOT the same")
}
if (isFemale) {
console.log("You may wear a dress")
}
else {
console.log("You may wear a suit")
}
console.log("The value of mInt is :"+mInt)
for(var i = 0; i < anArray.length; i++) {
if (i===5) {
console.log(anArray[i]())
}
else {
console.log(anArray[i])
}
}
console.log("The date is: " + mDate)
}
}

18
2DemoApp/main.cpp Normal file
View File

@@ -0,0 +1,18 @@
#include <QGuiApplication>
#include <QQmlApplicationEngine>
int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
QObject::connect(
&engine,
&QQmlApplicationEngine::objectCreationFailed,
&app,
[]() { QCoreApplication::exit(-1); },
Qt::QueuedConnection);
engine.loadFromModule("2DemoApp", "Main");
return app.exec();
}

42
4DemoApp/CMakeLists.txt Normal file
View File

@@ -0,0 +1,42 @@
cmake_minimum_required(VERSION 3.16)
project(4DemoApp VERSION 0.1 LANGUAGES CXX)
set(CMAKE_CXX_STANDARD_REQUIRED ON)
find_package(Qt6 REQUIRED COMPONENTS Quick)
qt_standard_project_setup(REQUIRES 6.5)
qt_add_executable(app4DemoApp
main.cpp
)
qt_add_qml_module(app4DemoApp
URI 4DemoApp
VERSION 1.0
QML_FILES
Main.qml MButton.qml
)
# Qt for iOS sets MACOSX_BUNDLE_GUI_IDENTIFIER automatically since Qt 6.1.
# If you are developing for iOS or macOS you should consider setting an
# explicit, fixed bundle identifier manually though.
set_target_properties(app4DemoApp PROPERTIES
# MACOSX_BUNDLE_GUI_IDENTIFIER com.example.app4DemoApp
MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
MACOSX_BUNDLE TRUE
WIN32_EXECUTABLE TRUE
)
target_link_libraries(app4DemoApp
PRIVATE Qt6::Quick
)
include(GNUInstallDirs)
install(TARGETS app4DemoApp
BUNDLE DESTINATION .
LIBRARY DESTINATION ${CMAKE_INSTALL_LIBDIR}
RUNTIME DESTINATION ${CMAKE_INSTALL_BINDIR}
)

70
4DemoApp/MButton.qml Normal file
View File

@@ -0,0 +1,70 @@
import QtQuick
Item {
id: rootId
property alias buttonText: buttonTextId.text
width: containerRectId.width
height: containerRectId.height
signal buttonClicked
Rectangle {
id: containerRectId
signal greet(string message)
color: "red"
border {
color: "blue"
width: 3
}
width: buttonTextId.implicitWidth + 20
height: buttonTextId.implicitHeight + 20
Text {
id: buttonTextId
text: "MButton"
anchors.centerIn: parent
}
MouseArea {
id: mouseAreaId
anchors.fill: parent
hoverEnabled: true
// onClicked: {
// // console.log("Clicked on button" + buttonTextId.text)
// rootId.buttonClicked()
// }
// onClicked: function(mouse) {
// console.log(mouse.x)
// }
// onClicked: (mouse_param) => console.log(mouse_param.x)
// onEntered: {
// console.log("enter")
// }
}
onGreet: function(message) {
console.log("Greeting with message: " + message);
}
function respond_your_way(message) {
console.log("Responding our way;Greeting with message: " + message);
}
Connections {
target: mouseAreaId
function onClicked() {
// console.log("Hello")
containerRectId.greet("Hello Lenn")
}
function onDoubleClicked(mouse) {
console.log("DoubleClicked at: " + mouse.x)
}
}
Component.onCompleted: {
containerRectId.greet.connect(containerRectId.respond_your_way)
}
}
}

69
4DemoApp/Main.qml Normal file
View File

@@ -0,0 +1,69 @@
import QtQuick
Window {
width: 640
height: 480
visible: true
title: qsTr("Hello World")
// Item {
// id: containerItemId
// x: 50
// y: 50
// width: 600
// height: 300
// Rectangle {
// anchors.fill: parent
// color: "beige"
// // border.color: "black"
// // border.width: 10
// border {
// color: "black"
// width: 10
// }
// }
// Rectangle {
// x: 0
// y: 10
// width: 50
// height: 50
// color: "red"
// }
// Rectangle {
// x: 60
// y: 10
// width: 50
// height: 50
// color: "green"
// }
// Image {
// x: 150
// y:50
// width: 100
// height: 100
// // source: "qrc:/...."
// }
// }
MButton {
id: button1
buttonText: "Button1"
// color: "grey"
onButtonClicked: {
console.log("Clicked on button1")
}
}
MButton {
id: button2
anchors.top: button1.bottom
buttonText: "Button2"
// color: "yellow"
onButtonClicked: {
console.log("Clicked on button1")
}
}
}

18
4DemoApp/main.cpp Normal file
View File

@@ -0,0 +1,18 @@
#include <QGuiApplication>
#include <QQmlApplicationEngine>
int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
QObject::connect(
&engine,
&QQmlApplicationEngine::objectCreationFailed,
&app,
[]() { QCoreApplication::exit(-1); },
Qt::QueuedConnection);
engine.loadFromModule("4DemoApp", "Main");
return app.exec();
}

BIN
Qt6QMLForBeginners.pdf Normal file
View File

Binary file not shown.