
nw.js桌面应用开发
nwjs是在英特尔开源技术中心创建的,它是基于谷歌浏览器核心引擎和nodejs运行,你可以通过nwjs技术使用html和js语言编写本地应用程序,它也可以让你直接从DOM调用nodejs模块,使用一种新的方式与所有的Web技术编写本地应用
黄泽平
深耕前端,努力前进!
展开
-
nw.js node-webkit系列(1)简单介绍及应用
最近使用到了一种nwjs技术进行开发,实际上nwjs是基于nodejs的,它支持nodejs所有的api,主要用于跨平台轻量级桌面应用开发,运行环境包括32位和64位的Window、Linux和Mac OS。在博主看来,nwjs技术实际上就是结合web前端技术编写本地应用的一种技术。截止现在,nwjs最新的稳定版本是v0.12.3,基本上只要熟悉HTML5、JS 和CSS3的开发者们都可以轻松上手原创 2016-02-23 18:34:18 · 12114 阅读 · 5 评论 -
nw.js node-webkit系列(2)nwjs相关教程
本节主要给大家介绍一些关于nwjs的相关教程,尽管大多都是英文,若有些连接打不开,如youtube,你懂的怎么打开,是么?书本(1)NW.js in Action by Paul. B. Jensen地址:https://www.manning.com/books/nw-js-in-action(点击打开链接)(2)Windows Desktop App Creatio原创 2016-02-24 11:01:14 · 5336 阅读 · 1 评论 -
nw.js node-webkit系列(3)基本程序结构与配置
本节开始,部分内容参照我们的nwjs前辈玄魂的文章,其中也会加入博主在使用nwjs开发项目过程中总结的一些实战经验。我们都是站在巨人的肩上继续努力学习,去其糟粕留其精华,好的技术就应该不断总结和传播,那么我们现在开始吧!基本程序结构原创 2016-02-24 14:13:51 · 14200 阅读 · 3 评论 -
nw.js node-webkit系列(4)Native UI API 概述和应用规范
本节主要介绍Native UI API 概述和应用规范,在后续节中再详细介绍Native UI API的主要控件接口。Native UI API,是提供了在代码中访问、控制应用程序界面显示的接口。常见用途是用户通过操作应用显示界面的控件便捷地实现自己想要的服务。(一)概述这里是我们在node-webkit下创建Native UI控件的APIs。实际上,去使用我们的Native原创 2016-02-24 15:53:29 · 3683 阅读 · 0 评论 -
nw.js node-webkit系列(5)Native UI API Window的使用
本节主要介绍Native UI API中Window的基本使用方法。简单的说,Window就是使用nwjs开发的应用程序在桌面显示的容器(窗口)。node-webkit >= v0.3.0才支持Window API,Window是在DOM Window的基础上进行封装,它扩展了DOM Window的操作,同时可以接收各类的窗口事件。每一个window都继承 了node.js中的 EventEm原创 2016-02-25 11:17:04 · 13811 阅读 · 13 评论 -
nw.js node-webkit系列(6)Native UI API Frameless window的使用
本节主要讲无边框窗口。Frameless window,是没有操作系统默认样式的边框的窗口,也就意味着最大、最小和关闭按钮也访问不到,同时默认情况下窗口不能被拖拽。但你可以使用上一节的知识对无边框窗口进行操作。无边框窗口例子:(一)设置无边框窗口只要你在package.json的window区域做如下参数设置,即可设置无边框窗口:{ "window": {原创 2016-02-25 14:13:38 · 5144 阅读 · 1 评论 -
nw.js node-webkit系列(7)Native UI API Menu的使用
本节主要介绍Native UI API 中菜单栏的使用,菜单栏分为两类:一类是普通菜单栏,另一类是上下文菜单栏(右键弹出)。(一)例子 menuDemo menu api 测试 // Load native UI library var gui = require('nw.gui'); var win = gui.Window.get(原创 2016-02-25 15:35:09 · 3537 阅读 · 0 评论 -
nw.js node-webkit系列(8)Native UI API MenuItem的使用
菜单项MenuItem在菜单里代表其中一个选项。它可以作为分割线也可以作为一个普通的选项,但它必须具备标题和图标,菜单项通常情况下会跟菜单Menu一起使用。(一)例子// Load native UI libraryvar gui = require('nw.gui');var item;// Create a separatoritem = new gui.MenuItem({原创 2016-02-25 16:58:24 · 2744 阅读 · 0 评论 -
nw.js node-webkit系列(9)Native UI API App的使用
本节主要介绍Native UI API 的 App使用,APP类别的API 是针对当前正在运行的应用程序实例,即获取应用的相关信息,启动应用时的传参及应用运行过程中的底层控制等。(一)例子// Load native UI libraryvar gui = require('nw.gui');// Print argumentsconsole.log(gui.App.argv);原创 2016-02-29 11:41:36 · 7965 阅读 · 4 评论 -
nw.js node-webkit系列(10)Native UI API Clipboard的使用
Clipboard是对操作系统剪贴板的一个抽象,目前只支持获取和设置纯文本内容。(一)例子// Load native UI libraryvar gui = require('nw.gui');// We can not create a clipboard, we have to receive the system clipboardvar clipboard = gui.C原创 2016-02-29 13:55:45 · 2484 阅读 · 0 评论 -
nw.js node-webkit系列(11)Native UI API Tray的使用
托盘在不同操作系统下有不同控制的抽象。它通常存在于系统的通知区域,在苹果系统成为状态项,在GTK称为状态图标,在Window系统下称为系统托盘图标。(一)例子 var isShowWindow = true; // Load native UI library var gui = require('nw.gui'); var win = gui.Window.get(); var原创 2016-02-29 15:09:19 · 2702 阅读 · 0 评论 -
nw.js node-webkit系列(12)Native UI API File dialogs的使用
本地应用一个很重要的因素就是使用本地文件对话框能力。HTML5对文件对话框提供了有限的支持,你可以使用<input type='file' /> 让用户上传文件。但是对node-webkit是远远不够的,我们扩展了input。原创 2016-03-01 15:20:16 · 4918 阅读 · 1 评论 -
nw.js node-webkit系列(13)Native UI API 其它
本节主要介绍Native UI API中一些不常用的功能,包括Shell、Handling files and arguments、Screen。(一)ShellShell主要用来处理桌面相关应用的工作。如使用默认浏览器打开一个网页地址、使用文本的方式打开一个文件、在文件资源管理器中打开文件。// Load native UI library.var gui = require('n原创 2016-03-02 14:15:18 · 5873 阅读 · 1 评论 -
nw.js node-webkit系列(14)不同系统环境下如何启动node-webkit APP
本节将介绍node-webkit 应用分别在Windows、Linux和Mac OS环境下如何启动。node-webkit可以通过两种方式启动:1)通过文件夹,将启动路径指向文件夹2)通过.nw文件(即ZIP压缩包),将启动路径指向.nw文件无论哪种方式启动,应用都需要包含package.json文件,当node-webkit启动时这个文件将会被解析。如果这个文件丢失,node-w原创 2016-03-02 17:50:23 · 5130 阅读 · 0 评论 -
nw.js node-webkit系列(15)如何使用内部模块和第三方模块进行开发
在Node.js中有三种模块类型:1)内部模块(部分Node API)2)用JavaScript写的第三方模块3)C/C++插件的第三方模块这些所有的模块类型,都在会在node-webkit中使用到。你可以在Node's wiki中找到很多这方面的资料和开源代码。如https://github.com/nodejs/node-v0.x-archive/wiki/Module原创 2016-03-03 14:14:03 · 12485 阅读 · 0 评论 -
nw.js node-webkit系列(16)可能会遇到的故障及故障排除
本篇将介绍开发者在使用node-webkit中可能会遇到的故障。(1)Audio故障媒体文件在node-webkit开发中应该有用到,常遇到的问题是MP3格式和其他非自由媒体格式的编码器问题。详细请查看:https://github.com/nwjs/nw.js/wiki/Using-MP3-%26-MP4-%28H.264%29-using-the--video--%26--audi原创 2016-03-03 15:59:40 · 16667 阅读 · 0 评论 -
nw.js node-webkit系列(17)怎样打包和分发你的应用
本节将介绍你完成你的应用后,如何将其打包和分发给你的用户,接下来我们我们一步步来进行。(一)额外的文件准备下面文件作为子目录可以放在应用的根目录中:(1)node_modules目录-如果你有使用到第三方模块进行开发,可以放在这个目录下。(2)plugins目录-用来放置插件文件。你不需要放置nwsnapshot文件到你的下载包中(nwsnapshot应该是nw.exe存在前的原创 2016-03-04 14:51:15 · 14286 阅读 · 9 评论 -
nw.js node-webkit系列(18)怎么对.js进行编译以防你的代码暴露出来
本节将介绍如何将你应用的js代码进行编译及编译后的文件如何在你的项目内使用。(一)编译在nw执行程序目录下,有一个nwjc.exe的应用程序,该程序就是用来编译.js文件的,请看编译命令行:nwjc source.js binary.bin(二)使用如要在应用中使用编译好的.bin文件,请使用下列语句:require('nw.gui').Window.get().e原创 2016-03-07 14:49:22 · 8925 阅读 · 6 评论 -
nw.js node-webkit系列(19)开发者必看:nw.js快速开发解决方案
本节将介绍一个node-webkit敏捷开发的神器,一旦用上了就能让你爱不释手。该神器就是,只需当你在js编辑器中进行保存操作,最终结果便会同步显示在nw.exe执行程序中,这意味着nw.exe只需打开一次且不用刷新即可看到程序修改结果。(一)基本解决方案你只需在你的主文件中添加以下语句,即可实现显示同步: var path = './'; var fs = require原创 2016-03-07 17:36:56 · 3935 阅读 · 0 评论 -
nw.js node-webkit系列(20)拖动文件到页面并读取文件信息
node-webkit支持把文件直接拖动到页面,并获取文件绝对路径,再通过node.js的fn模块打开相应文件的方法。如果想要获取拖动到页面的文件路径,请参考下面的例子: #holder { border: 10px dashed #ccc; width: 300px; height: 300px; margin: 20px原创 2016-04-07 11:14:50 · 2849 阅读 · 0 评论 -
nw.js node-webkit系列(21)在应用中如何数据持久化
在本地应用中数据持久化是很常见的,人们常使用嵌入外部数据库或写入txt文本的方式来保存数据。然而,在node-webkit有更好的选择,你可以独立使用Web SQL Database, embedded databases, Web Storage 或者 Application Cache 而没有任何额外的依赖。另外,nw.js提供了App.dataPath的方法可以准确获取到应用存储在本地的原创 2016-04-07 15:08:55 · 5844 阅读 · 0 评论 -
nw.js node-webkit系列(22).nw执行过程及如何获取.nw真实路径
本章节将以实际应用为例子,介绍.nw应用的运行过程及如何获取.nw应用的相关路径,如何获取其关联子.nw应用的绝对路径。.nw应用的执行过程当我们把.nw应用拖进nw.exe或者将两者打包成一个app.exe执行的时候,我们的应用文件是怎么执行打开的呢?现在已博主所用运行环境为例:电脑系统:win8.1;nw版本:0.12;测试应用:app.nw。当我们按上述操作运行app.nw时原创 2016-05-20 15:10:52 · 9093 阅读 · 0 评论 -
nw.js node-webkit系列(23)如何检查任务管理器运行了哪些进程
在进行NW开发的时候,可能有的需求:检查系统当前运行了哪些进程,并与该进程进行交互的功能。以window环境为例:主要思路是通过调用命令行语句进行实现,代码如下: /** * 检测某APP是否存在 */ var appHasExits = function(callBack) { var cmd = process.platform == 'win32' ? 'tasklist'原创 2016-08-12 18:04:59 · 3123 阅读 · 0 评论 -
nw.js node-webkit系列(24)如何对本地文件读写
本节主要介绍nw内置API"文件系统fs"的使用。调用方法为require("fs");该API可以读取或写入本地磁盘文件或文件夹,实现对本地文件的控制权限。该控制权限仅限于用户电脑账户的普通账户权限,不具备管理员账户权限,意味着如果不通过授权,该方法实现的文件读写对具有管理员权限的文件或文件夹不起效用。(一)require("fs") Demo require("fs原创 2016-08-16 17:21:21 · 10640 阅读 · 0 评论 -
nw.js node-webkit系列(25)child_process中spawn和exec方法的使用
child_process是nw.exe的一个内置模块,通过它可以实现创建多线程,并可实现主线程和子线程之间的通信。child_process模块中主要使用有两个方法spawn和exec,这两个方法都可以用来创建子线程。除了spawn和exec外,child_process模块模块还有execFile,fork,spawnSync,execFileSync,execSync几个方法,都是基于spa原创 2016-08-17 14:41:40 · 6230 阅读 · 1 评论