Electron 注册全局快捷键（globalShortcut） 以及 clipboard剪切板事件（实现类似播放器点击机器码自动复制功能）

globalShortcart.js引入到主进程里

var { globalShortcut ,app} =require('electron');

app.on('ready',function(){
    
    //注册全局快捷键


    globalShortcut.register('ctrl+e',function(){


        console.log('ctrl+e');
    })

    
    globalShortcut.register('ctrl+d',function(){


        console.log('ctrl+d registed');
    })

    //检测快捷键是否注册功能

   console.log(globalShortcut.isRegistered('ctrl+e'));
})

app.on('will-quit',function(){

    //注销全局快捷键的监听

    globalShortcut.unregister('ctrl+e');

    globalShortcut.unregister('ctrl+d');
})

cliboard.js引入到渲染进程里

//clipboard模块可以在主进程里面使用 也可以在渲染进程里面使用


var {clipboard,nativeImage} =require('electron');


//执行复制操作


//复制
// clipboard.writeText('机器码')

// 粘贴

// clipboard.readText();  



var  code=document.querySelector('#code');
var  btn=document.querySelector('#btn');
var  input=document.querySelector('#input');

code.onclick=function(){


    clipboard.writeText(code.innerHTML);

    alert('复制成功') ;   //写一个div提示
}

btn.onclick=function(){

    //获取复制的内容
    input.value= clipboard.readText();
}





//监听按钮点击复制图片的事件




var  btncopyimg=document.querySelector('#btncopyimg');

btncopyimg.onclick=function(){
    //复制图片黏贴到我们页面上

    /*
    1.引入nativeImage

    2、创建一个nativeImage的对象

    */


    var image=nativeImage.createFromPath('static/favicon2.ico');

    //复制图片
    clipboard.writeImage(image);

    //粘贴图片

    var imgsrc=clipboard.readImage().toDataURL();

    console.log(imgsrc);   //base64的地址

    
    //创建一个img标签 指定他的src
    var imgDom=new Image();

    imgDom.src=imgsrc;


    document.body.appendChild(imgDom);



}

index.html

 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>

  <style>
  .red{

    color:red;
  }
  </style>
 
</head>
<body>



  <div>

    机器码:<span class="red" id="code">124124321fdsfsd234324325325</span>
  </div>



  <br>

  <input type="text" id="input">

  <button id="btn">黏贴</button>

  <br>

  <br>

  <br>

  <br>

  <button id="btncopyimg">复制图片显示到页面</button>

  <br>

  <br>

  <br>

   <script src="renderer/clipboard.js"></script>
</body>
</html>

 

posted on 2021-01-06 17:18  LoaderMan  阅读(602)  评论(0)  编辑  收藏  举报

导航