diff --git a/core/ui/src/main/kotlin/com/afternote/core/ui/ProfileImage.kt b/core/ui/src/main/kotlin/com/afternote/core/ui/ProfileImage.kt index 0b94f82fb3..af49bfbf13 100644 --- a/core/ui/src/main/kotlin/com/afternote/core/ui/ProfileImage.kt +++ b/core/ui/src/main/kotlin/com/afternote/core/ui/ProfileImage.kt @@ -10,6 +10,7 @@ import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip +import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.unit.Dp @@ -89,6 +90,9 @@ private fun ProfileImageContent( modifier = modifier, placeholder = placeholder, error = placeholder, + // 아바타는 원으로 잘라 쓴다. 기본값(Fit)이면 사용자가 고른 세로·가로 사진이 원 안에서 + // 축소돼 위아래가 비므로, 칸을 채우고 넘치는 쪽을 잘라야 자리가 그대로 유지된다. + contentScale = ContentScale.Crop, ) } else { Image( diff --git a/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTest.kt b/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTest.kt new file mode 100644 index 0000000000..0575deccd1 --- /dev/null +++ b/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTest.kt @@ -0,0 +1,59 @@ +package com.afternote.core.ui + +import android.graphics.Bitmap +import androidx.compose.runtime.Composable +import androidx.compose.runtime.CompositionLocalProvider +import androidx.compose.ui.tooling.preview.Preview +import coil3.annotation.ExperimentalCoilApi +import coil3.asImage +import coil3.compose.AsyncImagePreviewHandler +import coil3.compose.LocalAsyncImagePreviewHandler +import com.afternote.core.ui.theme.AfternoteTheme +import com.android.tools.screenshot.PreviewTest + +/** + * [ProfileImage]·[ProfileImagePicker] 에 가로가 긴 사진(4:3)이 들어왔을 때의 baseline (#2143). + * + * 휴대폰 카메라 사진은 대부분 4:3 이다. 사진이 원을 다 채우지 못하면 원 위아래가 평평하게 + * 잘린 모양이 된다. 사진은 한 가지 색으로 칠해 두어, 원이 꽉 찼는지가 윤곽만으로 드러난다. + * + * `AsyncImage` 는 프리뷰에서 네트워크를 타지 않고 [LocalAsyncImagePreviewHandler] 가 주는 + * 이미지를 그린다. URI 는 `AsyncImage` 분기를 타게 하는 자리표시일 뿐이다. + */ +@PreviewTest +@Preview(showBackground = true) +@Composable +internal fun profileImageLandscapePhotoScreenshot() { + LandscapePhotoPreview { + ProfileImage(displayImageUri = LANDSCAPE_PHOTO_URI) + } +} + +@PreviewTest +@Preview(showBackground = true) +@Composable +internal fun profileImagePickerLandscapePhotoScreenshot() { + LandscapePhotoPreview { + ProfileImagePicker(onPickClick = {}, displayImageUri = LANDSCAPE_PHOTO_URI) + } +} + +@OptIn(ExperimentalCoilApi::class) +@Composable +private fun LandscapePhotoPreview(content: @Composable () -> Unit) { + val photo = + Bitmap + .createBitmap(LANDSCAPE_PHOTO_WIDTH, LANDSCAPE_PHOTO_HEIGHT, Bitmap.Config.ARGB_8888) + .apply { eraseColor(LANDSCAPE_PHOTO_COLOR) } + .asImage() + CompositionLocalProvider(LocalAsyncImagePreviewHandler provides AsyncImagePreviewHandler { photo }) { + AfternoteTheme { + content() + } + } +} + +private const val LANDSCAPE_PHOTO_URI = "content://preview/landscape-4x3" +private const val LANDSCAPE_PHOTO_WIDTH = 160 +private const val LANDSCAPE_PHOTO_HEIGHT = 120 +private const val LANDSCAPE_PHOTO_COLOR = 0xFF5B7DB1.toInt() diff --git a/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImagePickerScreenshotTest.kt b/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImagePickerScreenshotTest.kt index 15630ce97f..b3a0b21b33 100644 --- a/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImagePickerScreenshotTest.kt +++ b/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImagePickerScreenshotTest.kt @@ -8,8 +8,8 @@ import com.android.tools.screenshot.PreviewTest /** * [ProfileImagePicker] 의 시각 회귀 baseline — placeholder + 우하단 편집 배지(PlusBadgeButton). * - * `displayImageUri = null` 케이스만 검증. `AsyncImage` URL 로드 분기는 instrumented 영역이라 - * 본 baseline 에서 제외. + * `displayImageUri = null` 케이스만 검증. 사진이 있을 때(`AsyncImage` 분기)는 + * ProfileImageLandscapePhotoScreenshotTest.kt 가 본다. * * 의도된 시각 변경 시 `./gradlew :core:ui:updateScreenshotTest` 로 baseline 갱신. */ diff --git a/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImageScreenshotTest.kt b/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImageScreenshotTest.kt index 40c0cfffe8..2851d793c4 100644 --- a/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImageScreenshotTest.kt +++ b/core/ui/src/screenshotTest/kotlin/com/afternote/core/ui/ProfileImageScreenshotTest.kt @@ -8,8 +8,8 @@ import com.android.tools.screenshot.PreviewTest /** * [ProfileImage] 의 시각 회귀 baseline — placeholder fallback 분기. * - * `displayImageUri = null` 케이스만 검증. `AsyncImage` 의 URL 로드 분기는 - * instrumented test 영역이라 본 baseline 에서 제외. + * `displayImageUri = null` 케이스만 검증. 사진이 있을 때(`AsyncImage` 분기)는 + * ProfileImageLandscapePhotoScreenshotTest.kt 가 본다. * * 의도된 시각 변경 시 `./gradlew :core:ui:updateScreenshotTest` 로 baseline 갱신. */ diff --git a/core/ui/src/screenshotTestDebug/reference/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTestKt/profileImageLandscapePhotoScreenshot_748aa731_0.png b/core/ui/src/screenshotTestDebug/reference/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTestKt/profileImageLandscapePhotoScreenshot_748aa731_0.png new file mode 100644 index 0000000000..f4c141d271 Binary files /dev/null and b/core/ui/src/screenshotTestDebug/reference/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTestKt/profileImageLandscapePhotoScreenshot_748aa731_0.png differ diff --git a/core/ui/src/screenshotTestDebug/reference/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTestKt/profileImagePickerLandscapePhotoScreenshot_748aa731_0.png b/core/ui/src/screenshotTestDebug/reference/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTestKt/profileImagePickerLandscapePhotoScreenshot_748aa731_0.png new file mode 100644 index 0000000000..eb94ed18ce Binary files /dev/null and b/core/ui/src/screenshotTestDebug/reference/com/afternote/core/ui/ProfileImageLandscapePhotoScreenshotTestKt/profileImagePickerLandscapePhotoScreenshot_748aa731_0.png differ