Big Sur 首选项面板的正确图标大小

Question

在为 macOS Big Sur 构建我的应用程序并将我的首选项面板工具栏样式切换为 .preference 时，图标的大小似乎不正确。

无论我使用@1x/@2x PNG 变体，还是具有单一比例的通用 PDF 矢量图像，与使用 SF Symbol 图标相比，我的图标总是变得更大和模糊。

现在我的应用需要向后兼容 10.13，所以我不能使用符号图像。

这是我的工具栏的样子

在首选项面板工具栏中获得适当大小的图标的正确方法是什么？

我需要在矢量资源中包含边距吗？如果是这样，正确的磅值是多少？

Answer 1

矢量图像似乎不太适合 NSToolbar。我为他们创建了一个 NSImage 扩展来手动创建一个工具栏友好的图像。

extension NSImage {

    convenience init?(namedVectorToolbarImage name: String) {
        guard let image = NSImage(named: name) else {
            return nil
        }

        self.init()

        let small = image.resized(to: .init(width: 24, height: 24))
        let regular = image.resized(to: .init(width: 32, height: 32))
        let reps = regular.representations + small.representations

        isTemplate = true

        reps.forEach {
            addRepresentation([=10=])
        }
    }

此处的 resize() 方法只是生成调整大小图像的另一种扩展。最重要的是，如果系统不是（低于）macOS 11.0.

，我将 NSToolbar.sizeMode 设置为小

Answer 2

我用 26x26px 矢量 PDF 得到了很好的结果。图标大小为 22x22px 并带有边距，但图标很模糊。启用 Preserve Vector Data 选项就可以了

可以在Image Set设置下设置：

Big Sur 首选项面板的正确图标大小

Correct icon size for Big Sur preference panels

swift

cocoa

appkit

macos-big-sur