您的位置：首頁(yè) > 關(guān)于我們 > 新聞動(dòng)態(tài)

大彩串口屏 - 智能家居彩燈應(yīng)用
發(fā)布人：大彩科技發(fā)布日期：2020-12-01

色盤取色演示視頻

一、適用范圍

本文檔適合大彩物聯(lián)型、M系列的串口屏產(chǎn)品使用。

二、開發(fā)環(huán)境版本

1. VisualTFT軟件版本：V3.0.1.1111及以上的版本。

版本查看：

1) 打開VisualTFT軟件啟動(dòng)頁(yè)面如圖2-1軟件版本，右上角會(huì)顯示的軟件版本號(hào)；

圖2-1軟件版本

2) 打開VisualTFT，在軟件右下角可以查看軟件版本圖2-2軟件版本，最新版本可登錄http://gc086.com/進(jìn)行下載。

圖2-2軟件版本

2. 串口屏硬件版本：物聯(lián)型固件 >= V3.0.731.0，M系列固件 >= V6.1.199.00。

版本查看：

1) 查看屏幕背面版本號(hào)貼紙；

2) VisualTFT與屏幕聯(lián)機(jī)成功后，右下角顯示的版本號(hào)。

三、概述

隨著社會(huì)的不斷發(fā)展，科技的不斷進(jìn)步，人們?cè)谝曈X方面，不滿足于一種光，對(duì)物體的周邊裝飾越來(lái)越看重。其中，彩燈、色溫?zé)舻膽?yīng)用更為之廣泛，在家庭、商場(chǎng)、櫥窗、舞廳、咖啡廳、公共廣場(chǎng)等場(chǎng)所的擺設(shè)、裝飾、廣告、環(huán)境凈化與美化。

本文介紹大彩串口屏在彩燈的應(yīng)用，實(shí)現(xiàn)對(duì)色盤取色，并發(fā)送通知到用戶主板。

四、參考資料

1. 《LUA 腳本API V1.4》可通過以下鏈接下載物聯(lián)型開發(fā)包獲取:

http:/gc086.com/index.php?s=/List/index/cid/19.html

2. 《LUA基礎(chǔ)學(xué)習(xí)》可通過以下鏈接下載物聯(lián)型開發(fā)包獲取:

http:/gc086.com/index.php?s=/List/index/cid/19.html

3. LUA腳本初學(xué)者可以通過下面鏈接進(jìn)行學(xué)習(xí)。

http://www.runoob.com/lua/lua-arrays.html

五、教程實(shí)現(xiàn)

本文主要將以下2點(diǎn)進(jìn)行說明：

1. 準(zhǔn)備工程素材；

2. 配置串口屏工程；

5.1 準(zhǔn)備工程素材

5.1.1 準(zhǔn)備工程素材

在實(shí)現(xiàn)例程前需要作以下3個(gè)準(zhǔn)備：

1. 硬件平臺(tái)；

2. 軟件平臺(tái)；

3. UI素材；

該例程使用大彩W系列4寸串口屏DC48480W040_1111_0T為驗(yàn)證開發(fā)平臺(tái)。如圖5-1所示；

圖5-1 W系列4寸串口屏

其他尺寸、M系列的串口屏均可借鑒此教程。

5.1.2 軟件平臺(tái)

使用大彩自主研發(fā)的上位機(jī)軟件VisualTFT配置工程，登錄http://gc086.com/下載。如圖5-2所示；

圖5-2下載軟件

5.2 配置串口屏工程

本文主要介紹以下2點(diǎn)：

1. 取色

2. MCU/服務(wù)器設(shè)置顏色

注意：屏幕為RGB565，16位色，若用戶設(shè)備是24位色，則傳輸過程需要轉(zhuǎn)化

5.2.1 取色

用戶在觸摸屏上選擇某一個(gè)顏色，并通過網(wǎng)絡(luò)（物聯(lián)網(wǎng)：WIFI、M系列：4G）發(fā)送至服務(wù)器或通過串口發(fā)送指令到客戶MCU。

注意：本文只示意通過串口發(fā)送至用戶MCU

1. 畫面配置

在畫面ID0中，添加一個(gè)按鈕控件（控件ID1）、一個(gè)圖標(biāo)控件（控件ID2）和1個(gè)文本控件（控件ID3），其中控件ID1為色盤，供用戶選色；控件ID2為選中效果，用戶點(diǎn)擊色盤后，控件ID移動(dòng)到當(dāng)前位置并顯示‘白色的圈’，表示當(dāng)前選中的顏色；控件ID3為顯示固件版本號(hào)。如圖5-3所示：

圖5-3 畫面配置

2. LUA腳本編輯

本例程中，用戶點(diǎn)擊色盤或拖動(dòng)，右上角有顯示預(yù)覽的效果，當(dāng)松開后，通過串口發(fā)送選中顏色值到用戶單片機(jī)。代碼如程序清單 1所示：

程序清單 1 取顏色值

核心API函數(shù)

1) on_draw(screen)

當(dāng)界面的顯示內(nèi)容需要更新時(shí)，系統(tǒng)自動(dòng)調(diào)用此函數(shù)，用戶在此函數(shù)中添加自定義的繪圖操作。用戶繪制的內(nèi)容疊加在畫面內(nèi)容之上。

screen：當(dāng)前觸發(fā)on_draw()API的畫面ID

注意：此函數(shù)為系統(tǒng)回調(diào)函數(shù)，用戶不要直接調(diào)用。

下面幾種情況會(huì)觸發(fā)此函數(shù)：

界面有動(dòng)畫播放、視頻播放、RTC時(shí)間顯示的動(dòng)態(tài)刷新；
用戶操作屏幕控件控件；
通過LUA腳本或串口指令更新控件；
通過執(zhí)行redraw；

總之，界面上有任何變化，都會(huì)觸發(fā)此回調(diào)函數(shù)。

2) redraw()

發(fā)送重繪請(qǐng)求，觸發(fā)on_draw的執(zhí)行。

3) set_pen_color(color)

設(shè)置畫筆的顏色，RGB565，用于指定線、矩形、圓等的顏色。

4) draw_image(image_id,frame_id,dstx,dsty,width,height,srcx,srcy)

繪制圖片

image_id圖片資源的ID
frame_id對(duì)應(yīng)圖標(biāo)，可以設(shè)置幀ID，其他圖片固定為0
dstx圖片顯示X坐標(biāo)
dsty圖片顯示Y坐標(biāo)
width圖片顯示寬度
height圖片顯示高度
srcx圖片裁剪X坐標(biāo)
srcy圖片裁剪Y坐標(biāo)

5) draw_circle(x,y,r,fill)

繪制圓形

x,y圓的中心坐標(biāo)
r圓的半徑
fill為0不填充，1填充

基本思路：當(dāng)用戶觸摸色盤區(qū)域時(shí)候，過濾合法坐標(biāo)、背景色（本例程為黑色）和距離圓心的距離，當(dāng)條件成立后，計(jì)算出‘選擇效果（白色圈）’的顯示位置，并提取相應(yīng)的顏色值。通過redraw（）申請(qǐng)繪圖，畫出選中效果以及選中的顏色，并通過串口發(fā)送選中的顏色到用戶MCU。

5.2.2 MCU/服務(wù)器設(shè)置顏色

當(dāng)用戶MCU主板或App（服務(wù)器）主動(dòng)更新彩燈的顏色值后，需要同步到屏幕的右上角顯示當(dāng)前顏色，并將‘白色選中圈’同步到對(duì)應(yīng)位置。

本文闡述兩個(gè)方案：

注意：本例程不處理本章節(jié)的功能

1. 屏幕遍歷顏色值

屏幕端，根據(jù)色盤的坐標(biāo)和顏色值，在LUA腳本中建立一個(gè)顏色-坐標(biāo)對(duì)照表，如創(chuàng)建一個(gè)local color_pointXY = {}的表，如下程序清單 2所示

程序清單 2 創(chuàng)建顏色-坐標(biāo)對(duì)照表

當(dāng)接收到MCU/App(服務(wù)器)的指令后，遍歷檢索color_pointXY表，獲取‘白色選中圈’的坐標(biāo)，如下程序清單 3所示

程序清單 3 檢索顏色值

特別說明：當(dāng)由屏幕檢索顏色值，得出坐標(biāo)的時(shí)候，屏幕遍歷過程會(huì)耗時(shí)，且和色盤的大小有關(guān)。如本例程中，色盤大小380*380，則遍歷次數(shù)最大可達(dá)到380*380。若MCU或App（服務(wù)器）可選的顏色是比較少的，可考慮屏幕遍歷處理。

2. 服務(wù)器/MCU遍歷

當(dāng)如后臺(tái)MCU或服務(wù)器檢索顏色值時(shí)，則將檢索出來(lái)的坐標(biāo)(x，y)+color顏色值通過串口/網(wǎng)絡(luò)通知給屏幕，屏幕根據(jù)（x，y）畫出‘白色選中圈’的位置，且顯示當(dāng)前的顏色值，大大提高屏幕的流暢性。

5.3 下載工程

在我司的上層軟件Visual TFT中集成了LUA程序的編譯器，可以實(shí)現(xiàn)在編譯工程的同時(shí)將LUA腳本程序一起編譯，并且將編譯后的圖片和程序集合在一個(gè)名為DCIOT.PKG的文件中。編譯后只需要把DCIOT.PKG文件拷貝到U盤中，插入串口屏并重新上電即可將圖片和程序下載到屏中。