graphicsLayer 기반 GPU 가속을 통한 고성능 Rolling Text 구현

Context

기존 AnimatedContent 기반 라이브러리는 숫자 간 중간 단계 생략으로 인해 시각적 연속성이 부족한 한계 존재. 다수의 숫자 슬롯을 개별 Composable로 구성한 초기 설계는 잦은 Layout Pass로 인한 프레임 드롭 및 Baseline 정렬 문제 발생.

Technical Solution

• 개별 Composable 대신 다행 문자열(Multi-line String)을 하나의 텍스트 뷰로 처리하는 Drum 구조 설계
• Modifier.offset 대신 Modifier.graphicsLayer를 채택하여 Layout 단계가 아닌 Drawing 단계에서 GPU 기반 translationY 처리
• CubicBezierEasing(0.2f, 0.0f, 0.0f, 1.0f) 적용을 통한 자연스러운 가속 및 감속 연출
• 애니메이션 종료 시점에 전체 문자열을 최종 단일 문자로 교체하여 Sub-pixel Rendering으로 인한 미세한 위치 오차 제거
• BoxWithConstraints와 TextMeasurer를 결합한 calculateFontSizeToFit 로직으로 텍스트 길이에 따른 자동 크기 조정 구현
• TextLayoutResult.getLineTop() 기반의 정밀한 Line Position 측정값과 lineHeight 추정치를 결합한 하이브리드 오프셋 계산