SwiftUI中如何用ZStack合并两个半视图的地图标记？

当前代码仅能展示单个操作的地图标记，要实现两个操作时各显示一半的效果，可以通过ZStack叠加两个标记并分别裁剪区域来完成，修改后的代码如下：

VStack {
    // 根据操作数量切换显示逻辑
    if place.actions.count == 1 {
        ActionView(action: place.actions.first!)
            .frame(width: 35, height: 35)
    } else if place.actions.count >= 2 {
        ZStack {
            // 第一个操作标记：仅显示右半部分
            ActionView(action: place.actions[0])
                .frame(width: 35, height: 35)
                .clipShape(Rectangle().inset(by: EdgeInsets(top: 0, leading: 17.5, bottom: 0, trailing: 0)))
            
            // 第二个操作标记：仅显示左半部分
            ActionView(action: place.actions[1])
                .frame(width: 35, height: 35)
                .clipShape(Rectangle().inset(by: EdgeInsets(top: 0, leading: 0, bottom: 0, trailing: 17.5)))
        }
    }
    
    Text(displayPlaceName ? place.name : "")
}.overlay(
    // 适配双操作的箭头显示
    HStack(spacing: 15) {
        if place.actions.count >= 1 {
            Image(systemName: "arrowtriangle.left.fill")
                .rotationEffect(Angle(degrees: 270))
                .foregroundColor(place.actions[0].color())
                .offset(y: 10)
        }
        if place.actions.count >= 2 {
            Image(systemName: "arrowtriangle.left.fill")
                .rotationEffect(Angle(degrees: 270))
                .foregroundColor(place.actions[1].color())
                .offset(y: 10)
        }
    }
)

实现说明 #

• 针对操作数量做分支判断：单个操作时保留原有显示逻辑；两个及以上操作时用ZStack叠加两个ActionView
• 利用clipShape和inset对两个标记分别裁剪，第一个标记隐藏左半部分，第二个标记隐藏右半部分，拼接后呈现各半的效果
• 底部的箭头区域改用HStack布局，对应显示两个操作的箭头及颜色

现有标记示例：

预期效果：

内容的提问来源于stack exchange，提问作者n savoini