web-dev-qa-db-ja.com

透明度を下げてSwiftUIのメニュー項目のアクセントカラーの背景を取得する方法

AppKitを使用すると、NSMenuItemsをNSMenuに追加できます。 SwiftUIのNSMenuに似たもの、つまり MenuButton があることがわかりました。しかし、それがどのように機能するかについてのドキュメントは見つかりません。

私は以下を試しました：

_MenuButton("+") {
    Button("New contact") { print("Create new contact") }
    Button("New group") { print("Create new group") }
}
_

そして、それは私にこれを与えます

an opened MenuButton

システム設定で「透明度を下げる」を有効にすると、ほとんど問題ないように見えますがしかし

  • ボタンの背景色はメニューとは異なります（メニュー項目の上と下のわずかに明るい色に注意してください）。
  • メニュー項目にカーソルを合わせると、背景色が通常のmacOSメニューのように変化しません。下の画像をご覧ください。

Highlighted menu item

また、.background()修飾子を使用して手動で背景色を変更しようとしましたが、メニュー項目の全幅には影響しません。

_MenuButton("+") {
    Button("New contact") { print("Create new contact") }
        .background(Color.accentColor)
    Button("New group") { print("Create new group") }
}
_

Menu with manually changed background

これは、ButtonsをMenuButtonの内部に配置しているときに、おそらく他のSwiftUI要素を想定しているためと考えられます。以下のような通常の外観のmacOSメニューを作成するには、MenuButtons内にどの要素を配置する必要がありますか？

Correctly rendered MenuButton on Catalina

[更新] macOS Big Sur

ビッグサーでも試してみました。背景は正しくレンダリングされますが、Big Surではテキストの色が乱れます。 ????

Incorrectly highlighted menu on Big Sur

swiftmacosswiftui
3
Damiaan Dufaux

ButtonStyleを構成し、MenuButtonジェネリック構造に適用することで、これに対する部分的な解決策を見つけたと思います。ただし、_.foregroundColor_の条件付き変更は、個人のButton()のText()に継承されないことに注意してください。また、色が正しくありません。

おそらく誰かがこれを改善したいと思っているでしょう。

_struct DetectHover: ButtonStyle {
    @State private var hovering: Bool = false

    public func makeBody(configuration: DetectHover.Configuration) -> some View {
        configuration.label
            .foregroundColor(self.hovering ? Color.white : Color.primary)
            .background(self.hovering ? Color.blue : Color.clear)
            .onHover { hover in
                self.hovering = hover
            }
    }
}
_
_MenuButton(label: Image(nsImage: NSImage(named: NSImage.actionTemplateName)!)) {

// Buttons

}.buttonStyle(DetectHover())
_

result

1
P. A. Monsaille