[Feature] 버튼 디자인 시스템 구축 (모듈화)

app/build.gradle.kts

@@ -79,6 +79,7 @@ android {
 dependencies {
     implementation(project(":data"))
     implementation(project(":domain"))
+    implementation(project(":jj_design"))
     implementation("androidx.appcompat:appcompat:1.5.0")
     implementation("com.google.android.material:material:1.4.0")
     implementation("androidx.constraintlayout:constraintlayout:2.1.4")

app/src/main/AndroidManifest.xml

@@ -24,6 +24,9 @@
         android:theme="@style/Theme.JJBAKSAAOS"
         android:usesCleartextTraffic="true"
         tools:targetApi="33">
+        <activity
+            android:name=".ui.DesignComponentSampleActivity"
+            android:exported="false" />
         <activity
             android:name=".ui.follower.FollowerProfileActivity"
             android:exported="false" />

app/src/main/java/com/jjbaksa/jjbaksa/ui/DesignComponentSampleActivity.kt

@@ -0,0 +1,91 @@
+package com.jjbaksa.jjbaksa.ui
+
+import android.os.Bundle
+import androidx.appcompat.app.AppCompatActivity
+import com.android.jj_design.utils.button.Add
+import com.android.jj_design.utils.button.Confirm
+import com.android.jj_design.utils.button.Delete
+import com.android.jj_design.utils.button.Follow
+import com.android.jj_design.utils.button.Following
+import com.android.jj_design.utils.button.Minus
+import com.android.jj_design.utils.button.Position
+import com.android.jj_design.utils.button.Requested
+import com.jjbaksa.jjbaksa.databinding.ActivityDesignComponentSampleBinding
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.isActive
+import kotlinx.coroutines.launch
+
+class DesignComponentSampleActivity : AppCompatActivity() {
+    private lateinit var binding: ActivityDesignComponentSampleBinding
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        binding = ActivityDesignComponentSampleBinding.inflate(layoutInflater)
+        setContentView(binding.root)
+
+        initJjButton()
+        initJjChipButton()
+        initJjTrendButton()
+        initJjMapButton()
+    }
+
+    private fun initJjButton() {
+        CoroutineScope(Dispatchers.Main).launch {
+            while (this.isActive) {
+                binding.jjButton.setErrorBackground()
+                binding.jjButton.text = "오류 버튼"
+                delay(2000)
+                binding.jjButton.isEnabled = true
+                binding.jjButton.text = "활성화 버튼"
+                delay(2000)
+                binding.jjButton.isEnabled = false
+                binding.jjButton.text = "비활성화 버튼"
+                delay(2000)
+            }
+        }
+    }
+
+    private fun initJjChipButton() {
+        CoroutineScope(Dispatchers.Main).launch {
+            while (isActive) {
+                binding.jjChipButton.setChipItemType(Delete)
+                delay(2000)
+                binding.jjChipButton.setChipItemType(Confirm)
+                delay(2000)
+                binding.jjChipButton.setChipItemType(Requested)
+                delay(2000)
+                binding.jjChipButton.setChipItemType(Follow)
+                delay(2000)
+                binding.jjChipButton.setChipItemType(Following)
+                delay(2000)
+            }
+        }
+    }
+
+    private fun initJjTrendButton() {
+        CoroutineScope(Dispatchers.Main).launch {
+            while (isActive) {
+                binding.jjTrendButton.isEnabled = true
+                binding.jjTrendButton.text = "#성수동 맛집"
+                delay(2000)
+                binding.jjTrendButton.isEnabled = false
+                binding.jjTrendButton.text = "#카페 마이야르"
+                delay(2000)
+            }
+        }
+    }
+
+    private fun initJjMapButton() {
+        CoroutineScope(Dispatchers.Main).launch {
+            while (isActive) {
+                binding.jjMapButton.setJjMapType(Add)
+                delay(2000)
+                binding.jjMapButton.setJjMapType(Minus)
+                delay(2000)
+                binding.jjMapButton.setJjMapType(Position)
+                delay(2000)
+            }
+        }
+    }
+}

app/src/main/res/layout/activity_design_component_sample.xml

@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="utf-8"?>
+<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:orientation="vertical"
+    tools:context=".ui.DesignComponentSampleActivity">
+
+    <TextView
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:padding="10dp"
+        android:text="Button Design Component"
+        android:textColor="@color/black"
+        android:background="@color/color_C4C4C4"/>
+
+    <com.android.jj_design.button.JjButton
+        android:id="@+id/jj_button"
+        android:layout_marginTop="10dp"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:jjText="1234"
+        app:jjTextColor="@color/color_white"/>
+    <com.android.jj_design.button.JjIconButton
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"
+        app:jjIconText="리뷰하기"
+        app:jjIconTextColor="@color/color_666666"
+        app:jjIconDrawableStart="@drawable/icon_pencil"/>
+    <com.android.jj_design.button.JjChipButton
+        android:id="@+id/jj_chip_button"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"
+        app:jjChipType="Confirm"/>
+    <com.android.jj_design.button.JjTrendButton
+        android:id="@+id/jj_trend_button"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"/>
+
+    <com.android.jj_design.button.JjPlusButton
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"/>
+
+    <com.android.jj_design.button.JjMapButton
+        android:id="@+id/jj_map_button"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"
+        app:jjMapType="Add"/>
+</LinearLayout>

jj_design/.gitignore

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

jj_design/README.md

@@ -0,0 +1,126 @@
+# JJUPBAK Design System
+## Getting Started
+- [Button](#button)
+    - [JjButton](#jjbutton)
+    - [JjIconButton](#jjiconbutton)
+    - [JjChipButton](#jjchipbutton)
+    - [JjPlusButton](#jjplusbutton)
+    - [JjTrendButton](#jjtrendbutton)
+    - [JjMapButton](#jjmapbutton)
+
+## Button
+! Button Design Component example
+
+![alt text](images/button_test.gif)
+### JjButton
+<img width = 200px height = 300px src="images/jjbutton.png">
+
+- XML Code
+```kotlin
+<com.android.jj_design.button.JjButton
+    android:id="@+id/jj_button"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    app:jjText="1234"
+    app:jjTextColor="@color/color_white"/>
+```
+- Programmatically Code
+    - Enabled Button   
+    ![alt text](images/jjbutton_enabled.png)
+    ```kotlin
+    binding.jjButton.isEnabled = true
+    ```
+    - Disabled Button   
+    ![alt text](images/jjbutton_disabled.png)
+    ```kotlin
+    binding.jjButton.isEnabled = true
+    ```
+    - Error Button   
+    ![alt text](images/jjbutton_error.png)
+    ```kotlin
+    binding.jjButton.setErrorBackground()
+    ```
+
+### JjIconButton
+![alt text](images/jjiconbutton.png)
+
+- XML Code
+```kotlin
+<com.android.jj_design.button.JjIconButton
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    app:jjIconText="리뷰하기"
+    app:jjIconTextColor="@color/color_666666"
+    app:jjIconDrawableStart="@drawable/icon_pencil"/>
+```
+
+### JjChipButton
+![alt text](images/jjchipbutton.png)
+
+- XML Code
+```kotlin
+<com.android.jj_design.button.JjChipButton
+    android:id="@+id/jj_chip_button"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    app:jjChipType="Confirm"/>
+    // Delete, Confirm, Requested, Follow, Following
+```
+
+- Programmatically Code (use jjChipType)
+    ```kotlin
+    binding.jjChipButton.setChipItemType(Confirm)
+    ```
+
+### JjPlusButton
+![alt text](images/jjplusbutton.png)
+
+- XML Code
+```kotlin
+<com.android.jj_design.button.JjPlusButton
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"/>
+```
+
+### JjTrendButton
+
+- XML Code
+```kotlin
+<com.android.jj_design.button.JjTrendButton
+    android:id="@+id/jj_trend_button"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"/>
+```
+
+- Programmatically Code
+    - Enabled Trend Button   
+    ![alt text](images/jjtrendbutton_enabled.png)
+        ```kotlin
+        binding.jjTrendButton.isEnabled = true
+        ```
+
+    - Disabled Trend Button   
+    ![alt text](images/jjtrendbutton_disabled.png)
+        ```kotlin
+        binding.jjTrendButton.isEnabled = false
+        ```
+
+
+### JjMapButton
+![alt text](images/jjmapbutton.png)
+
+- XML Code
+```kotlin
+<com.android.jj_design.button.JjMapButton
+    android:id="@+id/jj_map_button"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginTop="10dp"
+    app:jjMapType="Add"/>
+    // Add, Minus, Position
+```
+
+- Programmatically Code
+```kotlin
+binding.jjMapButton.setJjMapType(Add) // Minus, Position
+```

jj_design/build.gradle.kts

@@ -0,0 +1,44 @@
+plugins {
+    id("com.android.library")
+    id("org.jetbrains.kotlin.android")
+}
+
+android {
+    namespace = "com.android.jj_design"
+    compileSdk = 33
+
+    defaultConfig {
+        minSdk = 24
+
+        testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
+        consumerProguardFiles("consumer-rules.pro")
+    }
+
+    buildTypes {
+        release {
+            isMinifyEnabled = 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"
+    }
+}
+
+dependencies {
+
+    implementation("androidx.core:core-ktx:1.8.0")
+    implementation("androidx.appcompat:appcompat:1.6.1")
+    implementation("com.google.android.material:material:1.8.0")
+    implementation("androidx.constraintlayout:constraintlayout:2.1.4")
+    testImplementation("junit:junit:4.13.2")
+    androidTestImplementation("androidx.test.ext:junit:1.1.5")
+    androidTestImplementation("androidx.test.espresso:espresso-core:3.5.1")
+}

jj_design/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