Skip to content

fix: 확장 모션 사방 확장·장문 자동 펼침·후기 블러 페이지 동기화#193

Merged
seizeh merged 1 commit into
mainfrom
fix/expand-motion-blur-sync
Jul 26, 2026
Merged

fix: 확장 모션 사방 확장·장문 자동 펼침·후기 블러 페이지 동기화#193
seizeh merged 1 commit into
mainfrom
fix/expand-motion-blur-sync

Conversation

@seizeh

@seizeh seizeh commented Jul 26, 2026

Copy link
Copy Markdown
Owner

실기기 피드백 3건 반영.

1. 카드 → 상세 확장을 사방 확장으로

원인: 윈도 사각형(Rect.lerp)은 네 변이 함께 움직이지만, 콘텐츠가 윈도 좌상단에 고정(OverflowBox/Transform.scale topLeft)돼 있어 "상단이 먼저 붙고 하단이 길어지는" 리빌처럼 보였음(카드가 거의 풀폭이라 scale≈1로 시작).

  • CollapsibleViewcontentAlignment 도입 — Alignment.center 면 콘텐츠와 카드 크로스페이드가 윈도 중심에 붙어, 카드 중심에서 네 변이 동시에 벌어지는 사방 확장(축소는 사방 수축, 드래그 중 손가락 추종 동일).
  • 콘텐츠 폭은 항상 윈도 폭과 일치(scale = win.width/w)하므로 실질적으로 세로 정렬 선택이며, 수학적으로 미러 콘텐츠가 화면 세로 중앙에 있으면 t=1 에서 카드와 픽셀 정합이 성립(마진 무관).
  • 이에 맞춰 게시글(PostMediaHero)·후기 상세의 카드 미러 배치를 상단 박스 → 세로 중앙 박스(3:4 / 1:1)로 이동. 오버레이 패널·블러 사본도 같은 오프셋이라 정렬 유지.

다른 화면 영향

  • 기본값 topCenter 는 기존 topLeft 와 동일 동작(폭 일치로 가로 정렬 무의미) — 프로필·펫 상세·펫 프로필·채팅방은 변화 없음(이 화면들은 상단 헤더가 카드와 미러되는 설계라 상단 고정이 맞음).
  • 닉네임 모달(rise, riseOriginRect)은 origin 폭·높이가 화면과 같아 정렬과 무관 — 영향 없음.
  • ExpandRoute(프로필 편집 블룸)는 미러 콘텐츠가 없어 중심 기준으로 전환 — 버튼 중심에서 피어나는 모양으로 개선.

2. 장문 본문 자동 펼침

  • 게시글·후기 상세의 _expanded 초기값을 true 로. 실제 표시값이 _expanded && !_mirror확장 전환이 안착해 카드 미러가 풀리는 순간 AnimatedSize(SpringCurve.standard)로 자연스럽게 열리는 시퀀스가 자동 성립.
  • 본문 탭 토글(접기/재펼침), 축소 전환 시 강제 접힘, 드래그 취소 시 재펼침 모두 유지. 2줄 이하 본문은 시각 변화 없음.

3. 후기 상세 — 스와이프 중 블러 동기화

  • 블러 소스를 AnimatedBuilder(_pageCtrl) 페이지 팔로워로 교체: 현재 페이지 오프셋(fraction)을 읽어 인접 두 페이지의 미디어 사본을 본체 PageView 와 동일한 x 오프셋((i - page) * w)으로 translate 해 나란히 그림 — 본체와 픽셀 동기 슬라이드.
  • 영상 사본 규칙 유지: 현재(안착) 페이지만 라이브 VideoPlayer, 이웃/미초기화는 포스터, 에러는 어두운 타일.

검증

  • flutter analyze 새 이슈 0, dart format 적용
  • flutter build ios --no-codesign --debug 성공

판단 사항

  • 사방 확장을 전역 기본으로 강제하지 않고 opt-in 으로 한 이유: 채팅방·프로필·펫 상세는 상단 헤더가 카드로 변형되는 미러 설계라 중심 정렬 시 크로스페이드 고스팅이 생김. 쇼츠형 상세(게시글·후기)만 미러 배치를 중앙으로 함께 옮겨 적용.
  • 자동 펼침은 넘침 여부와 무관하게 expanded 상태로 두는 방식(짧은 본문은 렌더 동일) — 별도 측정 로직 없이 기존 상태 기계 그대로.

🤖 Generated with Claude Code

- CollapsibleView 에 contentAlignment 도입: center 면 콘텐츠·카드
  크로스페이드가 윈도 중심 기준으로 붙어 카드에서 네 변이 동시에 벌어지는
  사방 확장(축소는 사방 수축). 기본값 topCenter 는 기존 상단 고정과 동일 —
  상단 헤더가 카드와 미러되는 프로필·펫 상세·채팅방은 변화 없음.
  ExpandRoute(_OriginExpand, 프로필 편집 블룸)는 중심 기준으로 전환.
- 게시글·후기 상세가 center 를 사용하고, 히어로의 카드 미러 배치를 상단
  박스에서 **세로 중앙 박스**(게시글 3:4, 후기 1:1)로 옮겨 윈도 중심과
  픽셀 미러가 유지되게 함(패널·블러 정렬도 동일 오프셋).
- 장문 본문 자동 펼침: 게시글·후기 상세 _expanded 초기값 true —
  expanded 는 `_expanded && !_mirror` 라 확장 전환이 안착하는 순간
  AnimatedSize 스프링으로 자연스럽게 열린다. 탭 토글·축소 시 자동 접힘 유지.
- 후기 상세 블러 페이지 동기화: 블러 소스가 PageController 스크롤을
  실시간 추종 — AnimatedBuilder 로 페이지 오프셋을 읽어 인접 두 페이지의
  사본을 본체 PageView 와 같은 x 오프셋으로 translate 해 나란히 그림
  (픽셀 동기 슬라이드). 영상 사본은 현재 페이지만 라이브, 이웃은 포스터.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@seizeh
seizeh merged commit 077298e into main Jul 26, 2026
1 check passed
@seizeh
seizeh deleted the fix/expand-motion-blur-sync branch July 26, 2026 03:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant