第13篇｜景点 POI 叠加：附近推荐如何和照片记忆共存

这篇围绕地图记忆体验展开，把定位、记录模型、Marker 状态和详情面板放在同一条路径里讲。本篇主题是「景点 POI 叠加：附近推荐如何和照片记忆共存」，目标是把源码、效果和工程质量放到同一篇文章里讲透。

本文是 21 天「智能相机开发实战」训练营第 3 天的第 5 篇。

这篇解决什么问题

• 读懂本篇能力在「双镜记忆相机」中的用户价值。
• 从源码中定位关键入口，而不是只停留在概念介绍。
• 把页面效果、状态流转和失败态串成一个可复现的小闭环。

代码来自哪里

• entry/src/main/ets/pages/Index.ets

本篇优先阅读entry/src/main/ets/pages/Index.ets，下面的片段保留项目中的真实命名，方便你在 DevEco Studio 中直接搜索。

@State private currentLocationFresh: boolean = false; @State private currentLocationAccuracyMeters: number = Number.POSITIVE_INFINITY; @State private scenicAgentQueryText: string = SCENIC_AGENT_DEFAULT_QUERY; @State private scenicAgentQueryVersion: number = 0; @State private scenicAgentStatusText: string = ''; @State private scenicAgentSupportReady: boolean = true; @State private scenicPoiSpots: Array<ScenicPoiSpot> = []; @State private selectedScenicPoiId: string = ''; @State private scenicPoiSearchBusy: boolean = false; @State private holdingHandSide: HoldingHandSide = 'right'; @State private holdingHandAwarenessStatusText: string = '握姿感应待命'; @State private mapReady: boolean = false; @State private mapErrorText: string = ''; @State private showDetailPanel: boolean = false; @State private cameraPermissionReady: boolean = false; @State private cameraCapabilityChecked: boolean = false; @State private dualCameraSupported: boolean = false; @State private cameraStatusText: string = '拍照准备中'; @State private cameraDeviceCount: number = 0; @State private cameraConcurrentProfileCount: number = 0; @State private cameraProbeResultText: string = '拍照能力检测完成'; @State private singleCameraSupported: boolean = false; @State private selectedCaptureMode: CaptureMode = 'dual'; @State private singleCameraRole: CameraLensRole = 'back'; @State private singlePreviewLive: boolean = false; @State private backPreviewLive: boolean = false; @State private frontPreviewLive: boolean = false; @State private cameraFlashAvailable: boolean = false; @State private cameraFlashMode: camera.FlashMode = camera.FlashMode.FLASH_MODE_CLOSE; @State private cameraZoomMin: number = 1; @State private cameraZoomMax: number = 1; @State private cameraZoomCurrent: number = 1; @State private cameraZoomReady: boolean = false; @State private backLensChoiceKey: string = ''; @State private captureBusy: boolean = false; @State private captureOutputReady: boolean = true; @State private capturePairCount: number = 0; @State private lastCaptureSummary: string = '拍完自动进入相册'; @State private cameraCapturePreviewVisible: boolean = false; @State private cameraCapturePreviewBackUri: string = ''; @State private cameraCapturePreviewFrontUri: string = ''; @State private cameraCapturePreviewTitle: string = ''; @State private cameraCapturePreviewActionsVisible: boolean = false; @State private cameraSequentialThumbnailUri: string = '';

源码拆解

• 先看入口变量或函数：它决定能力从哪个页面、哪个服务或哪个系统配置开始。
• 再看状态字段：页面上的按钮、提示、加载态通常不是临时文案，而是这些状态的投影。
• 最后看结果写回：拍摄、定位、AI、同步或分享能力最终都要回到记录模型、页面刷新或用户反馈。

跑出来是什么效果

结合页面效果，本文重点观察：

• POI 标记截图
• 照片 Marker 与景点 Marker 分层图

流程串联：页面进入 → 地图控制器就绪 → 记录坐标同步 → Marker/详情联动

从页面效果看，关键不是单点能力，而是让用户动作、源码状态和结果反馈保持一致。

实操步骤

1. 在 DevEco Studio 打开项目，先搜索本文列出的主文件。
2. 顺着源码片段中的变量或函数名继续查找调用点。
3. 在真机上运行到对应页面，观察截图中的成功态是否与源码状态一致。
4. 主动制造一次失败态，例如拒绝权限、断网、无数据或能力不支持。
5. 把成功态、失败态、源码片段和页面截图串成完整实操闭环。

工程质量点

• 地图控制器只在可见 Tab 中工作，减少生命周期错位。
• 坐标转换、选中状态和详情面板分层处理，避免点击 Marker 后状态互相覆盖。
• 定位失败时保留可浏览首页，让应用不是一进来就卡死。
• 源码截图只截关键函数，不截整屏代码，方便读者跟着定位。
• 效果图和流程路径一一对应，避免只讲原理却看不到用户结果。

质量分自评

今日作业

1. 拍摄或导入一条带位置的记录，观察地图 Marker 是否出现。
2. 点击 Marker 后记录状态字段变化，补充一张前后对比图。
3. 把定位失败时的默认地图体验写成一段用户提示。

完成作业后，下一篇继续沿着同一条源码路径往下走：先做出效果，再把工程边界讲清楚。