效果如下图
原生的如下图（原生的用在自己的app上面太丑了，并且还带边框，所以重写了左上角的三个功能键）
1.首先了解一下nw底下的package.json 文件
{
"name": "nw-quick-start-demo", //（字符串）包的名字，必须为独一无二的，可由字母，数字，下划线组成，不能有空格。（
"version": "0.0.1",
"main": "app/test/dist/index.html",//字符串）当node-webkit打开时的默认页面。
"single-instance":false,
"node.js": true, //（布尔型）nodejs是否node-webkit中启用。
"window": { //控制窗口的样子
"icon": "app/images/logo.png", //（字符串）图标的路径。
"toolbar": true, //（布尔值）是否显示工具栏。
"title": "zm", //（字符串）默认打开的窗口的名字。
"resizable":true, //（字符串）只可能是这么几个值null center mouse。null指无定位，center指在显示器中间，mouse指在鼠标的位置。
"show_in_taskbar":true, //（布尔值）是否在任务栏上显示。
"position": "center",
"frame": false, //（布尔值）是否显示窗口框架。
"width": 430, //定义窗口的宽高
"height": 350,
"resizable":false //（布尔值）窗口是否可调整大小。
},
"webkit": { //控制webkit特性是否启用
"plugin": true
},
"dependencies": {
"vue-router": "^2.3.0"
}
}
2.无窗口模式下实现可以拖拽
如果frame 为false的话。程序将无边框显示。无边框显示则无法执行拖拽等功能。
可以设置以下代码让窗口可以拖拽
body
{
-webkit-user-select:none;
-webkit-app-region:drag;
}
但是统一在body加上这个样式的话可以拖拽了，但是所有点击等事件都会失去焦点了。
解决方法：就是在头部header元素加上可以拖拽样式。但是header里面的按钮等带有事件的元素加上样式【-webkit-app-region:no-drag;】让带有事件的元素可以点击。
3.无窗口模式下实现窗口最大化最小化关闭等 窗口功能键
html代码写好样式（项目中使用vue和ES6 所以事件的调用方法是用vue的）
<div id="toolBtns" class="noDrag" @click="focusWindow()"> //功能键上必须加上不可以拖拽样式，不然点击没有反应
<a href="javascript:;" class="noDrag" @click="miniWindow()"><i id="minisizeBtn"></i></a>
<a href="javascript:;" class="noDrag mr-10 ml-10" @click="resizeWindow()"><i id="resizeBtn"></i> </a>
<a href="javascript:;" class="noDrag" @click="closeWindow()"><i id="closeBtn"></i> </a> </div>
js实现
//node-webkit带有丰富的api，可以直接调用api来调整窗口
var gui = require('nw.gui'); //要访问api 首先需要先加载“nw.gui”模块
var win = gui.Window.get(); //需要将其功能添加到窗口 用get(),通过win.则可获取窗口对象
var flag=1;
console.log(gui);
win.on('resize', function () { //resize对象在窗体大小被重置时触发的事件。把标志放在resize中改变大小，
//目的是为了不让拖拽让窗口变大变小后影响 最大化最小化功能键的功能
if(flag==1) {
flag=0;
}else {
flag=1;
}
})
//功能键点击事件
miniWindow() { //实现窗口的最小化
win.minimize();
},
closeWindow() { //实现窗口的关闭
win.close();
},
resizeWindow() { //实现窗口的最大化最小化，通过全局的flag来控制不受拖拽影响
if(flag==1) {
//win.enterFullscreen();
win.maximize(); //窗口最大化事件。
}else {
win.restore(); //恢复窗口到上一状态。
}
},
注意：如果功能键事件没有写在启动文件里面时，加载“nw.gui”模块 依旧需要写在启动文件里面，不然获取不到！
附上nw.js的中文学习文档 https://wizardforcel.gitbooks.io/nwjs-doc/content/wiki/index.html共勉。