electron 获取托盘主题的API

ocebsuys  于 3个月前  发布在  Electron
关注(0)|答案(6)|浏览(58)

预检清单

  • 我已阅读了此项目的 Contributing Guidelines
  • 我同意遵循此项目遵循的 Code of Conduct
  • 我在问题跟踪器中搜索了一个与我想提交的功能请求相匹配的问题,但没有成功。

问题描述

nativeTheme.shouldUseDarkColors 仅用于设置我们 APP 界面的主题,而不是托盘图标。
在更新到 macOS Big Sur 后,托盘颜色不仅基于系统主题,还基于您使用的壁纸。
因此,我认为提供一个 API 以获取“托盘主题”(暗/亮)是必要的。

建议的解决方案

考虑过的替代方案

其他信息

似乎不仅 macOS,而且 Windows 也需要这个功能。

6ljaweal

6ljaweal1#

单个示例模式托盘图标,无法适应多显示器场景。例如,在MacOS Big Sur中,每个显示器都设置了不同亮度的壁纸。

6jygbczu

6jygbczu2#

请查看这个链接:https://www.electronjs.org/docs/api/native-image#创建原生模块

const img = nativeImage.createFromPath("static/icon.png")
img.setTemplateImage(true)

// then set this image to tray
tray.setImage(img)
bvhaajcl

bvhaajcl3#

我们需要Windows托盘颜色,有什么新消息吗?谢谢。

wixjitnu

wixjitnu4#

上述解决方案(#25478(评论))在BigSur下对普通图标表现良好。
如果你想使用图标徽章来指示用户的新更新或操作,将图标标记为模板图像会导致颜色丢失,因此它会跟随托盘背景亮度级别。
这是一个使用带黑色填充、白色填充、黑色填充作为模板、白色填充作为模板的带徽章图标的例子。

在这个例子中,Adobe Creative Cloud图标似乎做得正确(看起来他们使用带有NSImage的TIFFs),而Docker Desktop选择了另一种方式来指示用户操作。

nhhxz33t

nhhxz33t5#

@devsibwarra想知道Adobe Creative Cloud是如何做到的!:D

vxbzzdmp

vxbzzdmp6#

我想要尝试解决这个问题——我们的团队在#25478(评论)中提到了同样的问题,我们有一个带有小彩色未读指示器的图标,所以模板图像不合适。
看起来没有一个相关的Mac API可以返回系统托盘主题,所以我的假设是我们需要做一些其他的事情。一些想法可能是:

  • 允许Tray.setImage使用另一个深色模式的图像(Tray.setImage(regularImage, {dark: darkImage}))。StatusItemView可能在运行时根据其设置的主题渲染正确的图像(我相信是根据背景设置的恰当的主题)
  • NativeImage更改为允许指定浅色和深色模式的图像——类似于NativeImage.createThemed(light: NativeImage, dark: NativeImage),或者可能是其他NativeImage API的变体。这相当于在Xcode中指定深色和浅色变体,然后在NSStatusItem和其他MacOS组件中自然地工作。我不太确定这个NativeImage部分将如何实现。

如果有任何对electron维护者对此感兴趣并给我一些指导(以及一个大致的想法,看看这是否是一个可接受的更改),我很乐意为此努力。
谢谢!

相关问题