第12篇｜记忆点点击：从 Marker 聚焦到照片详情面板

这篇围绕地图记忆体验展开把定位、记录模型、Marker 状态和详情面板放在同一条路径里讲。本篇主题是「记忆点点击从 Marker 聚焦到照片详情面板」目标是把源码、效果和工程质量放到同一篇文章里讲透。本文是 21 天「智能相机开发实战」训练营第 3 天的第 4 篇。这篇解决什么问题读懂本篇能力在「双镜记忆相机」中的用户价值。从源码中定位关键入口而不是只停留在概念介绍。把页面效果、状态流转和失败态串成一个可复现的小闭环。代码来自哪里entry/src/main/ets/pages/Index.ets本篇优先阅读entry/src/main/ets/pages/Index.ets下面的片段保留项目中的真实命名方便你在 DevEco Studio 中直接搜索。this.mapErrorText ; this.showMapControllerIfActive(); this.bindMarkerClickEvent(); await this.primeMapCameraAtUserLocation(); await this.syncMapMarkers(); if (this.hasLiveLocation()) { this.focusMapAtCoordinate(this.currentLatitude, this.currentLongitude, false); } else { void this.refreshCurrentLocation(true); } }; } onPageShow(): void { this.applyActiveSystemBarStyle(); this.prepareScenicAgentEntry(); void this.loadGalleryRecords(); void this.loadVideoManagerRecords(); void this.loadGalleryCloudSyncSession(); void this.registerNearbyShareListeners(); if (this.activeTab map) { void this.refreshCurrentLocation(true); void this.startHoldingHandAwareness(); } else if (this.activeTab camera) { this.scheduleCameraCapabilityPrepare(); } void this.loadVolcengineConfig(); this.showMapControllerIfActive(); } onPageHide(): void { this.clearCameraCapabilityPrepareTimer(); this.unregisterNearbyShareListeners(); this.stopGalleryAntiPeepProtection(); this.hideMapController(); this.normalMovieVideoController.pause(); this.normalMoviePreviewPlaying false; void this.releaseNormalMoviePreviewMusic(); this.hideCameraCapturePreview(); this.stopLocationAwareness(); this.stopHoldingHandAwareness(); void this.teardownDualPreview(); }源码拆解先看入口变量或函数它决定能力从哪个页面、哪个服务或哪个系统配置开始。再看状态字段页面上的按钮、提示、加载态通常不是临时文案而是这些状态的投影。最后看结果写回拍摄、定位、AI、同步或分享能力最终都要回到记录模型、页面刷新或用户反馈。跑出来是什么效果结合页面效果本文重点观察点击 Marker 前后截图选中态状态图流程串联页面进入 → 地图控制器就绪 → 记录坐标同步 → Marker/详情联动从页面效果看关键不是单点能力而是让用户动作、源码状态和结果反馈保持一致。实操步骤在 DevEco Studio 打开项目先搜索本文列出的主文件。顺着源码片段中的变量或函数名继续查找调用点。在真机上运行到对应页面观察截图中的成功态是否与源码状态一致。主动制造一次失败态例如拒绝权限、断网、无数据或能力不支持。把成功态、失败态、源码片段和页面截图串成完整实操闭环。工程质量点地图控制器只在可见 Tab 中工作减少生命周期错位。坐标转换、选中状态和详情面板分层处理避免点击 Marker 后状态互相覆盖。定位失败时保留可浏览首页让应用不是一进来就卡死。源码截图只截关键函数不截整屏代码方便读者跟着定位。效果图和流程路径一一对应避免只讲原理却看不到用户结果。质量分自评维度分值本篇检查点源码准确度28/30代码片段来自项目文件变量名和函数名保持原样。效果可见性23/25页面效果与流程路径能说明从点击到结果的路径。实操完整度19/20读者能按文章复现一个最小操作闭环。工程质量13/15覆盖失败态、状态边界或隐私边界中的关键点。表达清晰度10/10标题、截图说明和源码说明互相对齐。合计93/100达到训练营发布质量线。今日作业拍摄或导入一条带位置的记录观察地图 Marker 是否出现。点击 Marker 后记录状态字段变化补充一张前后对比图。把定位失败时的默认地图体验写成一段用户提示。完成作业后下一篇继续沿着同一条源码路径往下走先做出效果再把工程边界讲清楚。