chinese直男口爆体育生外卖, 99久久er热在这里只有精品99, 又色又爽又黄18禁美女裸身无遮挡, gogogo高清免费观看日本电视,私密按摩师高清版在线,人妻视频毛茸茸,91论坛 兴趣闲谈,欧美 亚洲 精品 8区,国产精品久久久久精品免费

0
  • 聊天消息
  • 系統(tǒng)消息
  • 評論與回復(fù)
登錄后你可以
  • 下載海量資料
  • 學(xué)習(xí)在線課程
  • 觀看技術(shù)視頻
  • 寫文章/發(fā)帖/加入社區(qū)
會員中心
創(chuàng)作中心

完善資料讓更多小伙伴認識你,還能領(lǐng)取20積分哦,立即完善>

3天內(nèi)不再提示

英創(chuàng)信息技術(shù)使用QML進行界面開發(fā)簡介

英創(chuàng)信息技術(shù) ? 來源:英創(chuàng)信息技術(shù) ? 作者:英創(chuàng)信息技術(shù) ? 2020-02-07 10:32 ? 次閱讀
加入交流群
微信小助手二維碼

掃碼添加小助手

加入工程師交流群

1、概述

ESM6802是英創(chuàng)公司推出的基于Freescale i.MX6DL雙核處理器(ARM Cortex-A9,主頻1GHz)的高性能工控主板,imx6dl內(nèi)部帶有硬件3D、2D圖像處理模塊,能夠?qū)D像界面繪制進行硬件加速,使得應(yīng)用程序顯示更加快速流暢。ESM6802支持Qt 5.8版本,支持使用QML進行界面開發(fā),而且能夠利用硬件圖像加速處理模塊優(yōu)化QML構(gòu)建的圖像界面的渲染。本文將會簡單介紹一下QML的基礎(chǔ)知識,給客戶提供一種新的界面的開發(fā)方案。

QML是Qt提供的一種描述性的腳本語言,類似于CSS(Cascading Style Sheets),可以在腳本里創(chuàng)建圖形對象,并且支持各種圖形特效,以及狀態(tài)機等,同時又能跟Qt寫的C++代碼進行方便的交互,使用起來非常方便。采用QML加插件的方式主要是為了將界面設(shè)計與程序邏輯解耦,一般的系統(tǒng)開發(fā)中界面設(shè)計的變動往往多于后臺邏輯,因此采用QML加插件的方式將界面設(shè)計與邏輯分離有利于開發(fā)人員的分工,加速產(chǎn)品迭代速度,降低后期維護成本。而且QML解釋性語言的特性使得其語法更加簡單,可以將界面設(shè)計部分交給專業(yè)的設(shè)計人員開發(fā),而不要求設(shè)計人員會c++等編程語言。Qt底層對QML做了優(yōu)化,將會優(yōu)先使用硬件圖形加速器進行界面的渲染,也針對觸摸屏應(yīng)用做了優(yōu)化,使用QML能夠更簡單快捷的搭建流暢、優(yōu)美的界面。QML也支持嵌入Javascript處理邏輯,但是底層邏輯處理使用Qt C++編寫插件,能夠更好的控制數(shù)據(jù)結(jié)構(gòu),數(shù)據(jù)處理也更加高效,Qt提供了多種方式將C++數(shù)據(jù)類型導(dǎo)入QML腳本中,更多詳細資料可以查看Qt官方的文檔,本文將簡單介紹一下QML語言的語法以展示QML相對于以往的Qt C++界面編程的區(qū)別,文中所有代碼均在ESM6802 Linux上運行測試過了,有需要的客戶可以向我們索取,QML文件是腳本文件,不需要編譯,可以使用/usr/bin/qt5/qmlscene程序直接打開QML腳本文件查看效果。

2、QML基礎(chǔ)介紹

QML將界面分解為一個一個小的元素,通過使用QML描述各元素的排列以及對特定事件的響應(yīng)來搭建一個動態(tài)的界面。QML中的元素是以層級的形式進行描述的,子元素繼承父元素的坐標(biāo)系統(tǒng),子元素的坐標(biāo)以父元素作為參考,父元素的左上角為子元素的坐標(biāo)原點,子元素中可以以parent關(guān)鍵字引用父元素。

在一個QML文件中,每個元素都可以設(shè)定唯一的id,在其他元素中可以引用id來更改此元素的屬性等。QML提供一系列內(nèi)置的元素類型供開發(fā)中快速搭建界面,包括最常用的Rectangle、Image、Text、MouseArea、Item等。元素都有自己內(nèi)置的屬性,比如之前介紹的id,以及用于指定坐標(biāo)的x、y,和width、height等,同時也支持使用property關(guān)鍵字自定義屬性。一個簡單的QML文件如下:

import QtQuick 2.0
Rectangle {
width: 100
height: 100
color: "red"
}

這個QML文件將會展示一個紅色的正方形,如下圖:

在上面的例子中為Rectangle增加radius屬性的設(shè)置就可以得到圓角長方形:

Rectangle {
width: 100
height: 100
color: "red"
radius: 10
}

使用Rectangle就可以構(gòu)建出消息展示框和按鈕等大部分的界面元素了,而Text類型可以用于在Rectangle中增加文字信息,Image可以加載圖片,MouseArea提供鼠標(biāo)/觸摸屏事件,組合使用這幾個元素就能夠快速的搭建基本的交互界面了。

當(dāng)然現(xiàn)實開發(fā)中由于需要展示的數(shù)據(jù)往往會以數(shù)組等更復(fù)雜形式進行管理,他們具有相同的屬性,需要展示的外形效果(背景、對事件的相應(yīng))是一樣的,而每個元素的需要展示的內(nèi)容不一樣,這時就可以使用Row、Column、ListView、GridView等更復(fù)雜的元素。這類元素的設(shè)計理念是將數(shù)據(jù)與展現(xiàn)效果分開,數(shù)據(jù)用model來存放,而展示效果用view來描述,model和view通過delegate聯(lián)系起來,一個簡單的ListView的用法示例如下:

Background {
width: 480
height: 80
ListView {
anchors.fill: parent
anchors.margins: 20
spacing: 4
clip: true
model: 100
orientation: ListView.Horizontal
delegate: numberDelegate
}
Component {
id: numberDelegate
GreenBox {
width: 40
height: 40
text: index
}
}

上面中的GreenBox是使用Rectangle元素和Text元素構(gòu)建的長方形,上面的代碼顯示效果如下:

QML也內(nèi)置了一些類型來描述顯示元素的轉(zhuǎn)變、動畫效果,例如PropertyAnimation、NumberAnimation、ColorAnimation、RotationAnimation以及State、Transition等,使用這些類型能夠快速實現(xiàn)界面的動畫效果,比如下面展示一個綠燈閃爍的界面的QML代碼:

import QtQuick 2.0
Rectangle {
id: backgroud
width: 100
height: 100
color: "grey"
Rectangle {
id: greenlight
width: 60
height: 60
x: 20
y: 20
color: "green"
radius: 30
Component.onCompleted: flick.start()
SequentialAnimation{
id: flick
ColorAnimation { target: greenlight; properties: "color"; to: "black"; duration: 1000 }
ColorAnimation { target: greenlight; properties: "color"; to: "green"; duration: 1000 }
ColorAnimation { target: greenlight; properties: "color"; to: "black"; duration: 1000 }
ColorAnimation { target: greenlight; properties: "color"; to: "green"; duration: 1000 }
ColorAnimation { target: greenlight; properties: "color"; to: "black"; duration: 1000 }
}
}
}

上面的代碼會使id為greenlight的圖形從綠色變?yōu)楹谏?,在由黑色變?yōu)榫G色,重復(fù)三次,模擬綠燈閃爍的效果。由于動畫效果不方便以圖片展示,客戶可以自行復(fù)制上面的代碼運行查看效果。

從上面的介紹可以看到,QML的語法非常簡單,整個文件的結(jié)構(gòu)很清楚,比起使用Qt C++開發(fā)界面的更加簡單快速,不需要管理各種不同的類(class),降低了編程難度,而且整個界面元素以長方形為基礎(chǔ)來搭建,非常適合觸摸屏設(shè)備。另外QML文件不需要編譯,可以直接運行,搭建的界面能夠快速的預(yù)覽然后進行優(yōu)化,也一定程度上加快了開發(fā)速度。當(dāng)然由于QML的設(shè)計理念,QML只是對界面顯示進行描述,雖然可以內(nèi)嵌JavaScript處理數(shù)據(jù),但是處理數(shù)據(jù)的效率不高,所以顯示所需數(shù)據(jù)的生成、管理還是建議使用Qt C++進行處理。這樣底層數(shù)據(jù)能夠高效的進行處理,而上層界面又能夠快速搭建,數(shù)據(jù)處理和界面構(gòu)建分離,程序開發(fā)分工也更加明確,也更加方便程序的維護和更新?lián)Q代。

3、使用C++擴展QML

Qt提供了C++的函數(shù)接口來方便的將C++程序中的數(shù)據(jù)提供給QML文件進行顯示,這些接口可以分為兩種,一種是直接在C++中注冊QML類型,然后在C++中執(zhí)行QML文件,這樣QML文件中就可以直接訪問注冊的類型;另一種是創(chuàng)建QML插件,之后可以在QML文件中引入插件,作為獨立的類型進行實例化。限于篇幅,我們這里只簡單介紹一下創(chuàng)建QML插件,QML文件代碼基于我們之前一片文章《Linux雙進程應(yīng)用示例》中介紹的,插件的功能我們不再具體介紹,只在此使用代碼進行展示。

使用qtcreator的指導(dǎo)界面創(chuàng)建QML插件,設(shè)置插件名稱為com.emtronix.qmlcomponents,在QML中通過語句import com.emtronix.qmlcomponents加載插件,插件編譯過后以共享庫的形式存在,需要放到/usr/lib/qt5/qml/com/emtronix/目錄下:

插件使用Qt C++進行開發(fā),實現(xiàn)插件的C++類需要繼承QQmlExtensionPlugin類,并且實現(xiàn)registerTypes()函數(shù),如下:

#include
class MsgClientPlugin : public QQmlExtensionPlugin
{
Q_OBJECT
Q_PLUGIN_METADATA(IID QQmlExtensionInterface_iid)
public:
void registerTypes(const char *uri);
};
void MsgClientPlugin::registerTypes(const char *uri)
{
// @uri com.emtronix.qmlcomponents
qmlRegisterType(uri, 1, 0, "MsgClient");
}

上面的代碼qtcreator會自動生成,MsgClient類即為這個插件注冊的新的QML類型,之后在QML文件中使用import語句加載插件,就可以在QML文件中實例化MsgClient類型了。

import com.emtronix.qmlcomponents 1.0
MsgClient{
id: msgclient
}

實現(xiàn)MsgClient類與Qt中其他的類類似,只要注意需要在QML中能訪問的變量需要用Q_PROPERTY宏定義為MsgClient的屬性,而需要在QML文件中訪問的函數(shù)需要用Q_INVOKABLE進行修飾,如下:

class MsgClient : public QQuickItem
{
Q_OBJECT
Q_DISABLE_COPY(MsgClient)
Q_PROPERTY(int m_interface READ interface WRITE setif NOTIFY ifChanged)
Q_PROPERTY(QString rmsg READ rmsg WRITE setRmsg NOTIFY rmsgChanged)
Q_PROPERTY(QString smsg READ smsg WRITE setSmsg NOTIFY smsgChanged)
Q_PROPERTY(int serverConnection READ serverConnection NOTIFY serverConnected())
Q_PROPERTY(DynamicEntryModel* pinstate READ pinstate WRITE setPinState NOTIFY pinStateChanged)
Q_PROPERTY(DynamicEntryModel* outSwitch READ outSwitch WRITE setOutSwitch NOTIFY outSwitchChanged)
public:
MsgClient(QQuickItem *parent = nullptr);
~MsgClient();
Q_INVOKABLE void getAll();
Q_INVOKABLE void getNew();

使用slots定義的函數(shù)也可以在QML中直接訪問,而使用signals定義的消息也可以在QML文件中訪問:

public slots:
void sendMsg();
void setPinState(DynamicEntryModel* obj) { Q_UNUSED(obj) };
void setOutSwitch(DynamicEntryModel* obj) { Q_UNUSED(obj) };
……….
signals:
void ifChanged(int id);
void newMsgRcved(void);
void rmsgChanged(void);
void smsgChanged(void);
void sendMsgSignal(void);
void serverConnected(void);

這些函數(shù)以及變量都是正常的C++函數(shù)和變量,使用C++來實現(xiàn)函數(shù)需要實現(xiàn)的功能以及操作變量,例如sendMsg實現(xiàn)如下:

void MsgClient::sendMsg()
{
struct msg_head buf_h;
sprintf((char *)&buf_h.to[0], "S1");
int buf_lenth = m_smsg.size();
buf_h.lenth = buf_lenth;
printf("Client sending msg: %d bytes\n", buf_lenth);
write(sockedfd, (void *)&buf_h.to[0], 6);
write(sockedfd, (void *)m_smsg.data(), buf_lenth);
return;
}

signals信號的訪問需要做一定的轉(zhuǎn)換,例如上面的ifChanged消息,在QML中需要使用onIfChanged來訪問,即將函數(shù)首字母大寫,然后在前面加上‘on’。

MsgClient類型在QML中的實際調(diào)用如下:

MsgClient{
id: msgclient
m_interface: interfaceId.currentButton
onNewMsgRcved:{
getNew()
console.log("got new msg" + rmsg)
}
onIfChanged: {
console.log("interface changed to " + msgclient.m_interface)
getAll()
console.log("all history msg:" + rmsg)
}
onServerConnected: {
notReady.destroy()
}
}

可以見到MsgClient類型的使用和QML內(nèi)置的類型使用沒有什么區(qū)別,而插件中定義的signals消息以及其他可調(diào)用的函數(shù)方法也可以在QML中直接訪問,MsgClient本身并不會產(chǎn)生顯示輸出,只是處理數(shù)據(jù)然后提供給QML其他的類型進行顯示。我們使用QML搭建了整個顯示界面,顯示效果如下:

有興趣的客戶可以向我們索要例程的源碼文件。

4、總結(jié)

ESM6802帶有GPU硬件加速模塊,能夠加速Q(mào)ML的渲染,而且QML語法簡單,使用QML進行程序開發(fā)能夠快速的構(gòu)建流暢的交互式界面,同時使用QML開發(fā)使得界面開發(fā)與程序數(shù)據(jù)處理、硬件管理分開,明確程序開發(fā)的分工,降低程序維護成本。對于工業(yè)控制系統(tǒng)來說,將界面與底層硬件管理分開,一定程度上增加了底層硬件管理部分的程序的穩(wěn)定性,而界面又可以實現(xiàn)快速的迭代,適應(yīng)市場的需求,用戶在使用過程中可以考慮使用這種方式進行程序開發(fā)。有興趣的客戶可以參考更多的網(wǎng)上資料以及Qt的官方文檔。在ESM6802的使用過程中如有問題可以和我們聯(lián)系。

聲明:本文內(nèi)容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權(quán)轉(zhuǎn)載。文章觀點僅代表作者本人,不代表電子發(fā)燒友網(wǎng)立場。文章及其配圖僅供工程師學(xué)習(xí)之用,如有內(nèi)容侵權(quán)或者其他違規(guī)問題,請聯(lián)系本站處理。 舉報投訴
  • Linux
    +關(guān)注

    關(guān)注

    88

    文章

    11576

    瀏覽量

    216690
  • 嵌入式主板
    +關(guān)注

    關(guān)注

    7

    文章

    6107

    瀏覽量

    36773
收藏 人收藏
加入交流群
微信小助手二維碼

掃碼添加小助手

加入工程師交流群

    評論

    相關(guān)推薦
    熱點推薦

    軟通動力入選2025新一代信息技術(shù)應(yīng)用優(yōu)秀案例

    近日,DBC德本咨詢正式發(fā)布“2025新一代信息技術(shù)應(yīng)用優(yōu)秀案例”榜單,軟通動力信息技術(shù)(集團)股份有限公司攜手廣西星網(wǎng)智云科技有限公司,為廣西玉柴機器集團有限公司打造的“玉柴數(shù)智化審計業(yè)務(wù)場景項目”成功入選,位列榜單第二名,充分彰顯了軟通動力在企業(yè)數(shù)智化轉(zhuǎn)型領(lǐng)域的深厚
    的頭像 發(fā)表于 09-28 17:48 ?955次閱讀

    易華錄入選國家級信息技術(shù)應(yīng)用創(chuàng)新典型解決方案

    近日,工業(yè)和信息化部網(wǎng)絡(luò)安全產(chǎn)業(yè)發(fā)展中心(工業(yè)和信息化部信息中心)公布了“2024年信息技術(shù)應(yīng)用創(chuàng)新解決方案”評選結(jié)果。易華錄申報的“基于節(jié)能高效藍光的超級智能存儲解決方案”憑借顯著的
    的頭像 發(fā)表于 08-07 15:35 ?1076次閱讀

    信息技術(shù)應(yīng)用產(chǎn)學(xué)協(xié)同人才培養(yǎng)行動計劃”正式發(fā)布,誠邁科技入選首批參與單位

    設(shè)在中國軟件評測中心。誠邁科技作為信創(chuàng)技術(shù)先鋒企業(yè),受邀成為首批參與單位,與國內(nèi)頂尖高校、領(lǐng)軍企業(yè)和權(quán)威機構(gòu)攜手,共同打造具有中國特色的信息技術(shù)人才培養(yǎng)新范式,為
    的頭像 發(fā)表于 08-06 17:29 ?1151次閱讀
    “<b class='flag-5'>信息技術(shù)</b>應(yīng)用產(chǎn)學(xué)協(xié)同人才培養(yǎng)行動計劃”正式發(fā)布,誠邁科技入選首批參與單位

    佛瑞亞如何通過信息技術(shù)推動業(yè)務(wù)增長

    在數(shù)字化、信息化的浪潮下,信息技術(shù)已經(jīng)不僅是后臺工具,更成為驅(qū)動企業(yè)發(fā)展的關(guān)鍵力量。本期Women Inspiring Mobility,我們采訪了佛瑞亞中國區(qū)信息技術(shù)總監(jiān)馬瑛,了解她和團隊如何將
    的頭像 發(fā)表于 07-29 14:00 ?585次閱讀

    飛騰主板為信創(chuàng)產(chǎn)業(yè)發(fā)展提高硬實力

    信息技術(shù)飛速發(fā)展的當(dāng)下,信創(chuàng)產(chǎn)業(yè)已成為我國實現(xiàn)科技自立自強、保障國家信息安全的關(guān)鍵領(lǐng)域。信創(chuàng),即信息技術(shù)應(yīng)用創(chuàng)新,其核心目標(biāo)是實現(xiàn)
    的頭像 發(fā)表于 07-22 18:20 ?435次閱讀

    DEKRA德凱成為沙特通信和信息技術(shù)設(shè)備技術(shù)法規(guī)認證機構(gòu)

    近日,DEKRA德凱成功獲得沙特標(biāo)準、計量和質(zhì)量組織(SASO)認可,正式成為沙特通信和信息技術(shù)設(shè)備技術(shù)法規(guī)(Technical Regulation for Communications
    的頭像 發(fā)表于 07-15 14:27 ?573次閱讀

    科普|信創(chuàng)是什么?一文讀懂“信息技術(shù)應(yīng)用創(chuàng)新”戰(zhàn)略

    什么是信創(chuàng)?信創(chuàng),即“信息技術(shù)應(yīng)用創(chuàng)新”,是國家推動IT系統(tǒng)自主可控、安全可控的重要戰(zhàn)略工程。它不僅是技術(shù)層面的創(chuàng)新,更承載著保障國家網(wǎng)絡(luò)安全、推動產(chǎn)業(yè)升級和實現(xiàn)數(shù)字主權(quán)的重任。簡單來
    的頭像 發(fā)表于 06-13 10:06 ?5044次閱讀
    科普|信<b class='flag-5'>創(chuàng)</b>是什么?一文讀懂“<b class='flag-5'>信息技術(shù)</b>應(yīng)用創(chuàng)新”戰(zhàn)略

    2025第二屆教育信息技術(shù)應(yīng)用創(chuàng)新大賽正式開賽

    為進一步落實建設(shè)網(wǎng)絡(luò)強國和教育強國的戰(zhàn)略部署,推動各級教育行政部門及高校信息技術(shù)應(yīng)用創(chuàng)新能力提升,培養(yǎng)實戰(zhàn)型創(chuàng)新人才。龍芯中科聯(lián)合太初元碁、誠邁科技在2025第二屆教育信息技術(shù)應(yīng)用創(chuàng)新大賽共同發(fā)布信息技術(shù)應(yīng)用創(chuàng)新人工智能方向(賽
    的頭像 發(fā)表于 05-13 16:21 ?1091次閱讀

    龍芯中科榮獲2024年度信息技術(shù)應(yīng)用創(chuàng)新工作委員會卓越貢獻成員單位

    近日,中國電子工業(yè)標(biāo)準化技術(shù)協(xié)會信息技術(shù)應(yīng)用創(chuàng)新工作委員會(以下簡稱“信創(chuàng)工委會”)在北京召開2024年度工作總結(jié)座談會暨信創(chuàng)“大比武”總結(jié)大會。中國工程院院士、信
    的頭像 發(fā)表于 01-23 10:50 ?874次閱讀

    芯盛智能榮獲2024年信息技術(shù)應(yīng)用創(chuàng)新工作委員會卓越貢獻成員單位

    日前,中國電子工業(yè)標(biāo)準化技術(shù)協(xié)會信息技術(shù)應(yīng)用創(chuàng)新工作委員會(以下簡稱 “信創(chuàng)工委會”)2024 年度總結(jié)座談會于北京隆重舉行。此次會議對在信創(chuàng)工作中作出突出貢獻的成員單位予以表彰。江蘇
    的頭像 發(fā)表于 01-20 09:56 ?833次閱讀

    飛騰助力首屆教育信息技術(shù)應(yīng)用創(chuàng)新大賽圓滿落幕

    近日,由中國教育技術(shù)協(xié)會主辦,教育部教育管理信息中心教育信創(chuàng)實驗室、公安部第三研究所、中國電子工業(yè)標(biāo)準化技術(shù)協(xié)會信創(chuàng)工委會支持,北京航空航天
    的頭像 發(fā)表于 12-24 09:57 ?674次閱讀

    有方科技參編的信息技術(shù)團體標(biāo)準發(fā)布

    近日,有方科技參編的《信息技術(shù)產(chǎn)品供應(yīng)鏈成熟度 共性指標(biāo) 第1部分:企業(yè)背景評價》《信息技術(shù)產(chǎn)品供應(yīng)鏈成熟度 共性指標(biāo) 第2部分:技術(shù)掌控評價》《信息技術(shù)產(chǎn)品供應(yīng)鏈成熟度 共性指標(biāo) 第
    的頭像 發(fā)表于 12-23 10:44 ?795次閱讀

    龍芯中科助力2024首屆教育信息技術(shù)應(yīng)用創(chuàng)新大賽成功舉辦

    近日,2024首屆教育信息技術(shù)應(yīng)用創(chuàng)新大賽在北京航空航天大學(xué)成功舉辦。本次大賽由中國教育技術(shù)協(xié)會主辦,教育信創(chuàng)實驗室、公安部第三研究所、中國電子工業(yè)標(biāo)準化技術(shù)協(xié)會信
    的頭像 發(fā)表于 12-19 17:02 ?715次閱讀

    拓維信息參與牽頭組建!長沙新一代信息技術(shù)產(chǎn)教聯(lián)合體正式獲批

    的長沙新一代信息技術(shù)產(chǎn)教聯(lián)合體成功獲批,為長沙市信息技術(shù)產(chǎn)業(yè)發(fā)展注入了新的活力。圖/《2024年長沙市市級市域產(chǎn)教聯(lián)合體名單》長沙新一代信息技術(shù)產(chǎn)教聯(lián)合體將依托龍頭企
    的頭像 發(fā)表于 12-07 01:06 ?1120次閱讀
    拓維<b class='flag-5'>信息</b>參與牽頭組建!長沙新一代<b class='flag-5'>信息技術(shù)</b>產(chǎn)教聯(lián)合體正式獲批

    中科創(chuàng)達榮獲2024年軟件和信息技術(shù)服務(wù)優(yōu)秀企業(yè)

    及前百家企業(yè)”名單。中科創(chuàng)達憑借非凡的技術(shù)實力與持續(xù)的創(chuàng)新能力,成功入選“2024年度軟件和信息技術(shù)服務(wù)競爭力百強企業(yè)”以及“2024年軟件和信息技術(shù)服務(wù)優(yōu)秀企業(yè)”。
    的頭像 發(fā)表于 10-30 11:44 ?1256次閱讀