拖動電子窗口外的html元素複製本地文件？

我打算實現一個音樂播放器electron。它將列出來自用戶硬盤的音樂。
是否可以定義drag'n'drop行爲，以便我可以拖動html元素，例如<span>Artist – Title</span>外面的電子窗口拖到用戶的桌面上來複制實際的文件？拖動電子窗口外的html元素複製本地文件？

文件存儲在這裏：~/music/Artist-Title.mp3。

將電子窗口中的span拖放到桌面上時，應制作副本：~/Desktop/Artist-Title.mp3。

來源

2016-09-15 Pwdr

我相信這是你正在尋找的API。

http://electron.atom.io/docs/api/web-contents/#contentsstartdragitem

remote.getCurrentWebContents().startDrag({ file: 'path/to/file', icon: 'path/to/file/icon', });

來源

2016-09-15 09:58:57 MarshallOfSound

好的起點！謝謝！但由於這不是完整的解決方案，我發佈了另一個答案。 – Pwdr

工作實施例：

投入main.js並複製一個圖標，同時拖動（yourAppDir/img/icon/folder.png)顯示：

const {ipcMain} = require('electron') 

ipcMain.on('ondragstart', (event, filePath) => { 
    event.sender.startDrag({ 
    file: filePath, 
    icon: 'img/icon/folder.png' 
    }) 
})

投入renderer.js，並設置您要刪除的文件的路徑：

var ipcRenderer = require('electron').ipcRenderer 

document.getElementById('drag').ondragstart = (event) => { 
    event.preventDefault() 
    ipcRenderer.send('ondragstart', '/Users/tim/dev/test/elektron-drag-out-test/img/icon/folder.png') 
    }

的index.html身體標記內創建拖動元素：

... 
<body> 
    ... 
    <a href="#" id="drag" class="draggable">drag item</a> 
</body> 
...

我也進/出拖創建gist。

另一個有用的資源：Electron – Add webContents.startDrag(item) API

來源

2016-09-15 13:19:05 Pwdr

是否有可能獲取目標os路徑名，其中文件被刪除？ – django

拖動電子窗口外的html元素複製本地文件？

回答

相關問題