CompseCamp2022 for Beginner - from Atlas

Unit1/Pathway3/BirthdayCard/app/src/main/java/com/example/happybirthday/MainActivity.kt

@@ -38,23 +38,69 @@ import com.example.happybirthday.ui.theme.HappyBirthdayTheme
 class MainActivity : ComponentActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
- setContent { }
+ setContent {
+ HappyBirthdayTheme() {
+ Surface(color = MaterialTheme.colors.background) {
+ BirthdayGreetingWithImage(message = getString(R.string.happy_birthday_text), from = getString(
+ R.string.signature_text))
+ }
+ }
+ }
  }
 }
 
 // 7. 텍스트 정렬 및 패딩 추가
 @Composable
 fun BirthdayGreetingWithText(message: String, from: String) {
  // Create a column so that texts don't overlap
- Column { }
+ Column {
+ Text(
+ text = message,
+ fontSize = 36.sp,
+ modifier = Modifier
+ .fillMaxWidth()
+ .wrapContentWidth(Alignment.CenterHorizontally)
+ .padding(start = 16.dp, top = 16.dp)
+ )
+
+ Text(
+ text = from,
+ fontSize = 24.sp,
+ modifier = Modifier
+ .fillMaxWidth()
+ .wrapContentWidth(Alignment.CenterHorizontally)
+ .padding(start = 16.dp, end = 16.dp)
+
+ )
+ }
 }
 
 // 5. Box 레이아웃 추
 @Composable
-fun BirthdayGreetingWithImage(message: String, from: String) { }
+fun BirthdayGreetingWithImage(message: String, from: String) {
+ val image = painterResource(id = R.drawable.androidparty)
+
+ Box {
+ Image(
+ painter = image,
+ contentDescription = null,
+ modifier = Modifier
+ .fillMaxHeight()
+ .fillMaxWidth(),
+ contentScale = ContentScale.Crop
+
+ )
+ BirthdayGreetingWithText(message = message, from = from)
+ }
+}
 
 // 4. 이미지 컴포저블 추가
 @Preview(showBackground = false)
 @Composable
-private fun BirthdayCardPreview() { }
+private fun BirthdayCardPreview() { 
+ HappyBirthdayTheme() {
+ BirthdayGreetingWithText(message = "Happy Birthday Sam", from = "-from Emma")
+ BirthdayGreetingWithImage(message = "Happy Birthday Sam!", from = "-from Emma")
+ }
+}
 

Unit1/Pathway3/BirthdayCard/app/src/main/res/values/strings.xml

@@ -16,4 +16,6 @@
  -->
 <resources>
  <string name="app_name">Happy Birthday</string>
+ <string name="happy_birthday_text">Haapy B-day Sam!</string>
+ <string name="signature_text">- from Aritee</string>
 </resources>

Unit1/Pathway3/ComposeArticle/app/src/main/java/com/example/composearticle/MainActivity.kt

@@ -1,16 +1,14 @@
 package com.example.composearticle
-
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.compose.foundation.Image
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.*
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Surface
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.res.painterResource
@@ -24,12 +22,32 @@ import com.example.composearticle.ui.theme.ComposeArticleTheme
 class MainActivity : ComponentActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
- setContent { }
+ setContent {
+ ComposeArticleTheme() {
+ ComposeArticleApp()
+ }
+
+ /*
+ ComposeArticleTheme() {
+ Surface(color = MaterialTheme.colors.background) {
+ ComposeArticleApp()
+ }
+ }
+ */
+ }
  }
 }
 
 @Composable
-fun ComposeArticleApp() { }
+fun ComposeArticleApp() {
+ val image = painterResource(id = R.drawable.bg_compose_background)
+ ArticleCard(
+ title = stringResource(R.string.title_jetpack_compose_tutorial),
+ shortDescription = stringResource(R.string.compose_long_desc),
+ longDescription = stringResource(id = R.string.compose_long_desc),
+ imagePainter = image
+ )
+}
 
 @Composable
 private fun ArticleCard(
@@ -39,10 +57,49 @@ private fun ArticleCard(
  imagePainter: Painter,
  modifier: Modifier = Modifier,
 ) {
- Column() { }
+ Column() {
+ Image(
+ painter = imagePainter,
+ contentDescription = null,
+ modifier = Modifier
+ .fillMaxWidth()
+ )
+
+ Text(
+ text = title,
+ fontSize = 24.sp,
+ modifier = Modifier
+ .padding(16.dp)
+ )
+
+ Text(
+ text = shortDescription,
+ textAlign = TextAlign.Justify,
+ modifier = Modifier
+ .padding(start = 16.dp, end = 16.dp)
+ )
+
+ Text(
+ text = longDescription,
+ textAlign = TextAlign.Justify,
+ modifier = Modifier
+ .padding(16.dp)
+ )
+
+
+
+ }
 }
 
 
 @Preview(showBackground = true)
 @Composable
-fun DefaultPreview() { }
+fun DefaultPreview() {
+ val image = painterResource(id = R.drawable.bg_compose_background)
+ ArticleCard(
+ title = "Jetpack Compose tutorial",
+ shortDescription = "Jetpack Compose is a modern toolkit for building native Android UI. Compose simplifies and accelerates UI development on Android with less code, powerful tools, and intuitive Kotlin APIs.",
+ longDescription = "In this tutorial, you build a simple UI component with declarative functions. You call Compose functions to say what elements you want and the Compose compiler does the rest. Compose is built around Composable functions. These functions let you define your app\\'s UI programmatically because they let you describe how it should look and provide data dependencies, rather than focus on the process of the UI\\'s construction, such as initializing an element and then attaching it to a parent. To create a Composable function, you add the @Composable annotation to the function name." ,
+ imagePainter = image)
+
+}

Unit1/Pathway3/ComposeArticle/app/src/main/res/values/strings.xml

@@ -4,4 +4,7 @@
  <string name="title_jetpack_compose_tutorial">Jetpack Compose tutorial</string>
  <string name="compose_short_desc">Jetpack Compose is a modern toolkit for building native Android UI. Compose simplifies and accelerates UI development on Android with less code, powerful tools, and intuitive Kotlin APIs.</string>
  <string name="compose_long_desc">In this tutorial, you build a simple UI component with declarative functions. You call Compose functions to say what elements you want and the Compose compiler does the rest. Compose is built around Composable functions. These functions let you define your app\'s UI programmatically because they let you describe how it should look and provide data dependencies, rather than focus on the process of the UI\'s construction, such as initializing an element and then attaching it to a parent. To create a Composable function, you add the @Composable annotation to the function name.</string>
+
+ <string name="article_title">Jetpack Compose tutorial</string>
+ <string name="short_description">Jetpack Compose is a modern toolkit for building native Android UI. Compose simplifies and accelerates UI development on Android with less code, powerful tools, and intuitive Kotlin APIs.</string>
 </resources>

Unit1/Pathway3/ComposeQuadrant/app/src/main/java/com/example/composequadrant/MainActivity.kt

@@ -1,6 +1,7 @@
 package com.example.composequadrant
 
 import android.os.Bundle
+import android.view.Surface
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.compose.foundation.background
@@ -22,15 +23,45 @@ import com.example.composequadrant.ui.theme.ComposeQuadrantTheme
 class MainActivity : ComponentActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
- setContent { }
+ setContent {
+ ComposeQuadrantTheme() {
+ Surface{
+ ComposeQuadrantApp()
+ }
+ }
+ }
  }
 }
 
+/*
+*
+*
+* @Stable
+ fun Modifier.weight(
+ /*@FloatRange(from = 0.0, fromInclusive = false)*/
+ weight: Float,
+ fill: Boolean = true
+ ): Modifier
+*
+* */
 @Composable
 fun ComposeQuadrantApp() {
- Column() {
- Row() { }
- Row() { }
+ Column(
+ modifier = Modifier.fillMaxSize()
+ ) {
+ Row(
+ modifier = Modifier.weight(1f)
+ ) {
+
+ ComposableInfoCard(title = stringResource(id = R.string.first_title) , description = stringResource(id = R.string.first_description), backgroundColor = Color.Green, modifier = Modifier.weight(1f))
+ ComposableInfoCard(title = stringResource(id = R.string.second_title) , description = stringResource(id = R.string.second_description), backgroundColor = Color.Yellow, modifier = Modifier.weight(1f))
+ }
+ Row(
+ modifier = Modifier.weight(1f)
+ ) {
+ ComposableInfoCard(title = stringResource(id = R.string.third_title) , description = stringResource(id = R.string.third_description), backgroundColor = Color.Cyan, modifier = Modifier.weight(1f))
+ ComposableInfoCard(title = stringResource(id = R.string.fourth_title) , description = stringResource(id = R.string.first_description), backgroundColor = Color.LightGray, modifier = Modifier.weight(1f))
+ }
  }
 }
 
@@ -41,10 +72,37 @@ private fun ComposableInfoCard(
  backgroundColor: Color,
  modifier: Modifier = Modifier
 ) {
- Column( ) { }
+ Column(
+ verticalArrangement = Arrangement.Center,
+ horizontalAlignment = Alignment.CenterHorizontally,
+ modifier = modifier
+ .background(backgroundColor)
+ .fillMaxSize()
+ .padding(16.dp)
+ ) {
+ Text(
+ text = title,
+ modifier = Modifier
+ .padding(bottom = 16.dp),
+ fontWeight = FontWeight.Bold
+ )
+
+ Text(
+ text = description,
+ textAlign = TextAlign.Justify
+
+ )
+
+ }
 }
 
 
 @Preview(showBackground = true)
 @Composable
-fun DefaultPreview() { }
+fun DefaultPreview() {
+ ComposeQuadrantTheme() {
+ Surface{
+ ComposeQuadrantApp()
+ }
+ }
+}

Unit1/Pathway3/TaskCompleted/app/src/main/java/com/example/taskcompleted/MainActivity.kt

@@ -14,6 +14,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
@@ -22,15 +23,57 @@ import com.example.taskcompleted.ui.theme.TaskCompletedTheme
 class MainActivity : ComponentActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
- setContent { }
+ setContent {
+ TaskCompletedTheme() {
+ androidx.compose.material.Surface {
+ TaskCompletedScreen()
+ }
+ }
+ }
  }
 }
 
 @Composable
 fun TaskCompletedScreen() {
- Column( ) { }
+ val image = painterResource(id = R.drawable.ic_task_completed)
+ Column(
+ horizontalAlignment = Alignment.CenterHorizontally,
+ modifier = Modifier
+ .fillMaxWidth()
+ .fillMaxHeight(),
+ verticalArrangement = Arrangement.Center
+
+ ) {
+ Image(painter = image , contentDescription = null)
+
+ Text(
+ text = stringResource(id = R.string.all_task_completed),
+ fontSize = 24.sp,
+ textAlign = TextAlign.Center,
+ fontWeight = FontWeight.Bold,
+ modifier = Modifier.
+ padding(top = 24.dp, bottom = 8.dp)
+
+ )
+
+ Text(
+ text = stringResource(id = R.string.nice_work),
+ fontSize = 16.sp,
+ textAlign = TextAlign.Center
+
+ )
+
+
+ }
 }
 
 @Preview(showBackground = true)
 @Composable
-fun DefaultPreview() { }
+fun DefaultPreview() {
+ TaskCompletedTheme() {
+ androidx.compose.material.Surface {
+ TaskCompletedScreen()
+ }
+ }
+
+}

Unit2/Pathway2/.gitignore

@@ -0,0 +1,15 @@
+*.iml
+.gradle
+/local.properties
+/.idea/caches
+/.idea/libraries
+/.idea/modules.xml
+/.idea/workspace.xml
+/.idea/navEditor.xml
+/.idea/assetWizardSettings.xml
+.DS_Store
+/build
+/captures
+.externalNativeBuild
+.cxx
+local.properties