How to make custom Menu in SwiftUI

Issue #816

SwiftUI supports Menu but the menu items only appear after the menu button is touched. We can initiate the look and feel of Menu with a custom implementation

import SwiftUI

struct CustomMenu<Content: View>: View {
    @ViewBuilder let content: Content

    var body: some View {
        VStack(spacing: 0) {
            content
        }
        .frame(width: 234)
        .background(
            Color(UIColor.systemBackground)
                .opacity(0.8)
                .blur(radius: 50)
        )
        .cornerRadius(14)
    }
}

struct CustomMenuButtonStyle: ButtonStyle {
    let symbol: String
    let color: Color

    func makeBody(configuration: Configuration) -> some View {
        HStack {
            configuration.label
            Spacer()
            Image(systemName: symbol)
        }
        .padding(.horizontal, 16)
        .foregroundColor(color)
        .background(configuration.isPressed ? Color(UIColor.secondarySystemBackground) : Color.clear)
        .frame(height: 44)
    }
}

Then you can use like

CustomMenu {
    Group {
        Button(action: {}) {
            Text("Show")
        }
        .buttonStyle(CustomMenuButtonStyle(symbol: "eye", color: .blue))
        Divider()
        Button(action: {}) {
            Text("Hide")
        }
        .buttonStyle(CustomMenuButtonStyle(symbol: "eye.slash", color: .red))
    }
}