学习基础知识

Full-Stack-python / 2023-08-27 / 原文

学习基础知识

NodeGui 使用原生组件而不是基于 Web 的组件作为构建块。因此,要了解 NodeGui 应用程序的基本结构,您需要熟悉 Javascript 或 Typescript。本教程面向所有在 Web 开发方面有一定 Web 经验的人。

节点贵发展简述#

就开发而言,NodeGui 应用程序本质上是一个 Node.js 应用程序。起点与 Node.js 模块的起点相同。一个最基本的 NodeGui 应用程序将具有以下内容 文件夹结构:package.json

your-app/
├── package.json
├── index.js

NodeGui 中的所有 API 和功能都可以通过该模块访问,这可以像任何其他 Node.js 模块一样需要。此外,您还可以访问所有节点.js API 和节点模块。@nodegui/nodegui

require("@nodegui/nodegui");

该模块导出命名空间中的功能。例如,可以创建一个窗口 使用该类。一个简单的文件可能会打开一个窗口:@nodegui/nodeguiQMainWindowmain.js

const { QMainWindow } = require("@nodegui/nodegui");

const win = new QMainWindow();
win.show();

global.win = win; // 防止胜利被垃圾回收。

应该创建窗口并处理所有系统事件 应用程序可能会遇到。index.js

这是怎么回事?#

首先,我们正在运行一个常规的 Node.js 应用程序。这意味着我们不是在浏览器环境中运行。QMainWindow本质上是Qt的QMainWindow上的轻量级JavaScript包装器。因此,您在 QMainWindow 实例上调用的每个方法实际上都会影响本机窗口小部件。与基于浏览器的解决方案相比,这是非常轻的重量,因此更接近操作系统。

试用初学者项目#

使用 nodegui/nodegui-starter 存储库克隆并运行代码。

注意:运行它需要 Git 和 npm。


git clone https://github.com/nodegui/nodegui-starter

cd nodegui-starter

npm install

npm start

除了基本窗口之外还有什么?#

NodeGui支持基本的小部件,如QWidget(类似于div),QCheckBox,QPushButton等等。 你可以在这里看看 NodeGui 目前支持的原生小部件列表:NodeGui 中的原生小部件。 随着时间的推移,更多的小部件和API将被添加到NodeGui中。除了 NodeGui 中的模块,您还可以访问整个节点模块生态系统。因此,任何可以与 Node.js 一起使用的节点模块都可以与 NodeGui 一起使用。这使得它非常强大。

很好,我想要一些更自定义和更漂亮的东西,而不仅仅是原生外观的小部件。我该怎么办?

为了让事情变得更漂亮,你必须学习造型。接下来让我们来看看。