Swift+MapKit实现自适应内容尺寸的标注弹窗问题求助
Swift+MapKit实现自适应内容尺寸的标注弹窗问题求助
各位好,我目前在Swift项目里用MapKit开发地图功能,想要实现点击标记后弹出一个自适应内容尺寸的弹窗,需求细节是这样的:
- 弹窗顶部是棕色背景的标题栏,标题文本要占满弹窗的整个宽度
- 下方是白色背景的正文区域,会包含4到8行文本内容
- 弹窗的宽高完全由内部内容撑开,就像HTML里的div那样自动适配,不想手动固定宽高,因为不同设备屏幕尺寸不同,文本占用的宽度也会变化
我已经写出了基础的地图和标注代码,现在的实现如下:
var body: some View { Map { ForEach(sessions) { session in Annotation("", coordinate: session.getCoordinate()) { // 标注内容的实现 GeometryReader { proxy in VStack { VStack { HStack(spacing: 10) { Text("header") .foregroundStyle(.black) } .padding(.horizontal) .frame(minWidth: proxy.size.width) .background(.brown) Text("Here: yes") Text("Line: second") Text("Some: Infos") Text("Stack: overflow") } .background(.white) .opacity(selected?.SessionId == session.SessionId ? 1 : 0) Image(systemName: "mappin") .resizable() .frame(width: 16, height: 32) .foregroundColor(session.getColor()) .shadow(radius: 4) } .onTapGesture { selected = (selected?.SessionId == session.SessionId ? nil : session) } } .frame(width: 120, height: 80) // 这里不想手动固定宽高 } } } }
不过我遇到了棘手的问题:现在必须手动设置.frame(width: 120, height: 80)才能让弹窗正常显示,但这完全不符合自适应的需求。我本来想用GeometryReader的proxy.size.width让标题栏占满宽度,但现在被固定宽高限制住了;我也试过用ignoresSafeArea(.all)代替固定frame,结果直接看不到标注弹窗了。
想请教下各位,怎么才能让这个弹窗完全根据内部内容自适应宽高,同时还能保证标题栏占满弹窗的整个宽度呢?
内容来源于stack exchange
相关产品推荐
相关产品推荐

