Ngui简介这是一个GUI排版显示引擎，也是一个跨平台的GUI应用开发框架，基于NodeJS/OpenGL，也是第一个Android/iOS集成的移动端上的NodeJS前端GUI项目，至此JavaScript已经成为真正意义上的前后端通吃的语言。Ngui的目标：在此基础上开发GUI应用程序，既能兼顾Native应用程序的性能和体验，又能拥有开发WEB应用程序的简单和速度。开源跨平台移动项目Ngui【介绍】开源跨平台移动项目Ngui【入门】开源跨平台移动项目Ngui【视图和布局系统】开源跨平台移动项目Ngui【Action动作系统】开源跨平台移动端项目Ngui【CSS样式表规则及用法】NguiAPI文档同宗不同派。这有点类似于Reac-Native。你可能会问为什么要写和React-Native一样的东西。虽然表面上确实有相似之处，但都是用的jsx语法。跨平台，可实现热更新，不基于浏览器webview。但不同的是，Ngui不依赖操作系统的GUI组件，它完全调用标准的OpenGLAPI进行绘图渲染，并为其编写布局引擎，有点类似于浏览器的div+css。几年前开始构思这个框架的时候，效率一直是重中之重。虽然还有很多不足，理想的目标还没有达到，但相信在不久的将来是可以实现的。基于这些特点，作为一个GUI系统，Ngui可以快速移植到任何操作系统，而且对操作系统的专门化会很少。更重要的一点是基于此开发的应用代码可以真正做到跨平台。当然，这并不是批评RN的缺点。相反，RN第一次用一种语言来统一所有平台。这是非常了不起的，这也是我的灵感来源。开始使用Ngui如果您从未使用过ngui，您可以从这里开始并逐步创建您的第一个ngui程序。给大家看一个简单的HelloWorld程序import{GUIApplication,Text}from'ngui'newGUIApplication().start(helloworld!)做过react开发的朋友对这个应该很熟悉了代码，没错，就是facebook发明的JavascriptXML，简称jsx，这段代码可以在你的设备屏幕上显示helloworld！安装Ngui工具包，首先需要安装ngui提供的工具包。该工具包使用nodejs编写，运行依赖python2.7，所以必须先安装nodejs和python。如果你已经安装了它，你可以跳过它。还有一件事需要注意。这个工具暂时只能在mac系统下运行，因为我只在mac系统下测试过，理论上在linux下应该也能运行，大家可以自己试试，但不敢保证它会无错误地运行，但有一件事是肯定的，它现在不能在Windows下运行。最好在mac下运行，因为如果要开发ios，就必须要有mac。要获取这个工具包，可以使用nodejs自带的包管理器npm来安装，打开Terminal，执行以下命令：#shell$sudonpminstall-gngui-tools新建一个Ngui项目你应该已经把它安装在上一步Toolkit现在就用它来创建你的第一个项目吧！使用以下shell命令新建一个ngui项目：#shell#创建项目根目录$mkdirmyproject#进入项目根目录$cdmyproject#使用ngui命令初始化项目目录$nguiinit现在是项目根目录myproject的结构应该是这样的：myprojectexamplesnode_modulesapp.keysexamples是一个示例程序，即在gooleplay和appstore上发布的示例程序。您可以根据此目录结构创建自己的应用程序目录。目前也可以删除，但是删除app.keys的同时对应的key-value需要时间。node_modules目录是运行ngui程序所必需的库文件。库提供的API可以在这里找到http://nodegui.org/doc/app.keys中描述的每个键对应的目录会有更详细的描述。应用程序应用程序。.keys是ngui提供的一种数据格式文件。类似于json格式，可以定义数组和对象。我将在以后的文章中详细解释这种数据格式。在这里跳过它。现在只要知道是一种json格式就行了。你现在看到的目录结构就是ngui的标准项目结构。不管未来ngui支持多少操作系统和平台，这个项目结构都不会改变。构建一个Ngui项目构建一个项目是一个技术术语。其实就是编译打包你的应用。这里会将刚才创建的ngui项目根目录下的js、jsx文件和资源文件进行压缩打包。在要构建的项目根目录下执行如下shell命令：#shell$nguibuild执行命令后，你应该能在项目根目录下看到一个out目录，没错，就是你刚才的那个文件执行了自动生成的命令，这个目录的详细介绍留到后面的章节，这里不是今天的重点。导出工程导出Xcode或AndroidStudio工程，可能有人会问为什么导出第三方工程不跨平台？我说的跨平台是指在运行和编码上都是跨平台的，你最后输出的是.apk包或者苹果的.dmg或者.ipa，所以这个基本的导出工作还是要做的，不好意思，现阶段我还不能给你提供IDE，只能安安心心做好核心。所以既然要导出三方工程，那就自己去百度安装吧，不难，而且这些都是免费的。在项目根目录下执行如下命令：#shell#exportiosXcodeproject$nguiexportios#exportandroidstodioproject$nguiexportandroid命令执行后，会在项目根目录下生成project/ios和project/android分别是Xcode工程和AndroidStudio工程。如果有人想了解Xcode和AndroidStodio如何创建工程，请看这里：Xcode和AndroidStodio导出工程后，可以打开编译调试。如果你安装了Xcode，执行export命令后Xcode会自动打开。这是我的mac机器上项目目录的样子：打开Xcode是这样的：这是打开AndroidStudio的样子：NguiDebuggingServerNguiTools提供了一个远程测试http服务器，你不要'每次修改js或jsx代码都不需要重新安装。将你的应用程序启动地址设置为调试服务器地址，导出项目时工具会自动将启动地址设置为这个调试地址，所以大部分情况不需要修改，除非你想连接到其他地方.执行以下代码启动它：#shell$ngui这个工具现在还不是很完善，它只能做简单的日志显示，不能从终端主动干预你应用程序的运行状态。这是我需要在未来版本中解决的问题。下载这是我编译的Android示例程序apk包。下载地址examples-release.apk也可以到GooglePlay或AppStore搜索AvocadoJS。AvocadoJS是该项目的旧名称。由于项目后来更名了，所以还没有上传到商店。这个在Github源地址ExamplesDemo谢谢大家，未完待续~
