一、官方文档的方式
win.isKiosk()//判断是否锁定
win.setKiosk(true)//锁定
win.setKiosk(false)//解锁
但是以上方法在mac os会全屏显示。
二、全兼容解决办法
渲染进程:
<template>
<div class='list' @mousedown="mousedown" :style="{ '--hover-color': hoverColor }">
<div class="icon">
<span @click="close" :class="isKiosk==true?'no':''">关闭</span>
<span @click="kiosk">锁定</span>
</div>
这是list页面
</div>
</template>
<script setup>
let isKiosk = ref(false);
let hoverColor = ref('rgba(0,0,0,.5)');
const close = ()=>{
electron.ipcRenderer.invoke('close-list')
}
const kiosk = ()=>{
isKiosk.value = !isKiosk.value;
if( isKiosk.value ){
hoverColor.value = '';
}else{
hoverColor.value = 'rgba(0,0,0,.5)'
}
electron.ipcRenderer.invoke('kiosk',{
isKiosk:isKiosk.value
});
}
import { ref } from 'vue'
let isKeyDown = ref(false);
let dinatesX = ref(0);
let dinatesY = ref(0);
const mousedown = ( e )=>{
isKeyDown.value = true;
dinatesX.value = e.x;
dinatesY.value = e.y;
document.onmousemove = (ev) => {
if(isKeyDown.value){
const x = ev.screenX - dinatesX.value;
const y = ev.screenY - dinatesY.value;
//给主进程传入坐标
let data = {
appX:x,
appY:y,
isKiosk:false
}
electron.ipcRenderer.invoke('custom-list',data);
}
};
document.onmouseup = (ev) => {
isKeyDown.value = false;
};
}
</script>
<style scoped>
.no{
visibility: hidden;
background-color: red;
}
.list{
position: absolute;
left:0;
right: 0;
bottom:0;
top:0;
color:#fff;
display: flex;
align-items: center;
justify-content: center;
letter-spacing:2px;
font-size:21px;
}
.list:hover { background-color: var(--hover-color); }
.icon{
position: absolute;
left:0;
top:0;
}
</style>
主进程:
//创建窗口
context.listWindow = new BrowserWindow({
width: 400,
height: 100,
show: false,
frame:false,
resizable:false,
transparent:true,//设置透明
hasShadow:false,//去除阴影
alwaysOnTop:true,//置顶
...(process.platform === 'linux' ? { icon } : {}),
webPreferences: {
preload: join(__dirname, '../preload/index.js'),
sandbox: false
}
})
let isKiosk = false;
if( context ){
ipcMain.handle('custom-list',(event,res)=>{
console.log( isKiosk )
if( !isKiosk ){
let x = res.appX;
let y = res.appY;
context.listWindow.setPosition(res.appX,res.appY);
}
})
}
if( context ){
ipcMain.handle('kiosk',(event,res)=>{
isKiosk = res.isKiosk;
})
}
相关作者
- 获取点赞0
- 文章阅读量133
评论()