标签分类
当前位置:首页 > 移动开发电子书 > 移动开发电子书网盘下载
跨平台桌面应用开发:基于Electron与NW.js 跨平台桌面应用开发:基于Electron与NW.js
数轼

数轼 提供上传

资源
17
粉丝
6
喜欢
176
评论
16

    跨平台桌面应用开发:基于Electron与NW.js PDF 影印版

    移动开发电子书
    • 发布时间:

    给大家带来的一篇关于移动开发相关的电子书资源,介绍了关于跨平台、桌面应用、开发、Electron、NW.js方面的内容,本书是由电子工业出版社出版,格式为PDF,资源大小419.5 MB,保罗 B. 詹森编写,目前豆瓣、亚马逊、当当、京东等电子书综合评分为:9.4,更多相关的学习资源可以参阅 移动开发电子书、等栏目。

  • 跨平台桌面应用开发:基于Electron与NW.js PDF 下载
  • 下载地址:https://pan.baidu.com/s/1E-lkTGTSn7ODG3W9sxlw7g
  • 分享码:yrq1
  • 跨平台桌面应用开发:基于Electron与NW.js PDF

    传统式桌面上应用程序开发规定懂高級计算机语言及其专业的架构。拥有Electron和NW.js,你能将目前Web开发设计应用到只是应用HTML、CSS和JavaScript就能开发设计的桌面上运用中。并且,开发设计出去的运用还能在Windows、Mac和Linux中工作中,明显降低了开发设计和学习培训的時间。

    这书一步一步具体指导你应用Electron和NW.js来开展桌面上应用程序开发。那份具体指导中包括了很多的实例,教你如何开发设计1个归属于你自身的文件浏览器,详细介绍应用架构出示的API来浏览监控摄像头、剪贴板统计数据,制做能够用电脑键盘操纵的手机游戏及其搭建1个Twitter桌面提醒专用工具。你要会学得怎样检测和调节运用,及其为不一样电脑操作系统将运用装包为二进制文件。

    应用桌面上监控摄像头建立1个自拍照运用

    学习培训怎么使用Devtron来检测Electron运用

    学习培训怎样在你的运用中应用Node.js

    这书是1本一起详细介绍 Electron和 NW.js的书籍,这二者是现阶段时兴的适用应用 HTML、CSS 和 JavaScript 开展桌面上应用程序开发的架构。书中包括很多的编号实例,并且每一实例全是一应俱全的好用运用,创作者对实例中的重要编码都干了十分详尽的表述和表明,可使用户根据具体的编号感受应用这几款架构开发设计桌面上运用的进一步体会。此外,在內容上,这书十分系统软件,分成4绝大多数:第1一部分详细介绍2个架构的时代背景,并教大伙儿撰写*个桌面上运用,让用户对这2个架构有个基本的体会;第 2一部分深层次解读 NW.js和 Electron 的內部原理,协助大伙儿分析这2个架构的最底层体制,让用户对他们有更深层次的了解;第 3一部分详细介绍应用架构出示的很多 API 来搭建几款好用的桌面上运用,多方位地让用户感受应用这2个架构开发设计桌面上运用产生的舒服感受;第 4一部分为大伙儿解读了,当开发设计进行后,怎样对运用开展检测、平台装包和公布。能够说这 4一部分结合在一起将开发设计桌面上运用的全部步骤专业化地解读得十分清晰、及时。坚信融合书中很多的实例,用户必须能迅速把握并自身应用 Electron和 NW.js搭建出平台的桌面上运用。

    目录

    • 第1部分 欢迎来到.Node.js.桌面应用开发的世界
    • 第1章 Electron和NW.js入门 .3
    • 1.1 为什么要用.Node.js.构建桌面应用.4
    • 1.1.1 桌面应用到.Web.应用,再回到桌面应用  .4
    • 1.1.2 Node.js.桌面应用相比.Web.应用有什么优势  .6
    • 1.2 NW.js.和.Electron.的起源 .8
    • 1.3 NW.js.介绍  .9
    • 1.3.1 使用.NW.js.构建.Hello.World.应用   .10
    • 1.3.2 NW.js.有哪些特性.15
    • 1.4 Electron.介绍  .18
    • 1.4.1 Electron.是如何工作的以及它和.NW.js.的区别是什么 .19
    • 1.4.2 使用.Electron.开发.Hello.World.应用   .19
    • 1.4.3 Electron.有哪些特性.25
    • 1.5 NW.js.和.Electron.支持创建哪类应用   .25
    • 1.5.1 Slack  .26
    • 1.5.2 Light.Table .26
    • 1.5.3 Game.Dev.Tycoon .27
    • 1.5.4 Gitter  .28
    • 1.5.5 Macaw  .29
    • 1.5.6 Hyper  .30
    • 1.6 小结   .31
    • 第2章 为你的首款桌面应用搭建基础架构.32
    • 2.1 我们将构建什么应用 .33
    • 2.2 创建应用  .34
    • 2.2.1 安装.NW.js.和.Electron.34
    • 2.2.2 为.NW.js.版本的应用创建文件和文件夹  .35
    • 2.2.3 为.Electron.版本的应用创建文件和文件夹  .37
    • 2.3 实现启动界面  .39
    • 2.3.1 在工具条中展示用户个人文件夹信息   .40
    • 2.3.2 显示用户个人文件夹中的文件和文件夹  .44
    • 2.4 小结   .54
    • 第3章 构建你的首款桌面应用 .56
    • 3.1 浏览文件夹  .57
    • 3.1.1 重构代码 .57
    • 3.1.2 处理对文件夹的双击操作.61
    • 3.2 实现快速搜索  .64
    • 3.2.1 在工具条中增加搜索框.65
    • 3.2.2 引入一个内存搜索库.65
    • 3.2.3 在界面上触发搜索功能.67
    • 3.3 改进应用内的导航功能 .71
    • 3.3.1 实现当前文件夹路径可单击    .71
    • 3.3.2 让应用随着文件夹路径的改变显示对应的文件夹内容 .74
    • 3.3.3 实现使用默认应用打开对应的文件   .75
    • 3.4 小结   .77
    • 第4章 分发你的首款桌面应用 .79
    • 4.1 对应用进行与分发相关的设置.80
    • 4.2 对要分发的应用进行打包.83
    • 4.2.1 使用一种.NW.js.的构建工具   .83
    • 4.2.2 使用一种.Electron的构建工具   .84
    • 4.2.3 设置应用的图标 .85
    • 4.3 在多个操作系统中测试应用.91
    • 4.3.1 Windows.操作系统.91
    • 4.3.2 Linux.操作系统 .92
    • 4.3.3 Mac.OS.系统 .92
    • 4.4 小结   .92
    •  
    • 第2部分 深度剖析
    • 第5章 在NW.js和Electron中使用Node.js.97
    • 5.1 什么是.Node.js  .98
    • 5.1.1 同步与异步 .98
    • 5.1.2 流是一等公民 .101
    • 5.1.3 事件  .105
    • 5.1.4 模块  .106
    • 5.2 Node.包管理器 .109
    • 5.2.1 寻找应用需要的模块.109
    • 5.2.2 使用.package.json记录安装的模块   .109
    • 5.2.3 使用.npm.打包模块和应用.111
    • 5.3 小结   .114
    • 第6章 探索NW.js和Electron的内部机制.115
    • 6.1 NW.js.内部是如何工作的 .116
    • 6.1.1 使用同一个.V8.实例.117
    • 6.1.2 集成主事件循环 .118
    • 6.1.3 桥接.Node.js.和.Chromium.的.JavaScript.上下文 .119
    • 6.2 Electron.内部是如何工作的.119
    • 6.2.1 libchromiumcontent.介绍.120
    • 6.2.2 Electron.中的组件.120
    • 6.2.3 Electron.是如何将应用运行起来的   .121
    • 6.3 Node.js是如何与NW.js以及Electron一起工作的  .122
    • 6.3.1 Node.js.集成在.NW.js.的哪个位置   .122
    • 6.3.2 在.NW.js中使用.Node.js.的缺点   .123
    • 6.3.3 Electron.是怎么使用.Node.js.的   .123
    • 6.4 小结   .124
    • 第3部分 精通Node.js桌面应用开发
    • 第7章 自定义桌面应用的外观.127
    • 7.1 视窗的尺寸和模式 .127
    • 7.1.1 配置.NW.js.应用的视窗尺寸   .128
    • 7.1.2 配置.Electron.应用的视窗尺寸   .129
    • 7.1.3 在.NW.js.中限制视窗的尺寸   .131
    • 7.1.4 在.Electron.中限制视窗的尺寸   .133
    • 7.2 无边框应用以及全屏应用.134
    • 7.2.1 NW.js.中的全屏应用.135
    • 7.2.2 Electron.中的全屏应用.138
    • 7.2.3 无边框应用 .140
    • 7.2.4 kiosk.应用 .145
    • 7.3 小结   .149
    • 第8章 创建托盘应用 .150
    • 8.1 使用.NW.js.创建简单的托盘应用.151
    • 8.2 使用.Electron.创建托盘应用.156
    • 8.3 小结   .159
    • 第9章 创建应用菜单以及上下文菜单.161
    • 9.1 为应用添加菜单 .162
    • 9.1.1 应用视窗菜单 .162
    • 9.1.2 使用.NW.js.为.Mac.OS的应用创建菜单  .162
    • 9.1.3 使用.Electron.为.Mac.OS的应用创建菜单  .163
    • 9.1.4 为.Windows.和.Linux的应用创建菜单  .166
    • 9.1.5 基于操作系统来选择渲染具体的菜单  .173
    • 9.2 上下文菜单  .174
    • 9.2.1 使用.NW.js.创建上下文菜单   .174
    • 9.2.2 NW.js.中的上下文菜单是如何工作的  .179
    • 9.2.3 设置菜单项图标 .180
    • 9.2.4 使用.Electron.创建上下文菜单   .181
    • 9.2.5 使用.Electron.添加上下文菜单   .184
    • 9.3 小结   .185
    • 第10章 拖曳文件以及定制界面.186
    • 10.1 在应用中拖曳文件 .186
    • 10.1.1 使用.NW.js.实现在应用中拖曳文件  .187
    • 10.1.2 使用.Electron.实现拖曳功能   .190
    • 10.2 模拟操作系统原生样式.191
    • 10.2.1 检测用户的操作系统.191
    • 10.2.2 使用.NW.js检测操作系统   .191
    • 10.2.3 使用.Electron检测操作系统   .192
    • 10.2.4 使用.CSS匹配用户操作系统的样式  .194
    • 10.3 小结  .197
    • 第11章 在应用中使用网络摄像头.198
    • 11.1 使用.HTML5.媒体捕捉.API.来实现相片快照  .198
    • 11.1.1 解读.NW.js.版的应用.199
    • 11.1.2 使用.Electron.构建.Facebomb.应用  .205
    • 11.2 小结  .210
    • 第12章 存储应用数据 .211
    • 12.1 应该使用哪种数据存储方案.211
    • 12.2 使用.localStorage.API.存储便笺数据   .212
    • 12.2.1 使用.Electron开发.Let.Me.Remember应用  .213
    • 12.2.2 使用.NW.js开发.Let.Me.Remember应用  .216
    • 12.3 将待办事项应用移植为桌面应用    .219
    • 12.3.1 使用.NW.js.移植.TodoMVC.Web.应用  .219
    • 12.3.2 使用.Electron.移植.TodoMVC.应用   .220
    • 12.4 小结  .222
    • 第13章 从剪贴板复制和粘贴数据.223
    • 13.1 访问剪贴板数据 .223
    • 13.1.1 使用.NW.js.创建.Pearls.应用   .224
    • 13.1.2 使用.Electron.创建.Pearls.应用   .228
    • 13.1.3 使用.Electron.将不同类型的数据写入剪贴板 .231
    • 13.2 小结  .232
    • 第14章 绑定键盘快捷键 .233
    • 14.1 使用.NW.js.创建贪吃蛇游戏.234
    • 14.1.1 使用.NW.js.在视窗获取焦点的时候实现键盘快捷键 .242
    • 14.1.2 使用.NW.js.来创建全局键盘快捷键  .243
    • 14.2 使用.Electron.为贪吃蛇游戏创建全局快捷键  .245
    • 14.3 小结  .247
    • 第15章 制作桌面通知 .248
    • 15.1 关于你要构建的应用 .249
    • 15.2 使用.Electron.构建.Watchy.应用.249
    • 15.3 使用.NW.js.构建.Watchy.应用.254
    • 15.4 小结  .257
    •  
    • 第4部分 准备发布
    • 第16章 测试桌面应用 .261
    • 16.1 测试应用的不同方法 .262
    • 16.1.1 测试驱动开发 .262
    • 16.1.2 行为驱动开发 .264
    • 16.1.3 不同层面的测试.265
    • 16.2 单元测试  .265
    • 16.2.1 使用.Mocha.编写测试.266
    • 16.2.2 让待完成的测试变成执行通过的测试  .268
    • 16.3 功能测试  .271
    • 16.3.1 功能测试实践 .272
    • 16.3.2 使用.NW.js.和.ChromeDriver.进行测试  .272
    • 16.4 使用Spectron测试Electron应用.273
    • 16.5 集成测试  .275
    • 16.5.1 Cucumber.介绍.276
    • 16.5.2 使用.Cucumber和.Spectron对.Electron应用进行自动化测试.277
    • 16.6 小结  .280
    • 第17章 调试并提升应用性能 .281
    • 17.1 了解你要调试的是什么.282
    • 17.1.1 确定问题根本原因的位置   .283
    • 17.1.2 使用浏览器开发者工具进行调试   .284
    • 17.2 修复.bug  .287
    • 17.2.1 使用.Node.js.的调试器来调试应用   .288
    • 17.2.2 使用.NW.js.的开发者工具来调试应用  .291
    • 17.3 解决性能问题 .296
    • 17.3.1 Network选项卡.296
    • 17.3.2 Timeline选项卡.297
    • 17.3.3 Pro.les选项卡.299
    • 17.4 调试.Electron.应用 .301
    • 17.5 小结  .307
    • 第18章 为多平台打包应用 .308
    • 18.1 为应用创建可执行文件.309
    • 18.1.1 为.Windows.系统创建.NW.js.应用的可执行文件 .309
    • 18.1.2 安装虚拟机 .309
    • 18.1.3 为一个.NW.js应用创建针对.Windows系统的.exe文件.310
    • 18.1.4 为一个.Electron.应用创建.Windows.系统的可执行文件 .311
    • 18.2  为.Windows.的应用创建启动安装器   .314
    • 18.2.1 使用.NW.js.创建.Windows.系统启动安装器  .314
    • 18.2.2 使用.Electron创建.Windows系统启动安装器 .321
    • 18.3 为.Mac.OS.创建.NW.js.应用的可执行文件   .324
    • 18.3.1 创建.Mac.可执行应用.324
    • 18.3.2 为.Mac.OS.创建.Electron.应用的可执行文件  .327
    • 18.4 为.Linux.创建可执行应用.329
    • 18.4.1 为.Linux.创建独立的.NW.js.应用文件  .330
    • 18.4.2 为.Linux.创建独立的.Electron.应用文件  .331
    • 18.5 小结  .333
    • 附录A 安装.Node.js .335

    上一篇:智能物联网项目开发实战  下一篇:大规模分布式存储系统:原理解析与架构实战

    展开 +

    收起 -

    码小辫二维码
     ←点击下载即可登录

    移动开发相关电子书
    学习笔记
    网友NO.849542

    使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)

    现在什么都讲究追赶潮流,觉得 QQ 登录窗口做的效果不错,既然刚学习 electron ,那么就用 electron 模仿一下。其实主要用到的就是 CSS3 的效果:边框圆角、阴影,3D变换。对,就这么简单。先上效果: 下面是关键代码: app.js 'use strict';const { app, BrowserWindow } = require('electron')const path = require('path')const url = require('url')// Keep a global reference of the window object, if you don't, the window will// be closed automatically when the JavaScript object is garbage collected.let winfunction createWindow() { // Create the browser window. win = new BrowserWindow({ width: 495, height: 470, /*skipTaskbar: true,*/ frame: false, resizable: false, transparent: true, show: false, alwaysOnTop: true }) win.once('ready-to-show', () = { win.show() }) // and load the index.html of the app. win.loadURL(url.format({ pathname: path.join(__dirname, '/app/index.html'), protocol: 'file:', slashes: true })) // Open the DevTools. //win.webContents.openDevTools() // Emitted when the window is closed. win.on('closed', () = { // Dereference the window object, usually you would store windows // in an array if your app supports multi windows, this is the time // when you should delete the corresponding element. win = null })}//app.disableHardwareAcceleration();// This method will be called when Electron has finished// initialization and is ready to create browser windows.// Some APIs can only be used after this event……

    网友NO.352603

    使用electron实现百度网盘悬浮窗口功能的示例代码

    相关依赖 里面使用了vuex vue vue-route storeJs storeJs 用来持久化vuex状态 展示 介绍说明 没有使用electron内置的 -webkit-app-region: drag 因为使用他那个有很多问题 比如事件无法使用 右键无法使用 以及不能使用手型等! 安装 安装的时候没有截图 所以就参考下我其他的文章吧 storeJs 安装 npm install storejs 准备写代码 配置路由文件 export default new Router({ routes: [ {path: '/', name: 'home', component: ()= import('@/view//home')}, {path: '/suspension', name: 'suspension', component: ()= import('@/view/components/suspension')} ]}) 写悬浮窗页面 页面路径 /src/renderer/view/components/suspension.vue template div id="suspension" div class="logo"/div div class="content_body" div class="upload"拖拽上传/div /div /div/templatescript export default { name: "suspension", mounted() { let win = this.$electron.remote.getCurrentWindow(); let biasX = 0; let biasY = 0; let that = this; document.addEventListener('mousedown', function (e) { switch (e.button) { case 0: biasX = e.x; biasY = e.y; document.addEventListener('mousemove', moveEvent); break; case 2: that.$electron.ipcRenderer.send('createSuspensionMenu'); break; } }); document.addEventListener('mouseup', function () { biasX = 0; biasY = 0; document.removeEventListener('mousemove', moveEvent) }); function moveEvent(e) { win.setPosition(e.screenX - biasX, e.screenY - biasY) } } }/scriptstyle * { padding: 0; margin: 0; } .upload { height:……

    网友NO.880386

    Nodejs 和 Electron ubuntu下快速安装过程

    查找时间管理软件的时候发现了superProductivity这个程序,使用electron进行开发,于是看了一下介绍,手痒了,尝试进行环境搭建,一下步慢慢补齐前端知识吧 nodejs安装 nodejs的版本更新较快,所以可能一个系统上存在多个版本,管理工具也可以多种多样,我选择使用nvm进行安装,一个原因是管理简单,另外一个是不用先安装nodejs再进行升级。 1.安装nvm 先查看nvm的版本,然后替换下列脚本地址中的版本信息获得nvm curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.10/install.sh | bash 2.查看nvm版本 nvm -v 3.如果出现找不到nvm,一般应该为配置问题,在 ~/.bash.rc ~/.profile or ~/.bash_profile 检查是否有如下话语, export NVM_DIR="/home/carl/.nvm"[ -s "$NVM_DIR/nvm.sh" ] . "$NVM_DIR/nvm.sh" # This loads nvm 4.安装node 查看可安装node的版本 nvm ls-remote 当然安装可以使用多种方法如 ××安装稳定版 nvm install stable ××安装特定版本,版本号可以从上面的查看版本里的结果找 nvm install 8.11.1 ××查看当前node 版本 nvm current ××查看所有node版本 nvm ls ××切换使用版本 nvm use 8.11.1 安装electron 网上很多安装electron使用的是npm,但是我这里执行是有问题的,安装失败,提示是权限问题,我已经使用sudo进行安装了,可能是网络或者配置那里没对吧,没必要在这上面进行纠结,查看了网上的方……

    网友NO.371884

    Electron + vue 打包桌面操作流程详解

    提前准备一个vue项目,也可以使用初始的vue项目 vue init webpack 安装到后边有的会出现报错,可以忽略,启动 npm run dev 启动成功就可以 在vue项目下执行下载以下依赖,会用到 cnpm install electron --save-devcnpm install electron-packager --save-dev //这个是打成exe文件的插件,之后要用,提前下载好 获取Electron的资源 git clone https://github.com/electron/e...cd electron-quick-startcnpm install //这里我用的是cnpm,npm太慢了 将Electron获取到资源的main.js复制到vue里面的bulid里面并修改为electron.js 然后修改 将assetsPublicPath: '/' 改为./,都是为了获取准确的路径 然后再修改electron.js 改为 这个 pathname: path.join(__dirname, '../dist/index.html') 不懂的可以去搜vue 的 dist 这些改好了之后配置package.json 用来启动 npm run abc 启动成功为 启动成功可以执行下一步 在配置打包的package.json 关于electron-packager的配置,简单介绍一下。 electron-packager sourcedir appname --platform=platform --arch=arch [optional flags...] sourcedir 资源路径,在本例中既是./dist/ appname 打包出的exe名称 platform 平台名称(windows是win32) arch 版本,本例为x64 到这里还没有完因为还有坑呢 我就把坑跳过 将bulid的electron.js文件复制到dist中,将package.json也复制到当中(提示dist文件和里面内容自动生成不用自己创建) 然后修改electron.js mainWindow.lo……

    Copyright 2018-2019 xz577.com 码农之家

    版权责任说明