Add QmlCanvasText

Author: zhengtianzuo

QmlCanvasText/QmlCanvasText.pro

@@ -0,0 +1,13 @@
+#-------------------------------------------------
+#
+# Copyright (C) 2003-2103 CamelSoft Corporation
+#
+#-------------------------------------------------
+
+QT += qml quick
+
+CONFIG += c++11
+
+SOURCES += main.cpp
+
+RESOURCES += qml.qrc

QmlCanvasText/main.cpp

@@ -0,0 +1,20 @@
+/*!
+ *@file main.cpp
+ *@brief 程序主文件
+ *@version 1.0
+ *@section LICENSE Copyright (C) 2003-2103 CamelSoft Corporation
+ *@author zhengtianzuo
+*/
+#include <QGuiApplication>
+#include <QQmlApplicationEngine>
+
+int main(int argc, char *argv[])
+{
+    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
+    QGuiApplication app(argc, argv);
+
+    QQmlApplicationEngine engine;
+    engine.load(QUrl(QLatin1String("qrc:/main.qml")));
+
+    return app.exec();
+}

QmlCanvasText/main.qml

@@ -0,0 +1,70 @@
+/*!
+ *@file main.qml
+ *@brief 主文件
+ *@version 1.0
+ *@section LICENSE Copyright (C) 2003-2103 CamelSoft Corporation
+ *@author zhengtianzuo
+*/
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+import QtQuick.Layouts 1.0
+
+ApplicationWindow {
+    visible: true
+    width: 400
+    height: 300
+    title: qsTr("QmlCanvas文字")
+
+    Canvas{
+        id: canvas
+        width: 300
+        height: 100
+        onPaint: {
+            var ctx = getContext("2d");
+            ctx.fillStyle = "red";
+            ctx.font = fontMetrics.getFontToContext2D();
+
+            ctx.beginPath();
+            ctx.text(qsTr("Canvas 这是一段文字"), 20, 40);
+            ctx.fill();
+        }
+    }
+
+    Text{
+        id: text
+        anchors.left: parent.left
+        anchors.leftMargin: 20
+        anchors.top: parent.top
+        anchors.topMargin: 60
+        font: fontMetrics.font
+        color: "red"
+        text: qsTr("Text 这是一段文字")
+    }
+
+    FontMetrics {
+        id: fontMetrics
+        font.family: "Arial"
+        font.pixelSize: 16
+        font.italic: false
+        font.bold: false
+
+        function getFontToContext2D() {
+            var cssFontString = "";
+            if(fontMetrics.font.italic) {
+                cssFontString += "italic ";
+            } else {
+                cssFontString += "normal ";
+            }
+
+            if(fontMetrics.font.bold) {
+                cssFontString += "bold ";
+            } else {
+                cssFontString += "normal ";
+            }
+
+            cssFontString += (fontMetrics.font.pixelSize+"px ");
+            cssFontString += fontMetrics.font.family;
+            return cssFontString;
+        }
+    }
+}

QmlCanvasText/qml.qrc

@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>main.qml</file>
+    </qresource>
+</RCC>

QmlCanvasText/show.jpg

@@ -32,4 +32,5 @@ SUBDIRS += QmlFlipImage
 SUBDIRS += QmlGrayImage
 SUBDIRS += QmlProgress
 SUBDIRS += QmlWinExtras
-SUBDIRS += QmlCalendar
+SUBDIRS += QmlCalendar
+SUBDIRS += QmlCanvasText

QtQuickExamples.pro

@@ -147,3 +147,8 @@ QmlCalendar:Qml日历
 
 ![](https://github.com/zhengtianzuo/QtQuickExamples/blob/master/QmlCalendar/show.gif?raw=true)
 
+
+QmlCanvasText: QmlCanvas文字
+
+![](https://github.com/zhengtianzuo/QtQuickExamples/blob/master/QmlCanvasText/show.jpg?raw=true)
+