How do I customize some popovers UI properties, such as the shadow color of the menu

[wisepmlin]

Based on the needs of the product manager to change, you need to modify the UI attribute parameters, how popovers need to be customized, whether to leak some attribute configuration inside and outside the package

。

[aheze]

You can customize menus via the configuration parameter.

Templates.Menu(configuration: { /// <- here!
    $0.shadow.color = .blue
    $0.shadow.radius = 10
}) {
    Templates.MenuButton(title: "Change Icon To List", systemImage: "list.bullet") {
        iconName = "list.bullet"
    }
    Templates.MenuButton(title: "Change Icon To Keyboard", systemImage: "keyboard") {
        iconName = "keyboard"
    }
    Templates.MenuButton(title: "Change Icon To Bag", systemImage: "bag") {
        iconName = "bag"
    }
} label: { fade in
    ExampleRow(image: iconName, title: "Popovers Menu", color: 0x007eef)
        .opacity(fade ? 0.5 : 1)
}

Result:

Here's a list of customizable attributes:

Popovers/Sources/Templates/Menu.swift

Lines 14 to 32 in 94647f2

	public var holdDelay = CGFloat(0.2) /// The duration of a long press to activate the menu.
	public var presentationAnimation = Animation.spring(response: 0.4, dampingFraction: 0.7, blendDuration: 1)
	public var dismissalAnimation = Animation.spring(response: 0.5, dampingFraction: 0.9, blendDuration: 1)
	public var labelFadeAnimation = Animation.default /// The animation used when calling the `fadeLabel`.
	public var clipContent = true /// Replicate the system's default clipping animation.
	public var sourceFrameInset = UIEdgeInsets(top: -8, left: -8, bottom: -8, right: -8)
	public var originAnchor = Popover.Attributes.Position.Anchor.bottom /// The label's anchor.
	public var popoverAnchor = Popover.Attributes.Position.Anchor.top /// The menu's anchor.
	public var scaleAnchor: Popover.Attributes.Position.Anchor? /// If nil, the anchor will be automatically picked.
	public var excludedFrames: (() -> [CGRect]) = { [] }
	public var menuBlur = UIBlurEffect.Style.prominent
	public var width: CGFloat? = CGFloat(240) /// If nil, hug the content.
	public var cornerRadius = CGFloat(14)
	public var showDivider = true /// Show divider between menu items.
	public var shadow = Shadow.system
	public var backgroundColor = Color.clear /// A color that is overlaid over the entire screen, just underneath the menu.
	public var scaleRange = CGFloat(40) ... CGFloat(90) /// For rubber banding - the range at which rubber banding should be applied.
	public var minimumScale = CGFloat(0.7) /// For rubber banding - the scale the the popover should shrink to when rubber banding.