Electron qt开发教程

news2024/11/28 2:48:05
模块安装打包 

npm install -g electron-forge
electron-forge init my-project --template=vue
npm start  //进入目录启动
//打包成一个目录到out目录下，注意这种打包一般用于调试，并不是用于分发
npm run package
//打出真正的分发包，放在out\make目录下
npm run make

npx @electron-forge/cli@latest import
npx create-electron-app my-app

npm install mousetrap  //快捷键绑定库

npm install  worker_threads  //工作线程模块
npm install worker-loader  //
npm init     //C++项目目录下初始化项目
npm install --global --production windows-build-tools

快速体验

npm install -g electron-prebuilt  
git clone https://github.com/electron/electron-quick-start
cd electron-quick-start
npm install && npm start

cnpm install electron-packager -g
 "scripts": {"package":"electron-packager . HelloWorld --platform=win32 --arch=x64 --icon=computer.ico --out=./out --asar --app-version=0.0.1 --overwrite --ignore=node_modules"
  }
npm run package
 

@python "%~dp0gyp_main.py" %*

JS调用C++
#include <node.h>
#include <v8.h>

using namespace v8;

// 传入了两个参数，args[0] 字符串，args[1] 回调函数
void hello(const FunctionCallbackInfo<Value>& args) {
  // 使用 HandleScope 来管理生命周期
  Isolate* isolate = Isolate::GetCurrent();
  HandleScope scope(isolate);

  // 判断参数格式和格式
  if (args.Length() < 2 || !args[0]->IsString()) {
    isolate->ThrowException(Exception::TypeError(
      String::NewFromUtf8(isolate, "Wrong arguments")));
    return;
  }

  // callback, 使用Cast方法来转换
  Local<Function> callback = Local<Function>::Cast(args[1]);
  Local<Value> argv[1] = {
    // 拼接String
    String::Concat(Local<String>::Cast(args[0]), String::NewFromUtf8(isolate, " world"))
  };
  // 调用回调, 参数: 当前上下文，参数个数，参数列表
  callback->Call(isolate->GetCurrentContext()->Global(), 1, argv);
}

// 相当于在 exports 对象中添加 { hello: hello }
void init(Local<Object> exports) {
  NODE_SET_METHOD(exports, "hello", hello);
}

// 将 export 对象暴露出去
// 原型 `NODE_MODULE(module_name, Initialize)`
NODE_MODULE(test, init);

//方法暴露
void Method(const FunctionCallbackInfo<Value>& args) {
  Isolate* isolate = args.GetIsolate();
  args.GetReturnValue().Set(String::NewFromUtf8(
      isolate, "world").ToLocalChecked());
}

void Initialize(Local<Object> exports) {
  NODE_SET_METHOD(exports, "hello", Method);
}

NODE_MODULE(NODE_GYP_MODULE_NAME, Initialize)
extern "C" NODE_MODULE_EXPORT void
NODE_MODULE_INITIALIZER(Local<Object> exports,
                        Local<Value> module,
                        Local<Context> context) {
  /* Perform addon initialization steps here. */
}


int main(int argc, char* argv[]) {
  // Create a stack-allocated handle scope. 
  HandleScope handle_scope;
  // Create a new context. 
  Handle<Context> context = Context::New();
  // Enter the created context for compiling and 
  // running the hello world script.
  Context::Scope context_scope(context);
  // Create a string containing the JavaScript source code. 
  Handle<String> source = String::New("'Hello' + ', World!'");
  // Compile the source code. 
  Handle<Script> script = Script::Compile(source);
  // Run the script to get the result. 
  Handle<Value> result = script->Run();
  // Convert the result to an ASCII string and print it. 
  String::AsciiValue ascii(result);
  printf("%s\n", *ascii);
  return 0;
}

//create accessor for string username
global->SetAccessor(v8::String::New("user"),userGetter,userSetter); 
//associates print on script to the Print function
global->Set(v8::String::New("print"), v8::FunctionTemplate::New(Print)); 

//注册类对象
Handle<FunctionTemplate> point_templ = FunctionTemplate::New();
point_templ->SetClassName(String::New("Point"));
Handle<ObjectTemplate> point_proto = point_templ->PrototypeTemplate();
point_proto->Set("method_a", FunctionTemplate::New(PointMethod_A));
point_proto->Set("method_b", FunctionTemplate::New(PointMethod_B));
//设置指针个数
Handle<ObjectTemplate> point_inst = point_templ->InstanceTemplate();
point_inst->SetInternalFieldCount(1);
//创建实例
Handle<Function> point_ctor = point_templ->GetFunction();
Local<Object> obj = point_ctor->NewInstance();
obj->SetInternalField(0, External::New(p));
//获取类指针处理
     Handle<Value> PointMethod_A(const Arguments& args)

2.                {

3.                    Local<Object> self = args.Holder();

4.                    Local<External> wrap = Local<External>::Cast(self->GetInternalField(0));

5.                    void* ptr = wrap->Value();

6.                    static_cast<Point*>(ptr)->Function_A();

7.                    return Integer::New(static_cast<Point*>(ptr)->x_);

8.                }

//向MakeWeak注册的callback.  
void CloudAppWeakReferenceCallback(Persistent<Value> object  
                                                , void * param) {  
    if (CloudApp* cloudapp = static_cast<CloudApp*>(param)) {  
        delete cloudapp;  
    }  
}  
  
//将C++指针通过External保存为Persistent对象，避免的指针被析构  
Handle<External> MakeWeakCloudApp(void* parameter) {  
    Persistent<External> persistentCloudApp =   
        Persistent<External>::New(External::New(parameter));  
          
//MakeWeak非常重要，当JS世界new一个CloudApp对象之后  
//C++也必须new一个对应的指针。  
//JS对象析构之后必须想办法去析构C++的指针，可以通过MakeWeak来实现，  
//MakeWeak的主要目的是为了检测Persistent Handle除了当前Persistent   
//的唯一引用外，没有其他的引用，就可以析构这个Persistent Handle了，  
//同时调用MakeWeak的callback。这是我们可以再这个callback中delete   
//C++指针  
    persistentCloudApp.MakeWeak(parameter, CloudAppWeakReferenceCallback);  
  
    return persistentCloudApp;  
}  

void Print(const v8::FunctionCallbackInfo<v8::Value>& args) {  
  bool first = true;  
  for (int i = 0; i < args.Length(); i++) {  
    v8::HandleScope handle_scope(args.GetIsolate());  
    if (first) {  
      first = false;  
    } else {  
      printf(" ");  
    }  
    v8::String::Utf8Value str(args[i]);  
    const char* cstr = ToCString(str);  
    printf("%s", cstr);  
    const char* s_result = "print call succeed\n";  
    v8::Local<v8::String>  v_result = v8::String::NewFromUtf8(args.GetIsolate(), s_result,  
        v8::NewStringType::kNormal).ToLocalChecked();  
    args.GetReturnValue().Set(v_result);  
  }  
  printf("\n");  
  fflush(stdout);  
}  
v8::Local<v8::ObjectTemplate> global = v8::ObjectTemplate::New(isolate);  
  // Bind the global 'print' function to the C++ Print callback.  
  global->Set(  
      v8::String::NewFromUtf8(isolate, "print", v8::NewStringType::kNormal)  
          .ToLocalChecked(),  
      v8::FunctionTemplate::New(isolate, Print));  
Local<Context> context = v8::Context::New(isolate, NULL, global);

Isolate *isolate = args.GetIsolate();
Local<Object> opts = args[0]->ToObject();
Local<Number> mode = opts->Get(String::NewFromUtf8(isolate, "mode"))->ToNumber(isolate);
static void DeleteInstance(void* data) {
  // 将 `data` 转换为该类的实例并删除它。
}
node::AddEnvironmentCleanupHook(DeleteInstance) //在销毁环境之后被删除
JS调用C++函数，就是通过FunctionTemplate和ObjectTemplate进行扩展的。
V8的External就是专门用来封装（Wrap）和解封(UnWrap)C++指针的
V8_EXPORT
V8_INLINE
v8::Handle<
v8::Local<
const v8::Arguments
const v8::FunctionCallbackInfo<v8::Value>&   不定参数
  Local<FunctionTemplate> tpl = FunctionTemplate::New(isolate);
G
String::NewFromUtf8Literal(isolate, "isNull")
String::Cast
isolate->GetCurrentContext()
NODE_SET_PROTOTYPE_METHOD(tpl, "x", X);
https://github.com/alibaba/jsni.git
nodeqt
const qt = require("./lib/qt");
const app = new qt.QApplication();
const window = new qt.QMainWindow();
const box = new qt.QWidget();
box.setStyleSheet("background-color:red;");
box.resize(300, 300);
box.move(300, 300);
box.setParent(window);
window.resizeEvent((width, height) => {
  console.log("Resized1", width, height);
  console.log(width, height);
});
window.closeEvent(() => {
  console.log("Closing");
});
box.resizeEvent((width, height) => {
  console.log("Resized2", width, height);
});
box.mousePressEvent(() => console.log("CLICKED!"));
box.mouseReleaseEvent(() => console.log("UNCLICKED!"));
box.setMouseTracking(true);
box.mouseMoveEvent((x, y) => console.log(`MOUSE MOVED! x: ${x} y: ${y}`));
box.enterEvent(() => console.log("MOUSE ENTERED!"));
box.leaveEvent(() => console.log("MOUSE LEFT!"));
const label = new qt.QLabel(box);
console.log("Size hint", label.sizeHint());
console.log("Height", label.height());
label.setText('<span style="">dsawewwww<span style="">Hello2</span></span>');
label.adjustSize();
const label2 = new qt.QLabel(window);
const pix = new qt.QPixmap();
pix.load("/home/kusti8/Pictures/test_small.jpg");
pix.scaled(300, 300, qt.AspectRatioMode.IgnoreAspectRatio);
label2.setPixmap(pix);
label2.adjustSize();
label2.setStyleSheet("background-color: red;");
label2.move(300, 600);
label2.setScaledContents(false);
label2.setAlignment(qt.Alignment.AlignCenter);
label2.show();
const lineedit = new qt.QLineEdit(window);
lineedit.move(100, 100);
lineedit.textChangedEvent(text => console.log("text changed", text));
lineedit.show();
const combobox = new qt.QComboBox(window);
combobox.currentTextChangedEvent(text => console.log("New combo", text));
combobox.setEditable(true);
combobox.addItem("Test1");
combobox.addItem("Test2");
combobox.addItem("Test3");
box.show();
box.clear();
console.log("set parent");
window.show();
console.log("set parent");
app.aboutToQuitEvent(() => console.log("Quitting"));
console.log("Height", label.height());
console.log(qt.desktopSize());
app.exec();
GitHub - arturadib/node-qt: C++ Qt bindings for Node.js

mirrors_CoderPuppy/node-qt

GitHub - anak10thn/node-qt5

GitHub - NickCis/nodeQt: Qt binding for Node

GitHub - a7ul/mdview-nodegui: A Markdown editor in NodeGui

GitHub - kusti8/node-qt-napi: Node.js bindinds for Qt5, using NAPI

GitHub - nodegui/qode: DEPRECATED: Please see https://github.com/nodegui/qodejs instead

GitHub - svalaskevicius/qtjs-generator: Qt API bindings generator for Node.js

C++ 插件 | Node.js v22 文档

GitHub - nodegui/nodegui-starter: A starter repo for NodeGui projects

GitHub - anak10thn/qhttpserver: HTTP server implementation for Qt based on node.js' http parser

GitHub - anak10thn/chrome-app-samples: Chrome Apps

GitHub - magne4000/node-qtdatastream: Nodejs lib which can read/write Qt formatted Datastreams

GitHub - fwestrom/qtort-microservices: A simple micro-services framework for Node.js.

GitHub - ivan770/PiQture: Screenshot tool based on Electron

GitHub - miskun/qtc-sdk-node: Qt Cloud Services SDK for Node.js

v8: include/v8.h File Reference

nodegyp

node-gyp -j 8 configure
node-gyp -j 8 build
"install": "node-gyp -j 8 rebuild --arch=ia32"
"install": "node-gyp -j 8 rebuild --arch=x86"

https://github.com/kusti8/node-qt-napi/releases/download/0.0.4/qt-v0.0.4-4-win32-x64.tar.gz

工程搭建方式

gyp文件样例

TortoiseGit bash使用
set PRJ_PATH=E:\workspace\test\Web-Dev-For-Beginners\nodeqt
TortoiseGitProc.exe /command:commit /path:"%PRJ_PATH%\nodegyp" /logmsgfile:"%PRJ_PATH%\refModify.txt"  /bugid:1 /closeonend:2%
TortoiseGitProc.exe /command:pull /path:"%PRJ_PATH%\nodegyp" /closeonend:2
TortoiseGitProc.exe /command:push /path:"%PRJ_PATH%\nodegyp" /closeonend:2
pause

GitHub - electron/electron-api-demos: Explore the Electron APIsExplore the Electron APIs. Contribute to electron/electron-api-demos development by creating an account on GitHub.icon-default.png?t=N7T8https://github.com/electron/electron-api-demosQuick Start | ElectronThis guide will step you through the process of creating a barebones Hello World app in Electron, similar to electron/electron-quick-start.icon-default.png?t=N7T8https://electronjs.org/docs/tutorial/quick-starthttps://github.com/electron/electron-quick-starticon-default.png?t=N7T8https://github.com/electron/electron-quick-start GitHub - qtoolkit/qtk: QTK 是一套基于HTML5 Canvas实现的, 专注于桌面/移动应用程序开发的框架。

https://github.com/sindresorhus/awesome-electron

Introduction | Electron

Electron

创作不易，小小的支持一下吧！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1802737.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

FJSP：烟花算法（FWA）求解柔性作业车间调度问题（FJSP），提供MATLAB代码

FJSP：烟花算法（FWA）求解柔性作业车间调度问题（FJSP），提供MATLAB代码

一、烟花算法介绍 参考文献&#xff1a; Tan, Y. and Y. Zhu. Fireworks Algorithm for Optimization. in Advances in Swarm Intelligence. 2010. Berlin, Heidelberg: Springer Berlin Heidelberg. 二、烟花算法求解FJSP 2.1FJSP模型介绍 柔性作业车间调度问题(Flexible …
阅读更多...
在VMware虚拟机上安装win10 跳过 通过microsoft登录

在VMware虚拟机上安装win10 跳过 通过microsoft登录

在VMware虚拟机上安装win10 跳过 “通过microsoft登录” 配置虚拟机&#xff0c;将网卡断开&#xff0c; 具体操作&#xff1a; 虚拟机/设置/硬件/网络适配器/设备状态&#xff0c;取消已连接和启动时连接的两个对号&#xff0c; 再把虚拟机重启&#xff0c;然后就可以跳过这个…
阅读更多...
Type-C转音频(C/3.5mm接口USB2.0数据传输)带PD充电低成本解决方案

Type-C转音频(C/3.5mm接口USB2.0数据传输)带PD充电低成本解决方案

LDR6500&#xff1a;领先市场的USB-C DRP接口USB PD通信芯片 产品介绍 LDR6500&#xff0c;由乐得瑞科技精心研发&#xff0c;是一款针对USB Type-C标准中Bridge设备而优化的USB-C DRP&#xff08;Dual Role Port&#xff0c;双角色端口&#xff09;接口USB PD&#xff08;Po…
阅读更多...
【原创】springboot+mysql农业园区管理系统设计与实现

【原创】springboot+mysql农业园区管理系统设计与实现

个人主页&#xff1a;程序猿小小杨 个人简介&#xff1a;从事开发多年&#xff0c;Java、Php、Python、前端开发均有涉猎 博客内容&#xff1a;Java项目实战、项目演示、技术分享 文末有作者名片&#xff0c;希望和大家一起共同进步&#xff0c;你只管努力&#xff0c;剩下的交…
阅读更多...
Redis进阶知识个人汇总

Redis进阶知识个人汇总

持久化 三种方式实现它的持久化&#xff1a; RDB持久化 全称Redis数据备份文件&#xff0c;又称Redis数据快照 这种就是将Redis内存中所有数据记录到磁盘中&#xff0c;当实例出故障后&#xff0c;从磁盘中读快照文件进行恢复数据。 一般使用bgsave指令实现 复制主线程得到一…
阅读更多...
五分钟上手IoT小程序

五分钟上手IoT小程序

五分钟上手IoT小程序 IoT小程序框架搭建开发环境首先安装NodeJs安装NodeJs验证安装成功 安装cnpm 安装VSCode 开发IDE下载开发IDE安装开发IDE安装框架脚手架 下载模拟器创建工程项目应用编译(打包构建) VSCode 开发IDE安装插件通过开发插件创建工程编译工程debug编译编译太慢问…
阅读更多...
01Linux的安装,时区,固定IP的配置

01Linux的安装,时区,固定IP的配置

Linux系统的简介与安装 Linux简介 计算机是由硬件和软件所组成 硬件&#xff1a;计算机系统中由电子,机械和光电元件等组成的各种物理装置的总称软件&#xff1a;是用户和计算机硬件之间的接口和桥梁&#xff0c;用户通过软件与计算机进行交流(操作系统) 操作系统作为用户和…
阅读更多...
记一次源码部分丢失后补救过程

记一次源码部分丢失后补救过程

起因 最近植物大战僵尸杂交版玩的入迷&#xff0c;写了一个“神奇”小工具&#xff0c;来辅助游戏。用Git新建一个库&#xff0c;想把代码备份到GitHub&#xff0c;结果push错库了&#xff0c;无奈reset&#xff0c;结果把本地项目一起reset了&#xff0c;结果就是源代码丢失。…
阅读更多...
CSS3 clip-path：打造独特创意设计效果的秘密武器

CSS3 clip-path：打造独特创意设计效果的秘密武器

100编程书屋_孔夫子旧书网 一部由CSS技术实现的作品。它将再一次证明CSS的强大力量。 欣赏 这是一部由阿姆斯特丹设计师Bryan James通过30张CSS碎片拼图展现30种濒临灭绝动物的网站。 有生活在夏威夷岛林地中的夏威夷乌鸦。 有栖息于墨西哥西部加利福尼亚湾中的小头鼠海豚…
阅读更多...
Python中__面向对象__学习 (上)

Python中__面向对象__学习 (上)

目录 一、类和对象 1.类的定义 2.根据对象创建类 二、构造和析构 1.构造方法 &#xff08;1&#xff09;不带参数的构造方法 &#xff08;2&#xff09;带参数的构造方法 2.析构方法 三、重载 1.定制对象的字符串形式 &#xff08;1&#xff09;只重载__str__方法 …
阅读更多...
Java面试八股之组合、聚合和关联三者的区别是什么

Java面试八股之组合、聚合和关联三者的区别是什么

组合、聚合和关联三者的区别是什么 关联&#xff08;Association&#xff09;: 最基本的一种关系&#xff0c;表示一个类知道另一个类的存在&#xff0c;或者说是类之间的某种联系。 关联可以是双向的也可以是单向的&#xff0c;且不规定参与关联的对象的生存周期。 实例&a…
阅读更多...
SpringBoot 的多配置文件

SpringBoot 的多配置文件

文章目录 SpringBoot 的多配置文件spring.profiles.active 配置Profile 和 ActiveProfiles 注解 SpringBoot 的多配置文件 spring.profiles.active 配置 默认情况下&#xff0c;当你启动 SpringBoot 项目时&#xff0c;会在日志中看到如下一条 INFO 信息&#xff1a; No act…
阅读更多...
Aptos Builder Jam 亚洲首站｜见证 Aptos 公链 2024 年新突破

Aptos Builder Jam 亚洲首站｜见证 Aptos 公链 2024 年新突破

4 月下旬的「TinTin DESTINATION MOON」杭州站活动让我们构建下一个 Web3 巅峰的项目生态行动与未来战略。时隔三个月&#xff0c;「TinTin DESTINATION MOON」Aptos 线下活动将再次来到杭州&#xff0c;为 Aptos Builder Jam 亚洲首站火热造势&#xff0c;7 月 6 日诚邀 Web3 …
阅读更多...
【Java数据结构】详解LinkedList与链表（四）

【Java数据结构】详解LinkedList与链表（四）

&#x1f512;文章目录&#xff1a; 1.❤️❤️前言~&#x1f973;&#x1f389;&#x1f389;&#x1f389; 2.什么是LinkedList 3.LinkedList的使用 3.1LinkedList的构造方法 3.2LinkedList的其他常用方法介绍 addAll方法 subList方法 LinkedList的常用方法总使…
阅读更多...
双列集合底层源码

双列集合底层源码

tips: 竖着的箭头&#xff1a;重写 横着的箭头&#xff1a;继承
阅读更多...
LabVIEW伺服电机测控系统

LabVIEW伺服电机测控系统

LabVIEW伺服电机测控系统 开发了一个基于LabVIEW的伺服电机测控系统。系统主要用于精确控制电机的运动&#xff0c;以达到高效率和高精度的要求。通过使用LabVIEW软件和配套的硬件&#xff0c;开发者能够实现对伺服电机的实时监控和控制&#xff0c;进而提高整个系统的性能和可…
阅读更多...
ElasticSearch学习笔记之三：Logstash数据分析

ElasticSearch学习笔记之三：Logstash数据分析

第3章 Logstash数据分析 Logstash使用管道方式进行日志的搜集处理和输出。有点类似*NIX系统的管道命令 xxx | ccc | ddd&#xff0c;xxx执行完了会执行ccc&#xff0c;然后执行ddd。 在logstash中&#xff0c;包括了三个阶段: 输入input --> 处理filter&#xff08;不是必须…
阅读更多...
28-unittest批量执行（discover）

28-unittest批量执行（discover）

unittest框架提供了创建测试用例、测试套件以及批量执行的解决方案。 利用单元测试框架创建测试类&#xff0c;可以把每个测试方法看成是一个最小的单元&#xff0c; 由测试容器组装打包起来&#xff0c;然后可以统一执行&#xff0c;最后输出测试报告。 一、UnitTest核心要素…
阅读更多...
DevOps在数字化转型中的作用——实现数字化可视性

DevOps在数字化转型中的作用——实现数字化可视性

DevOps 的出现是为了满足不断增长的市场和消费者对技术应用程序的需求。它旨在在不牺牲软件质量的情况下创建更快的开发环境。DevOps 还专注于在快速开发生命周期中提高软件的整体质量。它依赖于多种技术、平台和工具的组合来实现所有这些目标。 容器化是一项彻底改变了我们开发…
阅读更多...
云手机定位切换，带来的不只是便利

云手机定位切换，带来的不只是便利

当我们利用云手机的定位切换时&#xff0c;首先感受到的确实是极大的便利。 我们就像是拥有了瞬间移动的超能力&#xff0c;可以自由地在不同城市、甚至不同国家的虚拟场景中穿梭。无论是为了更精准地获取当地的信息&#xff0c;比如实时的交通状况、特色店铺等&#xff0c;还…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023