Question

我创建了一个带有窗口的Chrome应用，但它不可移动。我想制作允许它移动的顶部栏（HTML / CSS样式）。我查看了Chrome应用程序示例，但找不到可以拖动窗口的代码。

Answer 1

我发现了答案，它没有出现在文档中，也没有显而易见。它是一个CSS属性来控制它。

-webkit-app-region: drag;

如果没有它，你的无框窗口就不可移动了。

重要信息：您希望可点击或可交互的可拖动节点的任何子节点都需要在其CSS上使用-webkit-app-region: no-drag;。

例如：

.myCustomBar {
    position: absolute;
    width: 100%;
    height: 30px;
    -webkit-app-region: drag;
}

.myCustomBarCloseButton {
    position: relative;
    width: 100px;
    height: 30px;
    -webkit-app-region: no-drag;
}

Answer 2

    Just add below code in your background.js

    chrome.app.runtime.onLaunched.addListener(function() {
      chrome.app.window.create("frameless_window.html",
        {  frame: "none",
           id: "framelessWinID",
           innerBounds: {
             width: 360,
             height: 300,
             left: 600,
             minWidth: 220,
             minHeight: 220
          }
        }
      );
    })

And follow  https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/frameless-window
    Here you can find the best sample for creating frameless chrome app with the movable window.It's little bit confusing because, after installing it in chrome you can able to create its shortcut on the desktop as well.

如何使无框Chrome App Window移动？

2 个答案: