Question

我有一个基本的画布游戏作为Chrome应用程序。当我最小化游戏窗口时，游戏继续单独播放。当窗口最小化时，我想执行一个函数pause()。

index.js（通过index.html中的<script>标记包含）

...

function pause(){
  paused = true;
  pausebtn.classList.add('hidden');
  pausemenu.classList.remove('hidden');
}

...

background.js

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('index.html', {
    'outerBounds': {
      'width': screen.availWidth,
      'height': screen.availHeight
    }
  });
});

我在哪里放chrome.app.window.onMinimized.addListener()？

然后，从那里，我如何实际执行函数pause()？

我正在寻找这些方面的东西：

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('index.html', {
    'outerBounds': {
      'width': screen.availWidth,
      'height': screen.availHeight
    }
  });
});
chrome.app.window.onMinimized.addListener(function(gamewindow){
  gamewindow.pause();
});

Answer 1

首先，似乎the documentation并未真正正确显示如何附加这些事件：它们附加到窗口实例，例如。

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('index.html', {
    'outerBounds': {
      'width': screen.availWidth,
      'height': screen.availHeight
    }
  }, function(createdWindow) {
    createdWindow.onMinimized.addListener(function() {
      /* code goes here */
    });
  });
});

至少有三个可能的答案，一个是直接的，一个是一个抽象层，另一个是移动逻辑的答案。

直接：

使用contentWindow属性

直接调用方法

createdWindow.contentWindow.pause();

这紧密地结合了代码：如果你重构了应用程序的代码，你也需要重构后台脚本。

抽象：

传递消息，然后在游戏中处理。

// background
chrome.runtime.sendMessage({pause: true});

// app window
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
  if(message.pause) {
    pause();
  }
});

移动逻辑：

您的应用的脚本是不是内容脚本。它们不受API访问的限制，因此可以自己监听事件 - 这可能是最不方便的方法。

// app window
chrome.app.window.current().onMinimized.addListener(pause);

..是的，就是这样。比试图传递命令更清洁。

Chrome应用程序：执行从后台脚本在应用程序窗口中定义的功能

1 个答案:

直接：

抽象：

移动逻辑：