第一章: hello atom shell world #1

fengmk2 · 2014-08-01T16:01:36Z

既然你都知道什么是 atom-shell 了, 我就无需解释了.

一如既往地, 我们从 hello world 开始整个旅程.

helloworld

什么? 又是 helloworld ...
我的计划是从 helloworld 开始, 慢慢地完成一个完整的基于 atom-shell 的 Markdown Editor, 简称 amd.

按照官方 quick start 照搬过来, 目录结构如下:

amd/
├── package.json
├── main.js
└── index.html

启动脚本 main.js (Browser scripts):

var app = require('app');  // Module to control application life.
var BrowserWindow = require('browser-window');  // Module to create native browser window.

// Report crashes to our server.
require('crash-reporter').start();

// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the javascript object is GCed.
var mainWindow = null;

// Quit when all windows are closed.
app.on('window-all-closed', function () {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

// This method will be called when atom-shell has done everything
// initialization and ready for creating browser windows.
app.on('ready', function () {
  // Create the browser window.
  mainWindow = new BrowserWindow({width: 800, height: 600});

  // and load the index.html of the app.
  mainWindow.loadUrl('file://' + __dirname + '/index.html');

  // Emitted when the window is closed.
  mainWindow.on('closed', function () {
    // 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.
    mainWindow = null;
  });
});

默认界面 index.html:

<!DOCTYPE html>
<html>
  <head>
    <title>Hello World!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    We are using node.js <script>document.write(process.version)</script>
    and atom-shell <script>document.write(process.versions['atom-shell'])</script>.
  </body>
</html>

运行我们的第一个 atom app:

$ ~/apps/atom-shell-v0.15.1-darwin-x64/Atom.app/Contents/MacOS/Atom ./

哔... 出来了

发现问题

启动后 app 没有出现在最前台
关掉当前window, app 没有退出

让 app 启动后出现在最前台

让当前window获取到焦点即可, 在 main.js 启动脚本最后加上一行代码:

mainWindow.focus();

当前window关闭后app退出

修改 app 的 window-all-closed 事件处理代码, 对所有平台都做退出处理:

// Quit when all windows are closed.
app.on('window-all-closed', function () {
  app.quit();
});

总结

helloworld很容易吧, 起步无压力.
本章最终代码在 branch/helloworld

The text was updated successfully, but these errors were encountered:

fengmk2 added a commit that referenced this issue Aug 2, 2014

hello world #1

b62c709

fengmk2 closed this as completed Jun 2, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

第一章: hello atom shell world #1

第一章: hello atom shell world #1

fengmk2 commented Aug 1, 2014

第一章: hello atom shell world #1

第一章: hello atom shell world #1

Comments

fengmk2 commented Aug 1, 2014

helloworld

发现问题

让 app 启动后出现在最前台

当前window关闭后app退出

总结