简体   繁体   English

在 Windows 暗模式下获取强调色

[英]Get accent color in Windows dark mode

Program-building with electron使用 electron 进行程序构建

The idea:想法:
I want the accent color of my program to be the same as the one from Windows.我希望我的程序的强调色与 Windows 中的强调色相同。

The problem:问题:
For the Light Mode of Windows, everything works, the passed color matches the Windows accent color.对于 Windows 的 Light Mode,一切正常,通过的颜色与 Windows 强调色相匹配。 But when switching to Dark Mode, I still get the accent color of the Light Mode.但是当切换到深色模式时,我仍然会得到浅色模式的强调色。

Possible solutions:可能的解决方案:
How does the Windows selection for the Dark Mode accent color work?暗模式强调色的 Windows 选择如何工作? Is the color always increased by a certain brightness level?颜色是否总是增加一定的亮度级别? Or are there pre-saved patterns?还是有预先保存的模式?


Here is my current code:这是我当前的代码:

main.js main.js

let color = systemPreferences.getAccentColor()

  mainWindow.on('ready-to-show', function() {
    mainWindow.webContents.send('accColor', {'Color': color});
  })

ipc.js ipc.js

ipc.on('accColor', (evt, message) => {
    let color = message['Color']
    const hex2rgb = (hex) => {
        const r = parseInt(hex.slice(1, 3), 16)
        const g = parseInt(hex.slice(3, 5), 16)
        const b = parseInt(hex.slice(5, 7), 16)
        return [ r, g, b ]
    }
    let baseRGB = hex2rgb('#' + color)
    document.querySelector('body').style.setProperty('--accent-default-rgb', baseRGB)
})

Although I couldn't find a function that returned the value of the dark mode accent color, I was able to change the brightness of the color and thus create a somewhat suitable solution.虽然我找不到返回暗模式强调色值的 function,但我能够更改颜色的亮度,从而创建了一个合适的解决方案。


Here is the code I added:这是我添加的代码:

ipc.js ipc.js

function adjustDark(color, amount) {
    return '#' + color.replace(/^#/, '').replace(/../g, color => ('0'+Math.min(255, Math.max(0, parseInt(color, 16) + amount)).toString(16)).substr(-2));
}


let darkHEX = adjustDark(color, 96)
let darkRGB = hex2rgb(darkHEX)
document.querySelector('body').style.setProperty('--accent-default-rgb', darkRGB)


Source for adjustDark() adjustDark() 的源代码

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM