地图式好友发现组件的层级与交互设计

是什么 这是 CollectUI 转发的移动端好友地图组件灵感图，价值在于展示如何把附近好友、空间位置和联系动作收进一个界面。顶部是搜索，中部是地图，底部是好友列表；同一好友同时以地图头像和列表行出现。

核心设计 界面遵循由概览到细节的层级：地图回答好友分布，列表补充姓名与距离，行内圆形按钮承接电话、定位或好友操作和消息等下一步动作。白色大圆角容器、浅色地图和柔和阴影压低噪声；蓝色当前位置与半透明范围圈建立焦点，头像标记把抽象地理信息转成可识别的人。双重呈现减少地图与联系人视图之间的切换。

关键洞察 搜索缩小对象范围，距离帮助判断相关性，快捷操作把发现直接转化为联系。这种模式适合社交、活动协同和家庭定位等场景，亮点是把高频动作放在好友上下文内。

边界与风险 截图只证明静态视觉方案，不能说明地图是否可拖拽、数据是否实时或按钮具体行为。落地时仍需处理位置授权、精度与刷新状态、无结果、头像重叠、误触和隐私暴露，并为距离和动作提供文字化、可访问的表达，避免依赖颜色或头像识别。