quickjs調(diào)用lvgl函數(shù)的示例代碼
更新時(shí)間：2023年11月29日 09:59:28 作者：無(wú)腦仔的小明
這篇文章主要介紹了quickjs調(diào)用lvgl函數(shù),實(shí)現(xiàn)本次使用quickjs的最主要目的，就是通過(guò)程序動(dòng)態(tài)加載js，然后調(diào)用lvgl函數(shù)庫(kù)，實(shí)現(xiàn)渲染，需要的朋友可以參考下
實(shí)現(xiàn)本次使用quickjs的最主要目的，就是通過(guò)程序動(dòng)態(tài)加載js，然后調(diào)用lvgl函數(shù)庫(kù)，實(shí)現(xiàn)渲染。以達(dá)到類(lèi)似小程序的效果。后續(xù)還會(huì)實(shí)現(xiàn)類(lèi)似小程序效果，通過(guò)quickjs解析xml(html)，編譯成js然后調(diào)用lvgl庫(kù)，實(shí)現(xiàn)界面渲染。通過(guò)quickjs會(huì)調(diào)用c語(yǔ)言提供的底層功能，如wifi、藍(lán)牙、串口uart、iic、isp、pwd、led等等硬件io功能。
下面寫(xiě)一些例子，只做技術(shù)驗(yàn)證
lvgl_export.h
#include <string.h> #include <stdlib.h> #include "quickjs-libc.h" #include "cutils.h" #include "lvgl.h" #define lv_obj_ptr_t uintptr_t extern JSModuleDef *js_init_module_lvgl(JSContext *ctx, const char *module_name); int JS_ToInt8(JSContext *ctx, int8_t *pres, JSValueConst val); int JS_ToUint8(JSContext *ctx, uint8_t *pres, JSValueConst val); int JS_ToInt16(JSContext *ctx, int16_t *pres, JSValueConst val); int JS_ToUint16(JSContext *ctx, uint16_t *pres, JSValueConst val); int JS_ToPointer(JSContext *ctx, lv_obj_ptr_t *pres, JSValueConst val); static inline JSValue JS_NewPointer(JSContext *ctx, lv_obj_ptr_t val);
lvgl_export.c
#include "lvgl_export.h"
static JSValue lvgl_obj_create(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * parent = (lv_obj_t *)p;
lv_obj_t * obj = lv_obj_create(parent);
return JS_NewPointer(ctx, (lv_obj_ptr_t)obj);
}
static JSValue lvgl_label_create(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * parent = (lv_obj_t *)p;
lv_obj_t * lbl = lv_label_create(parent);
return JS_NewPointer(ctx, (lv_obj_ptr_t)lbl);
}
static JSValue lvgl_label_set_text(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * lbl = (lv_obj_t *)p;
const char * str = JS_ToCString(ctx, argv[1]);
lv_label_set_text(lbl, str);
return JS_NULL;
}
static JSValue lvgl_scr_load(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * lbl = (lv_obj_t *)p;
lv_scr_load(lbl);
return JS_NULL;
}
static JSValue lvgl_obj_set_pos(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 3) {
lv_coord_t x = 0;
JS_ToInt16(ctx, &x, argv[1]);
lv_coord_t y = 0;
JS_ToInt16(ctx, &y, argv[2]);
lv_obj_set_pos(obj, x, y);
}
}
static JSValue lvgl_obj_set_size(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 3) {
lv_coord_t w = 0;
JS_ToInt16(ctx, &w, argv[1]);
lv_coord_t h = 0;
JS_ToInt16(ctx, &h, argv[2]);
lv_obj_set_size(obj, w, h);
}
}
static JSValue lvgl_obj_set_style_bg_color(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 2) {
uint32_t color = 0;
JS_ToUint32(ctx, &color, argv[1]);
lv_color_t c = lv_color_hex(color);
lv_obj_set_style_bg_color(obj, c, LV_PART_MAIN|LV_STATE_DEFAULT);
}else if(argc == 3){
uint32_t color = 0;
JS_ToUint32(ctx, &color, argv[1]);
lv_color_t c = lv_color_hex(color);
uint32_t mark = 0;
JS_ToUint32(ctx, &mark, argv[2]);
lv_obj_set_style_bg_color(obj, c, mark);
}
}
static JSValue lvgl_obj_set_style_bg_opa(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 2) {
uint8_t opa = 0;
JS_ToUint8(ctx, &opa, argv[1]);
lv_obj_set_style_bg_opa(obj, opa, LV_PART_MAIN|LV_STATE_DEFAULT);
}else if(argc == 3){
uint8_t opa = 0;
JS_ToUint8(ctx, &opa, argv[1]);
uint32_t mark = 0;
JS_ToUint32(ctx, &mark, argv[2]);
lv_obj_set_style_bg_opa(obj, opa, mark);
}
}
static const JSCFunctionListEntry js_lvgl_funcs[] = {
JS_PROP_STRING_DEF("test", "test..", JS_PROP_C_W_E),
JS_CFUNC_DEF("lvgl_obj_create", 1, lvgl_obj_create),
JS_CFUNC_DEF("lvgl_label_create", 1, lvgl_label_create),
JS_CFUNC_DEF("lvgl_label_set_text", 2, lvgl_label_set_text),
JS_CFUNC_DEF("lvgl_obj_set_pos", 3, lvgl_obj_set_pos),
JS_CFUNC_DEF("lvgl_obj_set_size", 3, lvgl_obj_set_size),
JS_CFUNC_DEF("lvgl_obj_set_style_bg_color", 3, lvgl_obj_set_style_bg_color),
JS_CFUNC_DEF("lvgl_obj_set_style_bg_opa", 3, lvgl_obj_set_style_bg_opa),
JS_CFUNC_DEF("lvgl_scr_load", 1, lvgl_scr_load),
};
static int js_lvgl_init(JSContext *ctx, JSModuleDef *m)
{
return JS_SetModuleExportList(ctx, m, js_lvgl_funcs,
countof(js_lvgl_funcs));
}
JSModuleDef *js_init_module_lvgl(JSContext *ctx, const char *module_name)
{
JSModuleDef *m;
m = JS_NewCModule(ctx, module_name, js_lvgl_init);
if (!m)
return NULL;
JS_AddModuleExportList(ctx, m, js_lvgl_funcs, countof(js_lvgl_funcs));
return m;
}
int JS_ToInt8(JSContext *ctx, int8_t *pres, JSValueConst val)
{
uint32_t v;
int ret = JS_ToInt32(ctx, &v, val);
*pres = v > 0x7f? 0x7f : v < -0x80? -0x80 : v;
return ret;
}
int JS_ToUint8(JSContext *ctx, uint8_t *pres, JSValueConst val)
{
uint32_t v;
int ret = JS_ToUint32(ctx, &v, val);
*pres = v > 0xff? 0xff : v;
return ret;
}
int JS_ToInt16(JSContext *ctx, int16_t *pres, JSValueConst val)
{
int32_t v;
int ret = JS_ToInt32(ctx, &v, val);
*pres = v > 0x7fff? 0x7fff : v < -0x8000? -0x8000 : v;
return ret;
}
int JS_ToUint16(JSContext *ctx, uint16_t *pres, JSValueConst val)
{
uint32_t v;
int ret = JS_ToUint32(ctx, &v, val);
*pres = v > 0xffff? 0xffff : v;
return v;
}
int JS_ToPointer(JSContext *ctx, lv_obj_ptr_t *pres, JSValueConst val)
{
if (sizeof(lv_obj_ptr_t) == 8)
{
return JS_ToInt64(ctx, (uint64_t *)pres, val);
}
else
{
return JS_ToInt32(ctx, (uint32_t *)pres, val);
}
}
static inline JSValue JS_NewPointer(JSContext *ctx, lv_obj_ptr_t val)
{
if (sizeof(lv_obj_ptr_t) == 8)
{
return JS_NewInt64(ctx, val);
}
else
{
return JS_NewInt32(ctx, val);
}
}#include "lvgl_export.h"
static JSValue lvgl_obj_create(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * parent = (lv_obj_t *)p;
lv_obj_t * obj = lv_obj_create(parent);
return JS_NewPointer(ctx, (lv_obj_ptr_t)obj);
}
static JSValue lvgl_label_create(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * parent = (lv_obj_t *)p;
lv_obj_t * lbl = lv_label_create(parent);
return JS_NewPointer(ctx, (lv_obj_ptr_t)lbl);
}
static JSValue lvgl_label_set_text(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * lbl = (lv_obj_t *)p;
const char * str = JS_ToCString(ctx, argv[1]);
lv_label_set_text(lbl, str);
return JS_NULL;
}
static JSValue lvgl_scr_load(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * lbl = (lv_obj_t *)p;
lv_scr_load(lbl);
return JS_NULL;
}
static JSValue lvgl_obj_set_pos(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 3) {
lv_coord_t x = 0;
JS_ToInt16(ctx, &x, argv[1]);
lv_coord_t y = 0;
JS_ToInt16(ctx, &y, argv[2]);
lv_obj_set_pos(obj, x, y);
}
}
static JSValue lvgl_obj_set_size(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 3) {
lv_coord_t w = 0;
JS_ToInt16(ctx, &w, argv[1]);
lv_coord_t h = 0;
JS_ToInt16(ctx, &h, argv[2]);
lv_obj_set_size(obj, w, h);
}
}
static JSValue lvgl_obj_set_style_bg_color(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 2) {
uint32_t color = 0;
JS_ToUint32(ctx, &color, argv[1]);
lv_color_t c = lv_color_hex(color);
lv_obj_set_style_bg_color(obj, c, LV_PART_MAIN|LV_STATE_DEFAULT);
}else if(argc == 3){
uint32_t color = 0;
JS_ToUint32(ctx, &color, argv[1]);
lv_color_t c = lv_color_hex(color);
uint32_t mark = 0;
JS_ToUint32(ctx, &mark, argv[2]);
lv_obj_set_style_bg_color(obj, c, mark);
}
}
static JSValue lvgl_obj_set_style_bg_opa(JSContext *ctx, JSValueConst this_val,
int argc, JSValueConst *argv)
{
lv_obj_ptr_t p;
JS_ToPointer(ctx, &p, argv[0]);
lv_obj_t * obj = (lv_obj_t *)p;
if (argc == 2) {
uint8_t opa = 0;
JS_ToUint8(ctx, &opa, argv[1]);
lv_obj_set_style_bg_opa(obj, opa, LV_PART_MAIN|LV_STATE_DEFAULT);
}else if(argc == 3){
uint8_t opa = 0;
JS_ToUint8(ctx, &opa, argv[1]);
uint32_t mark = 0;
JS_ToUint32(ctx, &mark, argv[2]);
lv_obj_set_style_bg_opa(obj, opa, mark);
}
}
static const JSCFunctionListEntry js_lvgl_funcs[] = {
JS_PROP_STRING_DEF("test", "test..", JS_PROP_C_W_E),
JS_CFUNC_DEF("lvgl_obj_create", 1, lvgl_obj_create),
JS_CFUNC_DEF("lvgl_label_create", 1, lvgl_label_create),
JS_CFUNC_DEF("lvgl_label_set_text", 2, lvgl_label_set_text),
JS_CFUNC_DEF("lvgl_obj_set_pos", 3, lvgl_obj_set_pos),
JS_CFUNC_DEF("lvgl_obj_set_size", 3, lvgl_obj_set_size),
JS_CFUNC_DEF("lvgl_obj_set_style_bg_color", 3, lvgl_obj_set_style_bg_color),
JS_CFUNC_DEF("lvgl_obj_set_style_bg_opa", 3, lvgl_obj_set_style_bg_opa),
JS_CFUNC_DEF("lvgl_scr_load", 1, lvgl_scr_load),
};
static int js_lvgl_init(JSContext *ctx, JSModuleDef *m)
{
return JS_SetModuleExportList(ctx, m, js_lvgl_funcs,
countof(js_lvgl_funcs));
}
JSModuleDef *js_init_module_lvgl(JSContext *ctx, const char *module_name)
{
JSModuleDef *m;
m = JS_NewCModule(ctx, module_name, js_lvgl_init);
if (!m)
return NULL;
JS_AddModuleExportList(ctx, m, js_lvgl_funcs, countof(js_lvgl_funcs));
return m;
}
int JS_ToInt8(JSContext *ctx, int8_t *pres, JSValueConst val)
{
uint32_t v;
int ret = JS_ToInt32(ctx, &v, val);
*pres = v > 0x7f? 0x7f : v < -0x80? -0x80 : v;
return ret;
}
int JS_ToUint8(JSContext *ctx, uint8_t *pres, JSValueConst val)
{
uint32_t v;
int ret = JS_ToUint32(ctx, &v, val);
*pres = v > 0xff? 0xff : v;
return ret;
}
int JS_ToInt16(JSContext *ctx, int16_t *pres, JSValueConst val)
{
int32_t v;
int ret = JS_ToInt32(ctx, &v, val);
*pres = v > 0x7fff? 0x7fff : v < -0x8000? -0x8000 : v;
return ret;
}
int JS_ToUint16(JSContext *ctx, uint16_t *pres, JSValueConst val)
{
uint32_t v;
int ret = JS_ToUint32(ctx, &v, val);
*pres = v > 0xffff? 0xffff : v;
return v;
}
int JS_ToPointer(JSContext *ctx, lv_obj_ptr_t *pres, JSValueConst val)
{
if (sizeof(lv_obj_ptr_t) == 8)
{
return JS_ToInt64(ctx, (uint64_t *)pres, val);
}
else
{
return JS_ToInt32(ctx, (uint32_t *)pres, val);
}
}
static inline JSValue JS_NewPointer(JSContext *ctx, lv_obj_ptr_t val)
{
if (sizeof(lv_obj_ptr_t) == 8)
{
return JS_NewInt64(ctx, val);
}
else
{
return JS_NewInt32(ctx, val);
}
}custom.c 關(guān)鍵代碼
JSRuntime *rt = NULL;
JSContext *ctx = NULL;
void lvgl_js_init() {
printf("lvgl_js_init\n");
rt = JS_NewRuntime();
js_std_init_handlers(rt);
ctx = JS_NewContext(rt);
js_init_module_std(ctx, "std");
js_init_module_os(ctx, "os");
js_init_module_lvgl(ctx, "lvgl");
const char *str =
"import * as std from 'std';\n"
"import * as lvgl from 'lvgl';\n"
"import * as os from 'os';\n"
"globalThis.std = std;\n"
"globalThis.lvgl = lvgl;\n"
"var console = {};\n"
"console.log = function(value){std.printf(value + '\\n');}\n"
"globalThis.console = console\n"
"";
JSValue init_compile =
JS_Eval(ctx, str, strlen(str), "<input>", JS_EVAL_TYPE_MODULE | JS_EVAL_FLAG_COMPILE_ONLY);
js_module_set_import_meta(ctx, init_compile, 1, 1);
JSValue init_run = JS_EvalFunction(ctx, init_compile);
}
void run_js(){
//讀取文件，并運(yùn)行js
FILE *fp = fopen("test.js", "r");
if(fp == NULL){
printf("open file error\n");
return;
}
fseek(fp, 0, SEEK_END);
int len = ftell(fp);
fseek(fp, 0, SEEK_SET);
len = len + 1;
char *buf = (char *)malloc(len);
memset(buf, 0, len);
fread(buf, 1, len, fp);
printf("============CODE==========\n");
printf("FILE: %d \n\n%s\n", len, buf);
printf("==========================\n");
fclose(fp);
JSValue result = JS_Eval(ctx, buf, strlen(buf), "test", JS_EVAL_TYPE_MODULE);
js_std_loop(ctx);
int clen;
int to_int_32;
if ((to_int_32 = JS_ToInt32(ctx, &clen, result)) != 0) {
js_std_dump_error(ctx);
}
}
/**
* Create a demo application
*/
void custom_init(lv_ui *ui)
{
/* Add your codes here */
lvgl_js_init();
run_js();
}test.js
import * as lvgl from 'lvgl';
//如果要在cmd控制臺(tái)輸出中文， 在控制臺(tái)執(zhí)行chcp 65001切換至utf-8
console.log("JS Dev utf-8");
var screen = lvgl.lvgl_obj_create(); //這個(gè)作為頁(yè)面
var lbl = lvgl.lvgl_label_create(screen);
lvgl.lvgl_label_set_text(lbl, "HELLO");
lvgl.lvgl_obj_set_pos(lbl, 150, 10);
lvgl.lvgl_obj_set_size(lbl, 100, 100);
lvgl.lvgl_obj_set_style_bg_opa(lbl, 255);
lvgl.lvgl_obj_set_style_bg_color(lbl, 0x2195f6);
var lbl = lvgl.lvgl_label_create(screen);
lvgl.lvgl_label_set_text(lbl, "WORLD");
lvgl.lvgl_obj_set_pos(lbl, 200, 150);
lvgl.lvgl_obj_set_size(lbl, 100, 50);
lvgl.lvgl_obj_set_style_bg_opa(lbl, 200);
lvgl.lvgl_obj_set_style_bg_color(lbl, 0x2195f6);
lvgl.lvgl_scr_load(screen);
console.log("End.");預(yù)覽效果
到此這篇關(guān)于quickjs調(diào)用lvgl函數(shù)的文章就介紹到這了,更多相關(guān)quickjs調(diào)用lvgl函數(shù)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
您可能感興趣的文章:
相關(guān)文章
JavaScript常用數(shù)組去重實(shí)戰(zhàn)源碼
本文給大家分享js常用8種數(shù)組去重實(shí)戰(zhàn)源碼，針對(duì)每種方法通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，需要的朋友參考下吧2021-07-07
JavaScript實(shí)現(xiàn)異步圖像上傳功能
這篇文章主要介紹了JavaScript實(shí)現(xiàn)異步圖像上傳功能,本文展示了一種使用代碼示例立即顯示圖像的方法(使用圖像的Base64編碼版本)，同時(shí)將其上載到服務(wù)器，而無(wú)需等待操作完成。需要的朋友可以參考下2018-07-07
JavaScript的9個(gè)陷阱及評(píng)點(diǎn)分析
以下是JavaScript容易犯錯(cuò)的九個(gè)陷阱。雖然不是什么很高深的技術(shù)問(wèn)題，但注意一下，會(huì)使您的編程輕松些，即所謂make life easier. 筆者對(duì)某些陷阱會(huì)混雜一些評(píng)點(diǎn)。2008-05-05
Moment.js實(shí)現(xiàn)多個(gè)同時(shí)倒計(jì)時(shí)
這篇文章主要為大家詳細(xì)介紹了Moment.js實(shí)現(xiàn)多個(gè)同時(shí)倒計(jì)時(shí)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-08-08
Webpack 之 babel-loader文件預(yù)處理器詳解
這篇文章主要介紹了Webpack 之 babel-loader文件預(yù)處理器詳解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-03-03
JS實(shí)現(xiàn)頁(yè)面滾動(dòng)到關(guān)閉時(shí)的位置與不滾動(dòng)效果
這篇文章主要介紹了JS實(shí)現(xiàn)頁(yè)面滾動(dòng)到關(guān)閉時(shí)的位置與不滾動(dòng)效果,滾動(dòng)有兩種方案，其一，利用路由中的meta，在離開(kāi)頁(yè)面時(shí)緩存 top 信息，其二，利用keep-alive緩存整個(gè)頁(yè)面。但是僅限于沒(méi)有實(shí)時(shí)數(shù)據(jù)變動(dòng)的頁(yè)面，需要的朋友可以參考下本文2022-06-06
JS獲取圖片實(shí)際寬高及根據(jù)圖片大小進(jìn)行自適應(yīng)
圖片實(shí)際寬高使用js進(jìn)行獲取以及根據(jù)圖片大小進(jìn)行自適應(yīng)，此功能個(gè)人感覺(jué)比較實(shí)用，在此貢獻(xiàn)出來(lái)，希望對(duì)大家有所幫助2013-08-08
為了讓一個(gè)廣告幾秒以后再執(zhí)行所以做個(gè)延遲加載的東東，用了JS實(shí)現(xiàn)，還蠻好用的，算是分享，也是記錄吧。2010-07-07
在 JavaScript 中，有一些操作符可以使代碼更簡(jiǎn)潔、易讀和高效。這篇文章為大家整理了11個(gè)JavaScript中常用操作符的使用，需要的可以參考一下2023-04-04
Bootstrap select下拉聯(lián)動(dòng)（jQuery cxselect）
這篇文章主要為大家詳細(xì)介紹了Bootstrap select下拉聯(lián)動(dòng),JQuery插件之cxselect，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-01-01