Question

我想在桌面环境中模拟移动设备。我无法找到将鼠标事件转换为触摸事件的参数。

我该如何处理这份工作？任何提示都会很棒。非常感谢你。

Answer 1

我想我明白了。开发环境：

node 7.4.0
Chromium 54.0.2840.101
电子1.5.1


    const app = electron.app 
    const BrowserWindow = electron.BrowserWindow

    let mainWindow;
    function createWindow() {

      mainWindow = new BrowserWindow({
        width: 1024,
        height: 768,
        frame: false,
        x: -1920,
        y: 0,
        autoHideMenuBar: true,
        icon: 'assets/icons/win/app-win-icon.ico'
      });

      try {
        // works with 1.1 too
        mainWindow.webContents.debugger.attach('1.2')
      } catch (err) {
        console.log('Debugger attach failed: ', err)
      }

      const isDebuggerAttached = mainWindow.webContents.debugger.isAttached()
      console.log('debugger attached? ', isDebuggerAttached)

      mainWindow.webContents.debugger.on('detach', (event, reason) => {
        console.log('Debugger detached due to: ', reason)
      });

      // This is where the magic happens!
      mainWindow.webContents.debugger.sendCommand('Emulation.setTouchEmulationEnabled', {
        enabled: true,
        configuration: 'mobile',
      });

      mainWindow.loadURL(url.format({
        pathname: path.join(__dirname, 'index.html'),
        protocol: 'file:',
        slashes: true,
        show: false,
        backgroundColor: '#8e24aa ',
      }));

      // Show the mainwindow when it is loaded and ready to show
      mainWindow.once('ready-to-show', () => {
          mainWindow.show()
      })
    }

    // Listen for app to be ready
    app.on('ready', createWindow);

Answer 2

请查看此Electron github issue或此Atom Discussion，了解如何与Electron联系。

至于如何处理它，我会浏览mouse events和touch events，然后连接一个结合了Electron api和相关web api的鼠标/触摸功能。

Answer 3

查看web-contents API，您唯一能做的就是打开开发工具：

// win being a BrowserWindow object
win.webContents.openDevTools();

然后您必须手动点击响应工具（智能手机图标），然后您才能进入所需的模式。

但我担心没有办法以编程方式进行。主要是因为它被认为是一个开发工具，而不是浏览器功能，所以你将工具栏放在顶部和所有这些东西。不是生产中你想要的东西。

电子webview可以将鼠标事件转换为触摸事件吗？

3 个答案: