feat(character-gallery): 갤러리 탭 UI/페이징 및 API 연동, DI 적용

- API: CharacterApi에 이미지 리스트 API 추가(characterId, page, size)
- VM: 페이징(loadInitial/loadNext), 요청 중복 방지, 마지막 페이지 판단, 누적 리스트 관리
- UI: ProgressBar(배경 #37474F/진행 #3BB9F1, radius 999dp, 비활성) + 좌/우 텍스트 구성
- Grid 3열 + 2dp 간격, item 4:5 비율, 잠금/구매 버튼 UI 적용
- UX: tv_ratio_right에서 ownedCount만 #FDD453로 강조(white 대비)
This commit is contained in:
2025-08-22 17:03:01 +09:00
parent f917eb8c93
commit 13ee098cfc
12 changed files with 445 additions and 10 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 359 B

View File

@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#B5E7FA" />
<corners android:radius="30dp" />
<stroke android:width="1dp" android:color="#3BB9F1" />
</shape>

View File

@@ -0,0 +1,17 @@
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
<shape android:shape="rectangle">
<corners android:radius="999dp" />
<solid android:color="#37474F" />
</shape>
</item>
<item android:id="@android:id/progress">
<clip>
<shape android:shape="rectangle">
<corners android:radius="999dp" />
<solid android:color="#3BB9F1" />
</shape>
</clip>
</item>
</layer-list>

View File

@@ -1,17 +1,87 @@
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/color_131313"
android:padding="24dp">
android:orientation="vertical">
<!-- 상단: 레이블(좌/우) + 슬라이더(ProgressBar) -->
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/cl_ratio"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="24dp"
android:layout_marginTop="24dp"
android:visibility="gone">
<ProgressBar
android:id="@+id/progress_ratio"
style="@android:style/Widget.ProgressBar.Horizontal"
android:layout_width="0dp"
android:layout_height="10dp"
android:layout_marginTop="8dp"
android:clickable="false"
android:enabled="false"
android:focusable="false"
android:indeterminate="false"
android:max="100"
android:progress="0"
android:progressDrawable="@drawable/bg_gallery_progress"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tv_ratio_left" />
<TextView
android:id="@+id/tv_ratio_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/pretendard_bold"
android:textColor="@color/white"
android:textSize="18sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="40% 보유중" />
<TextView
android:id="@+id/tv_ratio_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/pretendard_regular"
android:textColor="@color/white"
android:textSize="16sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="0 / 0개" />
</androidx.constraintlayout.widget.ConstraintLayout>
<!-- RecyclerView: 3열 그리드 -->
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_gallery"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="24dp"
android:layout_weight="1"
android:overScrollMode="never"
android:visibility="gone"
app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
app:spanCount="3" />
<!-- 빈 상태 안내 -->
<TextView
android:id="@+id/tv_empty_gallery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="갤러리 콘텐츠가 없습니다."
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="24dp"
android:layout_weight="1"
android:fontFamily="@font/pretendard_bold"
android:gravity="center"
android:text="갤러리가 비어있습니다"
android:textColor="@color/white"
android:textSize="16sp"
android:layout_gravity="center" />
android:textSize="20sp"
android:visibility="gone" />
</FrameLayout>
</LinearLayout>

View File

@@ -0,0 +1,66 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- 이미지 컨테이너: 4:5 비율(800:1000) -->
<ImageView
android:id="@+id/iv_image"
android:layout_width="0dp"
android:layout_height="0dp"
android:contentDescription="@null"
android:scaleType="centerCrop"
app:layout_constraintDimensionRatio="4:5"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="@+id/ll_lock"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="vertical"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="@id/iv_image"
app:layout_constraintEnd_toEndOf="@id/iv_image"
app:layout_constraintStart_toStartOf="@id/iv_image"
app:layout_constraintTop_toTopOf="@id/iv_image">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="@null"
android:src="@drawable/ic_new_lock" />
<LinearLayout
android:id="@+id/btn_buy"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/bg_buy_button"
android:gravity="center_vertical"
android:paddingHorizontal="10dp"
android:paddingVertical="3dp">
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_marginEnd="4dp"
android:contentDescription="@null"
android:src="@drawable/ic_can" />
<TextView
android:id="@+id/tv_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/pretendard_bold"
android:textColor="#263238"
android:textSize="16sp"
tools:text="0" />
</LinearLayout>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>