Merge pull request #8 from NOW-SOPT-ANDROID/feat/#6-week2_compose

Feat/#6 week2 compose 필수과제 구현

app/build.gradle

@@ -62,4 +62,6 @@ dependencies {
     androidTestImplementation 'androidx.compose.ui:ui-test-junit4'
     debugImplementation 'androidx.compose.ui:ui-tooling'
     debugImplementation 'androidx.compose.ui:ui-test-manifest'
+    //view model
+    implementation "androidx.lifecycle:lifecycle-viewmodel-ktx:2.6.2"
 }

app/src/main/java/com/sopt/now/compose/BottomNavigationItem.kt

@@ -0,0 +1,8 @@
+package com.sopt.now.compose
+
+import androidx.compose.ui.graphics.vector.ImageVector
+
+data class BottomNavigationItem(
+    val icon: ImageVector,
+    val label: String
+)

app/src/main/java/com/sopt/now/compose/Friend.kt

@@ -0,0 +1,9 @@
+package com.sopt.now.compose
+
+import androidx.compose.ui.graphics.vector.ImageVector
+
+data class Friend(
+    val profileImage: ImageVector,
+    val name: String,
+    val selfDescription: String,
+)

app/src/main/java/com/sopt/now/compose/FriendProfileItem.kt

@@ -0,0 +1,51 @@
+package com.sopt.now.compose
+
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+
+
+@Composable
+fun FriendProfileItem(friendImg: ImageVector, friendName: String, friendDescription: String) {
+    Row(
+        modifier = Modifier
+            .fillMaxWidth()
+            .padding(vertical = 10.dp),
+        verticalAlignment = Alignment.CenterVertically
+    ) {
+        Icon(
+            modifier = Modifier.size(50.dp),
+            imageVector = friendImg,
+            contentDescription = null
+        )
+        Spacer(modifier = Modifier.width(10.dp))
+        Text(
+            text = friendName,
+            fontSize = 14.sp,
+            fontWeight = FontWeight.Bold,
+            overflow = TextOverflow.Ellipsis,
+            maxLines = 1
+        )
+        Spacer(modifier = Modifier.width(30.dp))
+        Spacer(modifier = Modifier.weight(1f))
+        Text(
+            text = friendDescription,
+            fontSize = 10.sp,
+            overflow = TextOverflow.Ellipsis,
+            maxLines = 1
+        )
+    }
+}

app/src/main/java/com/sopt/now/compose/HomeScreen.kt

@@ -0,0 +1,33 @@
+package com.sopt.now.compose
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun HomeUi(viewModel: HomeViewModel) {
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+            .padding(horizontal = 10.dp),
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        LazyColumn {
+            items(viewModel.userList) {
+                UserProfileItem(it)
+                HorizontalDivider(thickness = 1.dp, color = Color.DarkGray)
+            }
+            items(viewModel.friendList) {
+                FriendProfileItem(it.profileImage,it.name,it.selfDescription)
+            }
+        }
+    }
+}

app/src/main/java/com/sopt/now/compose/HomeViewModel.kt

@@ -0,0 +1,93 @@
+package com.sopt.now.compose
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Person
+import androidx.lifecycle.ViewModel
+
+class HomeViewModel : ViewModel() {
+
+    val userList = listOf<User>(
+        User(
+            profileImage = R.drawable.cute,
+            name = "송혜음",
+            selfDescription = "여러분 보고 시퍼yo 훌쩍훌쩍"
+        )
+    )
+
+    val friendList = listOf<Friend>(
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "박동민",
+            selfDescription = "곽의진...얼굴 재치 실력 모든걸 다 가진 남자... 하지만 밀양박씨 36대손인 나 박동민은 가지지 못했지"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "이석준",
+            selfDescription = "죄송합니다 저 도핑했습니다... 안드-로이더 \uD83D\uDC89"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "박유진",
+            selfDescription = "(ง˙∇˙)ว 에라 모르겠다"
+        ), Friend(
+            profileImage = Icons.Filled.Person,
+            name = "이의경",
+            selfDescription = "다들 빨리 끝내고 뒤풀이 가고 싶지?"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "우상욱",
+            selfDescription = "나보다 안드 잘하는 사람 있으면 나와봐"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "배지현",
+            selfDescription = "표정 풀자 ^^"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "이의경",
+            selfDescription = "다들 빨리 끝내고 뒤풀이 가고 싶지?"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "우상욱",
+            selfDescription = "나보다 안드 잘하는 사람 있으면 나와봐"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "배지현",
+            selfDescription = "표정 풀자 ^^"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "이의경",
+            selfDescription = "다들 빨리 끝내고 뒤풀이 가고 싶지?"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "우상욱",
+            selfDescription = "나보다 안드 잘하는 사람 있으면 나와봐"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "배지현",
+            selfDescription = "표정 풀자 ^^"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "이의경",
+            selfDescription = "다들 빨리 끝내고 뒤풀이 가고 싶지?"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "우상욱",
+            selfDescription = "나보다 안드 잘하는 사람 있으면 나와봐"
+        ),
+        Friend(
+            profileImage = Icons.Filled.Person,
+            name = "배지현",
+            selfDescription = "표정 풀자 ^^"
+        )
+    )
+}

app/src/main/java/com/sopt/now/compose/LoginActivity.kt

@@ -1,5 +1,6 @@
 package com.sopt.now.compose
 
+import android.content.Context
 import android.content.Intent
 import android.os.Bundle
 import android.widget.Toast
@@ -12,6 +13,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Lock
 import androidx.compose.material.icons.filled.Person
 import androidx.compose.material3.Button
 import androidx.compose.material3.Icon
@@ -39,26 +41,41 @@ class LoginActivity : ComponentActivity() {
         super.onCreate(savedInstanceState)
         setContent {
             NOWSOPTAndroidTheme {
-                // A surface container using the 'background' color from the theme
                 Surface(
                     modifier = Modifier.fillMaxSize(),
                     color = MaterialTheme.colorScheme.background
                 ) {
                     val userId = intent.getStringExtra("userId")
                     val userPw = intent.getStringExtra("userPw")
                     val userNick = intent.getStringExtra("userNick")
-                    LoginUI(userId,userPw,userNick)
+                    var id by remember { mutableStateOf("") }
+                    var pw by remember { mutableStateOf("") }
+
+                    LoginScreen(
+                        userId,
+                        userPw,
+                        userNick,
+                        id,
+                        pw,
+                        onIdChange = { id = it },
+                        onPwChange = { pw = it })
                 }
             }
         }
     }
 }
-//로그인 화면
+
 @Composable
-fun LoginUI(userId: String?="", userPw:String?="", userNick:String?="") {
+fun LoginScreen(
+    userId: String?,
+    userPw: String?,
+    userNick: String?,
+    id: String,
+    pw: String,
+    onIdChange: (String) -> Unit,
+    onPwChange: (String) -> Unit
+) {
     val context = LocalContext.current
-    var id by remember { mutableStateOf("") }
-    var pw by remember { mutableStateOf("") }
 
     Column(
         modifier = Modifier
@@ -76,41 +93,32 @@ fun LoginUI(userId: String?="", userPw:String?="", userNick:String?="") {
         )
         TextField(
             value = id,
-            onValueChange = {id = it},
+            onValueChange = onIdChange,
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(10.dp),
-            placeholder = {Text(stringResource(R.string.tf_login_id))},
+            placeholder = { Text(stringResource(R.string.tf_login_id)) },
             singleLine = true,
-            leadingIcon = { Icon(Icons.Filled.Person,contentDescription = "User Icon") }
-            )
+            leadingIcon = { Icon(Icons.Filled.Person, contentDescription = "User Icon") }
+        )
         Spacer(modifier = Modifier.height(30.dp))
         Text(text = stringResource(R.string.text_pw))
         TextField(
             value = pw,
-            onValueChange = {pw = it},
+            onValueChange = onPwChange,
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(10.dp),
-            placeholder = {Text(stringResource(R.string.tf_login_pw))},
+            placeholder = { Text(stringResource(R.string.tf_login_pw)) },
             singleLine = true,
             visualTransformation = PasswordVisualTransformation(),
-            leadingIcon = { Icon(Icons.Filled.Person,contentDescription = "User Icon") },
+            leadingIcon = { Icon(Icons.Filled.Lock, contentDescription = "Lock Icon") },
         )
         Spacer(modifier = Modifier.weight(1f))
         Button(
             onClick = {
-                val message = when{
-                    userId != id || userPw != pw -> context.getString(R.string.login_error)
-                    else -> {
-                        val intent = Intent(context, MainActivity::class.java)
-                        intent.putExtra("userId",userId).putExtra("userPw", userPw).putExtra("userNick", userNick)
-                        context.startActivity(intent)
-                        context.getString(R.string.login_success)
-                    }
-                }
-                Toast.makeText(context,message,Toast.LENGTH_SHORT).show()
-                      },
+                isLoginAvailable(context, userId, userPw, userNick, id, pw)
+            },
             modifier = Modifier
                 .fillMaxWidth()
         ) {
@@ -119,20 +127,44 @@ fun LoginUI(userId: String?="", userPw:String?="", userNick:String?="") {
         Spacer(modifier = Modifier.height(20.dp))
         Button(
             onClick = {
-                val intent = Intent(context,SignUpActivity::class.java)
+                val intent = Intent(context, SignUpActivity::class.java)
                 context.startActivity(intent)
-                      },
+            },
             modifier = Modifier
                 .fillMaxWidth()
         ) {
             Text(stringResource(R.string.btn_sign_up))
         }
     }
 }
+
+fun isLoginAvailable(
+    context: Context,
+    userId: String?,
+    userPw: String?,
+    userNick: String?,
+    id: String?,
+    pw: String?
+) {
+    val message = when {
+        userId != id || userPw != pw -> R.string.login_error
+        else -> {
+            val intent = Intent(context, MainActivity::class.java).apply {
+                putExtra("userId", userId)
+                putExtra("userPw", userPw)
+                putExtra("userNick", userNick)
+            }
+            context.startActivity(intent)
+            R.string.login_success
+        }
+    }
+    Toast.makeText(context, message, Toast.LENGTH_SHORT).show()
+}
+
 @Preview(showBackground = true)
 @Composable
-fun GreetingPreview2() {
+fun LoginPreview() {
     NOWSOPTAndroidTheme {
-        LoginUI()
+        LoginScreen("아이디", "비밀번호", "닉네임","","", onIdChange = {}, onPwChange = {})
     }
 }