二一个基本qml程序讲解

Application

QCoreApplication  （基础类 QtCore）：

QGuiApplication；（Qt Quick）

QApplication；（QWidget）

QQmlApplicationEngine；（qml context）

main.cpp

#include <QGuiApplication>

#include <QQmlApplicationEngine>

int main(int argc, char *argv[])

{

    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;

    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

    if (engine.rootObjects().isEmpty())

        return -1;

    return app.exec();

}

main.qml

import QtQuick 2.9

import QtQuick.Window 2.2

import QtQuick.Controls.Styles 1.4

import QtQuick.Controls 1.4

Window {

    visible: true

    width: 640

    height: 480

    title: qsTr("Hello World")

    Button{

    text:"Quit";

    style:ButtonStyle{

    background:Rectangle{

     implicitWidth: 70;

     implicitHeight: 25;

     border.width:control.activeFocus?2:1; //  控件获取到焦点 则2倍宽度显示

    }

    }

    onClicked: {

    console.log("button click");

    }

    }

}

启动流程：

1. QGuiApplication

2.QQmlApplicationEngine (QML Context)

3.load  main.qml

4.create window

5.load items

6.exec（）

qml 中

Window

ApplicationWindow

item