iOS client for Grain
grain.social
ios
photography
atproto
fix: animate alt text overlay fade and dismiss on page swipe
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
+9
-12
+9
-12
Grain/Views/Components/GalleryCardView.swift
+9
-12
Grain/Views/Components/GalleryCardView.swift
···
45
45
46
46
Task {
47
47
try? await Task.sleep(for: .milliseconds(500))
48
-
withAnimation(.easeInOut(duration: 0.4)) { heartScale = 1.6 }
48
+
withAnimation(.easeInOut(duration: 0.2)) { heartScale = 1.6 }
49
49
try? await Task.sleep(for: .milliseconds(400))
50
50
isComplete = true
51
51
}
···
342
342
onDoubleTap: { point in doubleTapLike(at: point) }
343
343
)
344
344
345
-
// Per-page alt text overlay — lives INSIDE the TabView page so
346
-
// it translates with the photo during a swipe instead of
347
-
// staying fixed while the photo moves underneath. Wrapping
348
-
// grey + text in a single ZStack guarantees they share one
349
-
// transition (no out-of-sync fade between them).
350
-
if showingAlt, let alt = photo.alt, !alt.isEmpty {
345
+
// Alt text overlay — always in the tree so opacity
346
+
// animates smoothly (conditional `if` inside TabView
347
+
// swallows transitions).
348
+
if let alt = photo.alt, !alt.isEmpty {
351
349
ZStack {
352
350
Color.black.opacity(0.6)
353
351
.onTapGesture {
···
366
364
.scrollBounceBehavior(.basedOnSize)
367
365
}
368
366
}
369
-
.transition(.asymmetric(
370
-
insertion: .opacity.animation(.easeIn(duration: 0.35)),
371
-
removal: .opacity
372
-
))
367
+
.opacity(showingAlt && currentPage == index ? 1 : 0)
368
+
.allowsHitTesting(showingAlt && currentPage == index)
369
+
.animation(.easeInOut(duration: 0.2), value: showingAlt && currentPage == index)
373
370
}
374
371
}
375
372
.tag(index)
···
415
412
prefetchCarousel(photos: photos, page: 0)
416
413
}
417
414
.onChange(of: currentPage) {
418
-
showingAlt = false
415
+
withAnimation(.easeInOut(duration: 0.2)) { showingAlt = false }
419
416
prefetchCarousel(photos: photos, page: currentPage)
420
417
}
421
418
.onDisappear {