Images & Videos

Author: ismartcoding

.harness/plan/media-previewer-dismiss-hang.md

@@ -0,0 +1,59 @@
+# MediaPreviewer dismiss hang bug — 已修复
+
+## 现象(已修)
+- Images tab → 点首图 → 拖下 → 图片能缩回列表格,scrim 灰罩 + 底部 action button 不消失,容器卡住不 dismiss
+
+## Root cause
+- LazyGrid item + `Modifier.animateItem` + `combinedClickable` 在 Compose 1.11.x 下触发同一 item 多次 compose
+- 每次 compose 生成新的 `TransformItemState` 实例,通过 `DisposableEffect { addItem() }` 把已测量的老实例从 `transformItemStateMap` 里挤掉
+- 老实例的 Box 仍持有 onGloballyPositioned 测量值(265x265),但已不在 map 里;新实例 blockSize = IntSize.Zero
+- `findTransformItem(currentKey)` 命中未测量的新实例 → `transformState.itemState` 持有一个 0-sized instance
+- 拖下触发 `dragDownClose()` → `exitTransform()` 内部 `srcSize = blockSize ?: Zero` → `fitScale = 0/0 = Infinity` → 6 个 `animateTo(NaN/Infinity, …)` 不收敛 → `awaitAll` 永远 hang → scrim 永不消失
+
+## Fix(F1 + caller size)
+**核心 fix**:`TransformItemState.addItem` 保留已测量的 instance,不让未测量的新实例覆盖
+```kotlin
+synchronized(imageTransformMutex) {
+    val prev = transformItemStateMap[currentKey]
+    if (prev != null && prev !== this && prev.blockSize.width > 0 && prev.blockSize.height > 0) {
+        return  // 已测量的赢,未测量的不要抢位置
+    }
+    transformItemStateMap[currentKey] = this
+}
+```
+**辅助 fix**:ImageGridItem/VideoGridItem 的 TransformImageView modifier 显式 `Modifier.size(widthPx.toDp())`,对齐 ChatImageItem。这样新 compose 阶段新实例本身也能拿到正确的 size,F1 是保险。
+
+## 为什么 ChatImages 没这问题
+- ChatImageItem `val itemState = rememberTransformItemState()`,写法完全一样
+- ChatImages 用 FlowRow(非 lazy)→ parent 不会触发同一 item 的重复 compose → 老实例不会被覆盖
+- 这是 LazyGrid + animateItem 在 Compose 1.11.x 的回归,F1 是真正的根治
+
+## F2 / F3 备选(已弃用)
+- **F2** `remember(m.id) { rememberTransformItemState() }`:实测无效,Compose 1.11.x LazyGrid 下 slot 仍会重生成
+- **F3** `dragDownClose` 防御性 guard `blockSize == Zero → viewerContainerShrinkDown()`:违反 user 禁止防御性判断原则,且只掩盖症状
+
+## 验证(4 个场景实机通过)
+- ✅ drag down > 阈值(`scale < 0.9`):图片缩回 grid,scrim 消失,action bar 消失
+- ✅ tap → back:正常 dismiss
+- ✅ swipe 切下一张 → drag down:正常 dismiss
+- ✅ drag < 阈值(回弹):scale 1F 路径,无副作用
+
+## 修改文件
+- `app/.../mediaviewer/previewer/TransformItemState.kt`:F1 保护(5 行)
+- `app/.../mediaviewer/previewer/MediaPreviewerState.kt`:删 `scaleToCloseMinValue` 私有 wrapper,`animating` setter 改 private
+- `app/.../components/ImageGridItem.kt`:TransformImageView modifier 改显式 size
+- `app/.../components/VideoGridItem.kt`:同上
+- 其他 TransformImageView caller(ChatFileThumbnail/AppFileListItem/FileListItem)原本就用 `Modifier.size(40.dp)`,无需改
+
+## 关键代码位置(后续维护参考)
+- `MediaPreviewerState.kt:326` `dragDownClose()` — 触发器
+- `MediaPreviewerState.kt:117` `findTransformItem(key)` — `transformItemStateMap[key]`
+- `MediaTransform.kt:46-47` `srcSize = itemState?.blockSize ?: IntSize.Zero`
+- `MediaTransform.kt:106-107` `fitScale = fitSize.width / displayRatioSize.width` — width=0 时 Infinity
+- `MediaTransform.kt:145-162` `exitTransform` — 6 个 animateTo(NaN→finite 不收敛)
+- `TransformItemState.kt:40-52` `addItem/removeItem` — F1 在此
+- `MediaTransformViews.kt:82-100` `TransformItemView` — `DisposableEffect { addItem() }` + `Box.onGloballyPositioned`
+
+## 设备
+- adb id: `47260DLAQ003RB` (Pixel 9 USB)
+- Compose = "1.11.3"

app/src/main/java/com/ismartcoding/plain/ui/components/ImageGridItem.kt

@@ -4,8 +4,7 @@ import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.aspectRatio
-import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.selection.toggleable
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.derivedStateOf
@@ -14,6 +13,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalDensity
 import com.ismartcoding.plain.lib.extensions.formatBytes
 import com.ismartcoding.plain.lib.extensions.getFilenameFromPath
 import com.ismartcoding.plain.lib.helpers.CoroutinesHelper.coMain
@@ -93,7 +93,7 @@ fun ImageGridItem(
             ),
     ) {
         TransformImageView(
-            modifier = Modifier.fillMaxSize().align(Alignment.Center).aspectRatio(1f),
+            modifier = Modifier.size(with(LocalDensity.current) { widthPx.toDp() }),
             uri = ImageMediaStoreHelper.getItemUri(m.id),
             path = m.path,
             fileName = m.path.getFilenameFromPath(),

app/src/main/java/com/ismartcoding/plain/ui/components/VideoGridItem.kt

@@ -4,15 +4,15 @@ import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.aspectRatio
-import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.selection.toggleable
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalDensity
 import com.ismartcoding.plain.lib.extensions.formatBytes
 import com.ismartcoding.plain.lib.extensions.formatDuration
 import com.ismartcoding.plain.lib.extensions.getFilenameFromPath
@@ -91,7 +91,7 @@ fun VideoGridItem(
             ),
     ) {
         TransformImageView(
-            modifier = Modifier.fillMaxSize().align(Alignment.Center).aspectRatio(1f),
+            modifier = Modifier.size(with(LocalDensity.current) { widthPx.toDp() }),
             path = m.path,
             fileName = m.path.getFilenameFromPath(),
             key = m.id,

app/src/main/java/com/ismartcoding/plain/ui/components/mediaviewer/previewer/MediaPreviewerState.kt

@@ -49,7 +49,6 @@ class MediaPreviewerState(
     val pagerState: PagerState,
 ) {
     var verticalDragType by mutableStateOf(VerticalDragType.None)
-    private var scaleToCloseMinValue by mutableFloatStateOf(DEFAULT_SCALE_TO_CLOSE_MIN_VALUE)
     val videoState = VideoState()
     private var mutex = Mutex()
     internal var openCallback: (() -> Unit)? = null
@@ -102,7 +101,7 @@ class MediaPreviewerState(
     var pagerUserScrollEnabled by mutableStateOf(true)
 
     var animating by mutableStateOf(false)
-        internal set
+        private set
     var visible by mutableStateOf(false)
         internal set
     private var visibleTarget by mutableStateOf<Boolean?>(null)
@@ -286,7 +285,7 @@ class MediaPreviewerState(
                         dragActivated && event.type == PointerEventType.Release -> {
                             pagerUserScrollEnabled = true; mediaViewerState?.allowGestureInput = true
                             vStartOffset = null; vOrientationDown = null; dragActivated = false
-                            if ((viewerContainerState?.scale?.value ?: 1F) < scaleToCloseMinValue) {
+                            if ((viewerContainerState?.scale?.value ?: 1F) < DEFAULT_SCALE_TO_CLOSE_MIN_VALUE) {
                                 scope.launch {
                                     if (canTransformOut) {
                                         val key = getKey(pagerState.currentPage)

app/src/main/java/com/ismartcoding/plain/ui/components/mediaviewer/previewer/TransformItemState.kt

@@ -40,7 +40,13 @@ class TransformItemState(
     fun addItem(key: Any? = null) {
         val currentKey = key ?: this.key
         if (checkInBound != null) return
-        synchronized(imageTransformMutex) { transformItemStateMap[currentKey] = this }
+        synchronized(imageTransformMutex) {
+            val prev = transformItemStateMap[currentKey]
+            if (prev != null && prev !== this && prev.blockSize.width > 0 && prev.blockSize.height > 0) {
+                return
+            }
+            transformItemStateMap[currentKey] = this
+        }
     }
 
     fun removeItem(key: Any? = null) {