DEP-205 ui: 짝꿍 페이지 리뉴얼 (#72)

* ui: display 폰트 타입 및 drawable 추가 * ui: 짝꿍 페이지 리뉴얼 * ui: 짝꿍이 없을 때 화면 분리 * ui: 최종레벨 달성시 화면 구현 * fix: 중복된 문자열 삭제
depromeet12th · Dec 15, 2022 · b40555e · b40555e
1 parent 3361ebd
commit b40555e
Show file tree

Hide file tree

Showing 8 changed files with 275 additions and 153 deletions.
diff --git a/core-design-system/src/main/res/drawable/bg_rect_green50_r10.xml b/core-design-system/src/main/res/drawable/bg_rect_green50_r10.xml
@@ -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="@color/green_50" />
+    <corners android:radius="10dp" />
+</shape>
diff --git a/core-design-system/src/main/res/drawable/bg_rect_white_r15.xml b/core-design-system/src/main/res/drawable/bg_rect_white_r15.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+
+    <solid android:color="@color/white" />
+    <corners android:radius="15dp" />
+
+</shape>
diff --git a/core-design-system/src/main/res/values/typography.xml b/core-design-system/src/main/res/values/typography.xml
@@ -111,6 +111,30 @@
         <item name="fontFamily">@font/suit_bold</item>
     </style>
 
+    <!-- Display1 -->
+    <style name="Typography.Display1">
+        <item name="android:textSize" tools:ignore="SpUsage">26dp</item>
+        <item name="fontFamily">@font/suit_semi_bold</item>
+    </style>
+
+    <!-- Display2 -->
+    <style name="Typography.Display2">
+        <item name="android:textSize" tools:ignore="SpUsage">17dp</item>
+        <item name="fontFamily">@font/suit_bold</item>
+    </style>
+
+    <!-- Display3 -->
+    <style name="Typography.Display3">
+        <item name="android:textSize" tools:ignore="SpUsage">10dp</item>
+        <item name="fontFamily">@font/suit_semi_bold</item>
+    </style>
+
+    <!-- Display4 -->
+    <style name="Typography.Display4">
+        <item name="android:textSize" tools:ignore="SpUsage">11dp</item>
+        <item name="fontFamily">@font/suit_bold</item>
+    </style>
+
     <!-- Calendar -->
     <style name="Typography.Calendar">
         <item name="fontFamily">@font/suit_semi_bold</item>

diff --git a/presentation/mate/src/main/java/com/depromeet/threedays/mate/nomate/NoMateFragment.kt b/presentation/mate/src/main/java/com/depromeet/threedays/mate/nomate/NoMateFragment.kt
@@ -0,0 +1,7 @@
+package com.depromeet.threedays.mate.nomate
+
+import androidx.fragment.app.Fragment
+
+class NoMateFragment : Fragment() {
+
+}
diff --git a/presentation/mate/src/main/res/drawable/ic_polygon.xml b/presentation/mate/src/main/res/drawable/ic_polygon.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="22dp"
+    android:viewportWidth="24"
+    android:viewportHeight="22">
+  <path
+      android:pathData="M14.591,19.558C13.434,21.542 10.566,21.542 9.409,19.558L0.632,4.512C-0.535,2.512 0.908,0 3.223,0L20.777,0C23.092,0 24.535,2.512 23.368,4.512L14.591,19.558Z"
+      android:fillColor="#ffffff"/>
+</vector>
diff --git a/presentation/mate/src/main/res/layout/fragment_mate.xml b/presentation/mate/src/main/res/layout/fragment_mate.xml
diff --git a/presentation/mate/src/main/res/layout/fragment_no_mate.xml b/presentation/mate/src/main/res/layout/fragment_no_mate.xml
@@ -0,0 +1,54 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    tools:context=".nomate.NoMateFragment">
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/gl_top_of_30_percent"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.3"/>
+
+    <TextView
+        android:id="@+id/tv_illustration"
+        android:layout_width="180dp"
+        android:layout_height="180dp"
+        android:background="@color/gray_200"
+        android:gravity="center"
+        android:text="일러스트로 대체될 영역"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="@+id/gl_top_of_30_percent" />
+
+    <TextView
+        android:id="@+id/tv_create_mate_guide"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="24dp"
+        android:text="@string/create_mate_guide"
+        android:textAppearance="@style/Typography.Paragraph3.13dp"
+        android:textColor="@color/gray_500"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/tv_illustration" />
+
+    <androidx.appcompat.widget.AppCompatButton
+        android:id="@+id/btn_create_mate"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="24dp"
+        android:background="@drawable/bg_rect_gray800_r30"
+        android:gravity="center"
+        android:paddingHorizontal="44dp"
+        android:paddingVertical="14dp"
+        android:text="@string/create_mate"
+        android:textAppearance="@style/Typography.Button1"
+        android:textColor="@color/white"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/tv_create_mate_guide" />
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/presentation/mate/src/main/res/values/strings.xml b/presentation/mate/src/main/res/values/strings.xml
@@ -4,12 +4,14 @@
     <string name="start_date_with_mate">2022.05.11부터 함께했어요</string>
     <string name="level">Lv. </string>
     <string name="level_sample">Lv. 2</string>
-    <string name="mate_nickname_sample">수줍은 인구기(별명)</string>
+    <string name="mate_nickname_sample">별명</string>
     <string name="next_level_guide">다음 레벨까지 박수[n]개를 더 모아보세요!</string>
     <string name="clap_guide_title">습관 박수와 짝꿍의 박수가 달라요!</string>
     <string name="clap_guide_content">레벨업을 위한 박수는 짝꿍 생성 시점부터 카운트돼요. 때문에 습관을 생성한 시점부터 모은 박수와 차이날 수 있어요!</string>
     <string name="create_mate_guide">혼자서는 힘드셨죠?\n짝꿍이 도와드릴게요.</string>
     <string name="create_mate">짝꿍과 함께하기</string>
+    <string name="achieve_max_level">최종레벨 달성!</string>
+    <string name="save_mate">함께한 짝꿍에 저장하기</string>
 
     <!-- step1 -->
     <string name="connect_habit_guide">어떤 습관을 연결하시겠어요?</string>
@@ -47,7 +49,4 @@
     <string name="save_as_image">이미지로 저장</string>
     <string name="share_story">스토리 공유</string>
     <string name="share_page_guide">\@ZZAKSIM 을 태그해주시면 리포스팅 해드려요</string>
-
-    <!-- 최종 레벨 달성 팝업 -->
-    <string name="achieve_max_level">최종 레벨 달성</string>
 </resources>