DEP-203 ui: 온보딩 화면 구현

app/build.gradle

@@ -48,6 +48,7 @@ dependencies {
     implementation(project(":presentation:history"))
     implementation(project(":presentation:notification"))
     implementation(project(":presentation:mate"))
+    implementation(project(":presentation:onboarding"))
 
     implementation(jetpackDeps)
     implementation(coroutines)

app/src/main/AndroidManifest.xml

@@ -46,6 +46,10 @@
         <activity
             android:name="com.depromeet.threedays.mate.share.ShareMateActivity"
             android:exported="false"/>
+
+        <activity
+            android:name="com.depromeet.threedays.onboarding.OnboardingActivity"
+            android:exported="false"/>
     </application>
 
 </manifest>

core-design-system/src/main/res/drawable/bg_rect_gray200_r4.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/gray_200" />
+    <corners android:radius="4dp" />
+</shape>

core-design-system/src/main/res/drawable/bg_rect_gray500_r4.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/gray_500" />
+    <corners android:radius="4dp" />
+</shape>

presentation/onboarding/.gitignore

@@ -0,0 +1 @@
+/build

presentation/onboarding/build.gradle

@@ -0,0 +1,50 @@
+plugins {
+    id 'com.android.library'
+    id 'org.jetbrains.kotlin.android'
+    id "kotlin-kapt"
+    id 'dagger.hilt.android.plugin'
+}
+
+android {
+    namespace 'com.depromeet.threedays.onboarding'
+    compileSdk 33
+
+    defaultConfig {
+        minSdk 26
+        targetSdk 33
+
+        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
+        consumerProguardFiles "consumer-rules.pro"
+    }
+
+    buildTypes {
+        release {
+            minifyEnabled false
+            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
+        }
+    }
+    compileOptions {
+        sourceCompatibility JavaVersion.VERSION_1_8
+        targetCompatibility JavaVersion.VERSION_1_8
+    }
+    kotlinOptions {
+        jvmTarget = '1.8'
+    }
+    buildFeatures {
+        dataBinding true
+    }
+}
+
+dependencies {
+    implementation(project(":core"))
+    implementation(project(":core-design-system"))
+    implementation(project(":navigator"))
+
+    implementation(jetpackDeps)
+
+    implementation deps.hilt.core
+    kapt deps.hilt.compiler
+
+    testImplementation(testDeps)
+    androidTestImplementation(androidTestDeps)
+}

presentation/onboarding/proguard-rules.pro

@@ -0,0 +1,21 @@
+# Add project specific ProGuard rules here.
+# You can control the set of applied configuration files using the
+# proguardFiles setting in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# If your project uses WebView with JS, uncomment the following
+# and specify the fully qualified class name to the JavaScript interface
+# class:
+#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
+#   public *;
+#}
+
+# Uncomment this to preserve the line number information for
+# debugging stack traces.
+#-keepattributes SourceFile,LineNumberTable
+
+# If you keep the line number information, uncomment this to
+# hide the original source file name.
+#-renamesourcefileattribute SourceFile

presentation/onboarding/src/androidTest/java/com/depromeet/threedays/onboarding/ExampleInstrumentedTest.kt

@@ -0,0 +1,24 @@
+package com.depromeet.threedays.onboarding
+
+import androidx.test.platform.app.InstrumentationRegistry
+import androidx.test.ext.junit.runners.AndroidJUnit4
+
+import org.junit.Test
+import org.junit.runner.RunWith
+
+import org.junit.Assert.*
+
+/**
+ * Instrumented test, which will execute on an Android device.
+ *
+ * See [testing documentation](http://d.android.com/tools/testing).
+ */
+@RunWith(AndroidJUnit4::class)
+class ExampleInstrumentedTest {
+    @Test
+    fun useAppContext() {
+        // Context of the app under test.
+        val appContext = InstrumentationRegistry.getInstrumentation().targetContext
+        assertEquals("com.depromeet.threedays.onboarding.test", appContext.packageName)
+    }
+}

presentation/onboarding/src/main/AndroidManifest.xml

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest package="com.depromeet.threedays.onboarding"/>

presentation/onboarding/src/main/java/com/depromeet/threedays/onboarding/OnboardingActivity.kt

@@ -0,0 +1,80 @@
+package com.depromeet.threedays.onboarding
+
+import android.os.Bundle
+import androidx.fragment.app.Fragment
+import androidx.fragment.app.FragmentActivity
+import androidx.viewpager2.adapter.FragmentStateAdapter
+import androidx.viewpager2.widget.ViewPager2
+import com.depromeet.threedays.core.BaseActivity
+import com.depromeet.threedays.core.setOnSingleClickListener
+import com.depromeet.threedays.onboarding.databinding.ActivityOnboardingBinding
+import dagger.hilt.android.AndroidEntryPoint
+import com.depromeet.threedays.core_design_system.R as core_R
+
+@AndroidEntryPoint
+class OnboardingActivity : BaseActivity<ActivityOnboardingBinding>(R.layout.activity_onboarding) {
+    private val NUM_PAGES = 3 // 페이지 수를 정해둠
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        initView()
+        initEvent()
+    }
+
+    private fun initView() {
+        binding.vpOnBoarding.adapter = ScreenSlidePagerAdapter(this)
+        binding.vpOnBoarding.orientation = ViewPager2.ORIENTATION_HORIZONTAL
+    }
+
+    private fun initEvent() {
+        binding.vpOnBoarding.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
+            override fun onPageSelected(position: Int) {
+                super.onPageSelected(position)
+
+                binding.viewFirstIndicator.setBackgroundResource(core_R.drawable.bg_rect_gray200_r4)
+                binding.viewSecondIndicator.setBackgroundResource(core_R.drawable.bg_rect_gray200_r4)
+                binding.viewThirdIndicator.setBackgroundResource(core_R.drawable.bg_rect_gray200_r4)
+
+                when (position) {
+                    0 -> binding.viewFirstIndicator.setBackgroundResource(core_R.drawable.bg_rect_gray500_r4)
+                    1 -> binding.viewSecondIndicator.setBackgroundResource(core_R.drawable.bg_rect_gray500_r4)
+                    else -> binding.viewThirdIndicator.setBackgroundResource(core_R.drawable.bg_rect_gray500_r4)
+                }
+            }
+        })
+
+        binding.btnNext.setOnSingleClickListener {
+            binding.vpOnBoarding.run {
+                if (currentItem == 2) {
+                    // TODO: 시작하기 버튼 클릭됨
+                } else {
+                    currentItem += 1
+                }
+            }
+        }
+    }
+
+    private inner class ScreenSlidePagerAdapter(fa: FragmentActivity) : FragmentStateAdapter(fa) {
+        override fun getItemCount(): Int = NUM_PAGES // 페이지 수 리턴
+
+        override fun createFragment(position: Int): Fragment {
+            return when (position) { // 페이지 포지션에 따라 그에 맞는 프래그먼트를 보여줌
+                0 -> OnboardingFragment.newInstance(
+                    title = getString(R.string.first_on_boarding_page_title),
+                    content = getString(R.string.first_on_boarding_page_content),
+                )
+
+                1 -> OnboardingFragment.newInstance(
+                    title = getString(R.string.second_on_boarding_page_title),
+                    content = getString(R.string.second_on_boarding_page_content),
+                )
+
+                else -> OnboardingFragment.newInstance(
+                    title = getString(R.string.third_on_boarding_page_title),
+                    content = getString(R.string.third_on_boarding_page_content),
+                )
+            }
+        }
+    }
+}

presentation/onboarding/src/main/java/com/depromeet/threedays/onboarding/OnboardingFragment.kt

@@ -0,0 +1,61 @@
+package com.depromeet.threedays.onboarding
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.fragment.app.Fragment
+import com.depromeet.threedays.onboarding.databinding.FragmentOnboardingBinding
+import dagger.hilt.android.AndroidEntryPoint
+
+private const val ARG_PARAM1 = "param1"
+private const val ARG_PARAM2 = "param2"
+
+@AndroidEntryPoint
+class OnboardingFragment : Fragment() {
+    private var _binding: FragmentOnboardingBinding? = null
+    private val binding get() = _binding!!
+
+    private var title: String? = null
+    private var content: String? = null
+
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View {
+        super.onCreateView(inflater, container, savedInstanceState)
+        arguments?.let {
+            title = it.getString(ARG_PARAM1)
+            content = it.getString(ARG_PARAM2)
+        }
+
+        _binding = FragmentOnboardingBinding.inflate(inflater, container, false)
+        binding.lifecycleOwner = viewLifecycleOwner
+
+        return binding.root
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        super.onViewCreated(view, savedInstanceState)
+
+        binding.tvTitle.text = title
+        binding.tvContent.text = content
+    }
+
+    override fun onDestroyView() {
+        super.onDestroyView()
+        _binding = null
+    }
+
+    companion object {
+        @JvmStatic
+        fun newInstance(title: String, content: String) =
+            OnboardingFragment().apply {
+                arguments = Bundle().apply {
+                    putString(ARG_PARAM1, title)
+                    putString(ARG_PARAM2, content)
+                }
+            }
+    }
+}

presentation/onboarding/src/main/res/layout/activity_onboarding.xml

@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout 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">
+
+    <data>
+
+    </data>
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        tools:context=".OnboardingActivity">
+
+        <View
+            android:id="@+id/view_first_indicator"
+            android:layout_width="0dp"
+            android:layout_height="4dp"
+            android:layout_marginTop="20dp"
+            android:layout_marginStart="30dp"
+            android:background="@drawable/bg_rect_gray500_r4"
+            app:layout_constraintEnd_toStartOf="@+id/view_second_indicator"
+            app:layout_constraintHorizontal_chainStyle="packed"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent" />
+
+        <View
+            android:id="@+id/view_second_indicator"
+            android:layout_width="0dp"
+            android:layout_height="4dp"
+            android:layout_marginTop="20dp"
+            android:layout_marginHorizontal="4dp"
+            android:background="@drawable/bg_rect_gray200_r4"
+            app:layout_constraintEnd_toStartOf="@+id/view_third_indicator"
+            app:layout_constraintStart_toEndOf="@+id/view_first_indicator"
+            app:layout_constraintTop_toTopOf="parent" />
+
+        <View
+            android:id="@+id/view_third_indicator"
+            android:layout_width="0dp"
+            android:layout_height="4dp"
+            android:layout_marginTop="20dp"
+            android:layout_marginEnd="30dp"
+            android:background="@drawable/bg_rect_gray200_r4"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toEndOf="@+id/view_second_indicator"
+            app:layout_constraintTop_toTopOf="parent" />
+
+        <androidx.viewpager2.widget.ViewPager2
+            android:id="@+id/vp_on_boarding"
+            android:layout_width="0dp"
+            android:layout_height="0dp"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/view_first_indicator"
+            app:layout_constraintBottom_toTopOf="@+id/btn_next" />
+
+        <androidx.appcompat.widget.AppCompatButton
+            android:id="@+id/btn_next"
+            android:layout_width="0dp"
+            android:layout_height="56dp"
+            android:layout_marginBottom="30dp"
+            android:layout_marginHorizontal="20dp"
+            android:background="@drawable/bg_rect_gray800_r15"
+            android:text="다음"
+            android:textAppearance="@style/Typography.Button1"
+            android:textColor="@color/white"
+            android:gravity="center"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintEnd_toEndOf="parent" />
+    </androidx.constraintlayout.widget.ConstraintLayout>
+</layout>