Merge pull request #3867 from WenryXu/master
docs: Fix markdown code language
This commit is contained in:
commit
b269485d37
3 changed files with 43 additions and 43 deletions
|
@ -14,14 +14,14 @@ Windows 和 OS X 提供获取最近文档列表的便捷方式,那就是打开
|
||||||
|
|
||||||
为了增加一个文件到最近文件列表,你可以使用 [app.addRecentDocument][3] API:
|
为了增加一个文件到最近文件列表,你可以使用 [app.addRecentDocument][3] API:
|
||||||
|
|
||||||
````
|
```javascript
|
||||||
var app = require('app');
|
var app = require('app');
|
||||||
app.addRecentDocument('/Users/USERNAME/Desktop/work.type');
|
app.addRecentDocument('/Users/USERNAME/Desktop/work.type');
|
||||||
````
|
```
|
||||||
或者你也可以使用 [app.clearRecentDocuments][4] API 来清空最近文件列表。
|
或者你也可以使用 [app.clearRecentDocuments][4] API 来清空最近文件列表。
|
||||||
````
|
```javascript
|
||||||
app.clearRecentDocuments();
|
app.clearRecentDocuments();
|
||||||
````
|
```
|
||||||
## Windows 需注意
|
## Windows 需注意
|
||||||
为了这个特性在 Windows 上表现正常,你的应用需要被注册成为一种文件类型的句柄,否则,在你注册之前,文件不会出现在跳转列表。你可以在 [Application Registration][5] 里找到任何关于注册事宜的说明。
|
为了这个特性在 Windows 上表现正常,你的应用需要被注册成为一种文件类型的句柄,否则,在你注册之前,文件不会出现在跳转列表。你可以在 [Application Registration][5] 里找到任何关于注册事宜的说明。
|
||||||
|
|
||||||
|
@ -34,7 +34,7 @@ OS X 可以让开发者定制自己的菜单,通常会包含一些常用特性
|
||||||
[Dock menu of Terminal.app][6]
|
[Dock menu of Terminal.app][6]
|
||||||
|
|
||||||
使用 `app.dock.setMenu` API 来设置你的菜单,这仅在 OS X 上可行:
|
使用 `app.dock.setMenu` API 来设置你的菜单,这仅在 OS X 上可行:
|
||||||
````
|
```javascript
|
||||||
var app = require('app');
|
var app = require('app');
|
||||||
var Menu = require('menu');
|
var Menu = require('menu');
|
||||||
var dockMenu = Menu.buildFromTemplate([
|
var dockMenu = Menu.buildFromTemplate([
|
||||||
|
@ -46,7 +46,7 @@ var dockMenu = Menu.buildFromTemplate([
|
||||||
{ label: 'New Command...'}
|
{ label: 'New Command...'}
|
||||||
]);
|
]);
|
||||||
app.dock.setMenu(dockMenu);
|
app.dock.setMenu(dockMenu);
|
||||||
````
|
```
|
||||||
|
|
||||||
## 用户任务(Windows)
|
## 用户任务(Windows)
|
||||||
在 Windows,你可以特别定义跳转列表的 `Tasks` 目录的行为,引用 MSDN 的文档:
|
在 Windows,你可以特别定义跳转列表的 `Tasks` 目录的行为,引用 MSDN 的文档:
|
||||||
|
@ -60,7 +60,7 @@ app.dock.setMenu(dockMenu);
|
||||||
不同于 OS X 的鱼眼菜单,Windows 上的用户任务表现得更像一个快捷方式,比如当用户点击一个任务,一个程序将会被传入特定的参数并且运行。
|
不同于 OS X 的鱼眼菜单,Windows 上的用户任务表现得更像一个快捷方式,比如当用户点击一个任务,一个程序将会被传入特定的参数并且运行。
|
||||||
|
|
||||||
你可以使用 [app.setUserTasks][8] API 来设置你的应用中的用户任务:
|
你可以使用 [app.setUserTasks][8] API 来设置你的应用中的用户任务:
|
||||||
````
|
```javascript
|
||||||
var app = require('app');
|
var app = require('app');
|
||||||
app.setUserTasks([
|
app.setUserTasks([
|
||||||
{
|
{
|
||||||
|
@ -72,11 +72,11 @@ app.setUserTasks([
|
||||||
description: 'Create a new window'
|
description: 'Create a new window'
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
````
|
```
|
||||||
调用 `app.setUserTasks` 并传入空数组就可以清除你的任务列表:
|
调用 `app.setUserTasks` 并传入空数组就可以清除你的任务列表:
|
||||||
````
|
```javascript
|
||||||
app.setUserTasks([]);
|
app.setUserTasks([]);
|
||||||
````
|
```
|
||||||
当你的应用关闭时,用户任务会仍然会出现,在你的应用被卸载前,任务指定的图标和程序的路径必须是存在的。
|
当你的应用关闭时,用户任务会仍然会出现,在你的应用被卸载前,任务指定的图标和程序的路径必须是存在的。
|
||||||
|
|
||||||
### 缩略图工具栏
|
### 缩略图工具栏
|
||||||
|
@ -90,7 +90,7 @@ app.setUserTasks([]);
|
||||||
### Windows Media Player 的缩略图工具栏
|
### Windows Media Player 的缩略图工具栏
|
||||||
![Thumbnail toolbar of Windows Media Player][9]
|
![Thumbnail toolbar of Windows Media Player][9]
|
||||||
你可以使用 [BrowserWindow.setThumbarButtons][10] 来设置你的应用的缩略图工具栏。
|
你可以使用 [BrowserWindow.setThumbarButtons][10] 来设置你的应用的缩略图工具栏。
|
||||||
````
|
```javascript
|
||||||
var BrowserWindow = require('browser-window');
|
var BrowserWindow = require('browser-window');
|
||||||
var path = require('path');
|
var path = require('path');
|
||||||
var win = new BrowserWindow({
|
var win = new BrowserWindow({
|
||||||
|
@ -110,11 +110,11 @@ win.setThumbarButtons([
|
||||||
click: function() { console.log("button2 clicked."); }
|
click: function() { console.log("button2 clicked."); }
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
````
|
```
|
||||||
调用 `BrowserWindow.setThumbarButtons` 并传入空数组即可清空缩略图工具栏:
|
调用 `BrowserWindow.setThumbarButtons` 并传入空数组即可清空缩略图工具栏:
|
||||||
````
|
```javascript
|
||||||
win.setThumbarButtons([]);
|
win.setThumbarButtons([]);
|
||||||
````
|
```
|
||||||
|
|
||||||
## Unity launcher 快捷方式(Linux)
|
## Unity launcher 快捷方式(Linux)
|
||||||
在 Unity,你可以通过改变 `.desktop` 文件来增加自定义运行器的快捷方式,详情看 [Adding shortcuts to a launcher][11]。
|
在 Unity,你可以通过改变 `.desktop` 文件来增加自定义运行器的快捷方式,详情看 [Adding shortcuts to a launcher][11]。
|
||||||
|
@ -132,20 +132,20 @@ Unity DE 也具有同样的特性,在运行器上显示进度条。
|
||||||
![Progress bar in Unity launcher][14]
|
![Progress bar in Unity launcher][14]
|
||||||
|
|
||||||
给一个窗口设置进度条,你可以调用 [BrowserWindow.setProgressBar][15] API:
|
给一个窗口设置进度条,你可以调用 [BrowserWindow.setProgressBar][15] API:
|
||||||
````
|
```javascript
|
||||||
var window = new BrowserWindow({...});
|
var window = new BrowserWindow({...});
|
||||||
window.setProgressBar(0.5);
|
window.setProgressBar(0.5);
|
||||||
````
|
```
|
||||||
在 OS X,一个窗口可以设置它展示的文件,文件的图标可以出现在标题栏,当用户 Command-Click 或者 Control-Click 标题栏,文件路径弹窗将会出现。
|
在 OS X,一个窗口可以设置它展示的文件,文件的图标可以出现在标题栏,当用户 Command-Click 或者 Control-Click 标题栏,文件路径弹窗将会出现。
|
||||||
### 展示文件弹窗菜单:
|
### 展示文件弹窗菜单:
|
||||||
![Represented file popup menu][16]
|
![Represented file popup menu][16]
|
||||||
|
|
||||||
你可以调用 [BrowserWindow.setRepresentedFilename][17] 和 [BrowserWindow.setDocumentEdited][18] APIs:
|
你可以调用 [BrowserWindow.setRepresentedFilename][17] 和 [BrowserWindow.setDocumentEdited][18] APIs:
|
||||||
````
|
```javascript
|
||||||
var window = new BrowserWindow({...});
|
var window = new BrowserWindow({...});
|
||||||
window.setRepresentedFilename('/etc/passwd');
|
window.setRepresentedFilename('/etc/passwd');
|
||||||
window.setDocumentEdited(true);
|
window.setDocumentEdited(true);
|
||||||
````
|
```
|
||||||
|
|
||||||
[1]:https://camo.githubusercontent.com/3310597e01f138b1d687e07aa618c50908a88dec/687474703a2f2f692e6d73646e2e6d6963726f736f66742e636f6d2f64796e696d672f49433432303533382e706e67
|
[1]:https://camo.githubusercontent.com/3310597e01f138b1d687e07aa618c50908a88dec/687474703a2f2f692e6d73646e2e6d6963726f736f66742e636f6d2f64796e696d672f49433432303533382e706e67
|
||||||
[2]: https://cloud.githubusercontent.com/assets/639601/5069610/2aa80758-6e97-11e4-8cfb-c1a414a10774.png
|
[2]: https://cloud.githubusercontent.com/assets/639601/5069610/2aa80758-6e97-11e4-8cfb-c1a414a10774.png
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
使用标准 HTML5 APIs 可以实现在线和离线事件的探测,就像以下例子:
|
使用标准 HTML5 APIs 可以实现在线和离线事件的探测,就像以下例子:
|
||||||
|
|
||||||
*main.js*
|
*main.js*
|
||||||
````
|
```javascript
|
||||||
var app = require('app');
|
var app = require('app');
|
||||||
var BrowserWindow = require('browser-window');
|
var BrowserWindow = require('browser-window');
|
||||||
var onlineStatusWindow;
|
var onlineStatusWindow;
|
||||||
|
@ -11,10 +11,10 @@ app.on('ready', function() {
|
||||||
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false });
|
onlineStatusWindow = new BrowserWindow({ width: 0, height: 0, show: false });
|
||||||
onlineStatusWindow.loadURL('file://' + __dirname + '/online-status.html');
|
onlineStatusWindow.loadURL('file://' + __dirname + '/online-status.html');
|
||||||
});
|
});
|
||||||
````
|
```
|
||||||
|
|
||||||
*online-status.html*
|
*online-status.html*
|
||||||
````
|
```html
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<body>
|
<body>
|
||||||
|
@ -30,12 +30,12 @@ app.on('ready', function() {
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
````
|
```
|
||||||
|
|
||||||
也会有人想要在主进程也有回应这些事件的实例。然后主进程没有 `navigator` 对象因此不能直接探测在线还是离线。使用 Electron 的进程间通讯工具,事件就可以在主进程被使,就像下面的例子:
|
也会有人想要在主进程也有回应这些事件的实例。然后主进程没有 `navigator` 对象因此不能直接探测在线还是离线。使用 Electron 的进程间通讯工具,事件就可以在主进程被使,就像下面的例子:
|
||||||
|
|
||||||
*main.js*
|
*main.js*
|
||||||
````
|
```javascript
|
||||||
var app = require('app');
|
var app = require('app');
|
||||||
var ipc = require('ipc');
|
var ipc = require('ipc');
|
||||||
var BrowserWindow = require('browser-window');
|
var BrowserWindow = require('browser-window');
|
||||||
|
@ -49,10 +49,10 @@ app.on('ready', function() {
|
||||||
ipc.on('online-status-changed', function(event, status) {
|
ipc.on('online-status-changed', function(event, status) {
|
||||||
console.log(status);
|
console.log(status);
|
||||||
});
|
});
|
||||||
````
|
```
|
||||||
|
|
||||||
*online-status.html*
|
*online-status.html*
|
||||||
````
|
```html
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<body>
|
<body>
|
||||||
|
@ -69,4 +69,4 @@ ipc.on('online-status-changed', function(event, status) {
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
````
|
```
|
||||||
|
|
|
@ -31,17 +31,17 @@ your-app/
|
||||||
└── index.html
|
└── index.html
|
||||||
````
|
````
|
||||||
`package.json `的格式和 Node 的完全一致,并且那个被 `main` 字段声明的脚本文件是你的应用的启动脚本,它运行在主进程上。你应用里的 `package.json` 看起来应该像:
|
`package.json `的格式和 Node 的完全一致,并且那个被 `main` 字段声明的脚本文件是你的应用的启动脚本,它运行在主进程上。你应用里的 `package.json` 看起来应该像:
|
||||||
````
|
```json
|
||||||
{
|
{
|
||||||
"name" : "your-app",
|
"name" : "your-app",
|
||||||
"version" : "0.1.0",
|
"version" : "0.1.0",
|
||||||
"main" : "main.js"
|
"main" : "main.js"
|
||||||
}
|
}
|
||||||
````
|
```
|
||||||
**注意**:如果 `main` 字段没有在 `package.json` 声明,Electron会优先加载 `index.js`。
|
**注意**:如果 `main` 字段没有在 `package.json` 声明,Electron会优先加载 `index.js`。
|
||||||
|
|
||||||
`main.js` 应该用于创建窗口和处理系统时间,一个典型的例子如下:
|
`main.js` 应该用于创建窗口和处理系统时间,一个典型的例子如下:
|
||||||
````
|
```javascript
|
||||||
var app = require('app'); // 控制应用生命周期的模块。
|
var app = require('app'); // 控制应用生命周期的模块。
|
||||||
var BrowserWindow = require('browser-window'); // 创建原生浏览器窗口的模块
|
var BrowserWindow = require('browser-window'); // 创建原生浏览器窗口的模块
|
||||||
|
|
||||||
|
@ -78,9 +78,9 @@ app.on('ready', function() {
|
||||||
mainWindow = null;
|
mainWindow = null;
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
````
|
```
|
||||||
最后,你想展示的 `index.html` :
|
最后,你想展示的 `index.html` :
|
||||||
````
|
```html
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
|
@ -92,35 +92,35 @@ app.on('ready', function() {
|
||||||
and Electron <script>document.write(process.versions['electron'])</script>.
|
and Electron <script>document.write(process.versions['electron'])</script>.
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
````
|
```
|
||||||
|
|
||||||
# 运行你的应用
|
# 运行你的应用
|
||||||
一旦你创建了最初的 `main.js`, `index.html` 和 `package.json` 这几个文件,你可能会想尝试在本地运行并测试,看看是不是和期望的那样正常运行。
|
一旦你创建了最初的 `main.js`, `index.html` 和 `package.json` 这几个文件,你可能会想尝试在本地运行并测试,看看是不是和期望的那样正常运行。
|
||||||
|
|
||||||
## electron-prebuild
|
## electron-prebuild
|
||||||
如果你已经用 `npm` 全局安装了 `electron-prebuilt`,你只需要按照如下方式直接运行你的应用:
|
如果你已经用 `npm` 全局安装了 `electron-prebuilt`,你只需要按照如下方式直接运行你的应用:
|
||||||
````
|
```bash
|
||||||
electron .
|
electron .
|
||||||
````
|
```
|
||||||
如果你是局部安装,那运行:
|
如果你是局部安装,那运行:
|
||||||
````
|
```bash
|
||||||
./node_modules/.bin/electron .
|
./node_modules/.bin/electron .
|
||||||
````
|
```
|
||||||
|
|
||||||
## 手工下载 Electron 二进制文件
|
## 手工下载 Electron 二进制文件
|
||||||
如果你手工下载了 Electron 的二进制文件,你也可以直接使用其中的二进制文件直接运行你的应用。
|
如果你手工下载了 Electron 的二进制文件,你也可以直接使用其中的二进制文件直接运行你的应用。
|
||||||
### Windows
|
### Windows
|
||||||
````
|
```bash
|
||||||
$ .\electron\electron.exe your-app\
|
$ .\electron\electron.exe your-app\
|
||||||
````
|
```
|
||||||
### Linux
|
### Linux
|
||||||
````
|
```bash
|
||||||
$ ./electron/electron your-app/
|
$ ./electron/electron your-app/
|
||||||
````
|
```
|
||||||
### OS X
|
### OS X
|
||||||
````
|
```bash
|
||||||
$ ./Electron.app/Contents/MacOS/Electron your-app/
|
$ ./Electron.app/Contents/MacOS/Electron your-app/
|
||||||
````
|
```
|
||||||
`Electron.app` 里面是 Electron 发布包,你可以在[这里][3]下载到。
|
`Electron.app` 里面是 Electron 发布包,你可以在[这里][3]下载到。
|
||||||
|
|
||||||
# 以发行版本运行
|
# 以发行版本运行
|
||||||
|
|
Loading…
Reference in a new issue