๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
2023 ์•ˆ๋“œ๋กœ์ด๋“œ/์•ˆ๋“œ๋กœ์ด๋“œ ์Šคํ„ฐ๋””

์ฒซ ๋ฒˆ์งธ Android ์•ฑ ๋งŒ๋“ค๊ธฐ 5

by hyeonha 2022. 11. 15.

๋ชฉ์ฐจ

     

    5) ํ…์ŠคํŠธ ์—…๋ฐ์ดํŠธ

     

    class MainActivity : ComponentActivity() {
        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContent {
                GreetingCardTheme {
                    // A surface container using the 'background' color from the theme
                    Surface(
                        modifier = Modifier.fillMaxSize(),
                        color = MaterialTheme.colors.background
                    ) {
                        Greeting("Android")
                    }
                }
            }
        }
    }

     onCreate() ํ•จ์ˆ˜๋Š” ์ด ์•ฑ์˜ ์ง„์ž…์ ์œผ๋กœ ๋‹ค๋ฅธ ํ•จ์ˆ˜๋ฅผ ํ˜ธ์ถœํ•˜์—ฌ ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค๋ฅผ ๋นŒ๋“œํ•œ๋‹ค. 

    Kotlin ํ”„๋กœ๊ทธ๋žจ์—์„œ main() ํ•จ์ˆ˜๊ฐ€ Kotlin ์ปดํŒŒ์ผ๋Ÿฌ๊ฐ€ ์‹œ์ž‘๋˜๋Š” ์ฝ”๋“œ์˜ ํŠน์ • ์œ„์น˜์ด๋‹ค.

    Android ์•ฑ์—์„œ๋Š” onCreate() ํ•จ์ˆ˜๊ฐ€ ์ด ์—ญํ• ์„ ํ•œ๋‹ค. 

     

    onCreate() ํ•จ์ˆ˜ ๋‚ด์˜ setContent() ํ•จ์ˆ˜๋Š” ๊ตฌ์„ฑ๊ฐ€๋Šฅํ•œ ํ•จ์ˆ˜๋ฅผ ํ†ตํ•ด ๋ ˆ์ด์•„์›ƒ์„ ์ •์˜ํ•œ๋‹ค.

    @Composable ์ฃผ์„์œผ๋กœ ํ‘œ์‹œ๋œ ๋ชจ๋“  ํ•จ์ˆ˜๋Š” setCotent() ํ•จ์ˆ˜ ๋˜๋Š” ๋‹ค๋ฅธ ๊ตฌ์„ฑ๊ฐ€๋Šฅํ•œ ํ•จ์ˆ˜์—์„œ ํ˜ธ์ถœ๊ฐ€๋Šฅ

    -> ๋‹ค๋ฅธ composable function์—์„œ ํ˜ธ์ถœ๊ฐ€๋Šฅ??์ด ๋ฌด์Šจ ๋ง์ผ๊นŒ?

     

    ์ฃผ์„์€ Jetpack Compose์—์„œ ์ด ํ•จ์ˆ˜๊ฐ€ UI๋ฅผ ์ƒ์„ฑํ•˜๋Š”๋ฐ ์‚ฌ์šฉ๋œ๋‹ค๊ณ  Kotlin ์ปดํŒŒ์ผ๋Ÿฌ์—๊ฒŒ ์•Œ๋ฆฐ๋‹ค.

     

    Greate() ํ•จ์ˆ˜๋Š” composable function์ด๋‹ค.

    ์œ„์—๋Š” @Composable ์ฃผ์„์ด ์žˆ๋‹ค.

    composable function์ด ๋ญ˜๊นŒ์š”???

    ์ผ๋ฐ˜ ํ•จ์ˆ˜์™€ ๋น„์Šทํ•˜์ง€๋งŒ ๋ช‡ ๊ฐ€์ง€ ์ฐจ์ด์ ์ด ์žˆ๋‹ค. ํ•จ์ˆ˜ ์ด๋ฆ„์€ ๋Œ€๋ฌธ์ž๋กœ ํ‘œ๊ธฐ๋˜๋ฉฐ 

    ํ•จ์ˆ˜ ์•ž์— @Composable ์ฃผ์„์„ ์ถ”๊ฐ€ํ•˜๊ณ  @Composable ํ•จ์ˆ˜๋Š” ์•„๋ฌด๊ฒƒ๋„ ๋ฐ˜ํ™˜ xx

    -> composable function๋Š” ๋ช‡ ๊ฐ€์ง€ ์ž…๋ ฅ์„ ๋ฐ›์•„์„œ ํ™”๋ฉด์— ํ‘œ์‹œ๋˜๋Š” ๋‚ด์šฉ์„ ์ƒ์„ฑํ•œ๋‹ค

     

    @Composable
    fun Greeting(name: String) {
       Text(text = "Hello $name!")
    }

     

    1. ํ•จ์ˆ˜ ์•ž์— @Composable ์ฃผ์„์„ ์ถ”๊ฐ€ํ•œ๋‹ค.

    2. @Composable ํ•จ์ˆ˜ ์ด๋ฆ„์€ ๋Œ€๋ฌธ์ž๋กœ ํ‘œ์‹œํ•œ๋‹ค.

    3. @Composable ํ•จ์ˆ˜๋Š” ์•„๋ฌด๊ฒƒ๋„ ๋ฐ˜ํ™˜ํ•  ์ˆ˜ ์—†๋‹ค.

     

    @Composable
    fun Greeting(name: String) {
       Text(text = "Hi, my name is $name!")
    }

    ๋””์ž์ธ ์ฐฝ์—์„œ ์ € ์™ผ์ชฝ ์ƒ๋‹จ์˜  ๋ฐ‘์˜ ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด DefaultPreview๋ฅผ ๋นŒ๋“œํ•  ์ˆ˜ ์žˆ๋‹ค.

    DefaultPreview()ํ•จ์ˆ˜๋Š” ์ „์ฒด ์•ฑ์„ ๋นŒ๋“œํ•˜์ง€ ์•Š๊ณ ๋„ ์•ฑ์ด ์–ด๋–ป๊ฒŒ ํ‘œ์‹œ๋˜๋Š” ์ง€ ํ™•์ธํ•  ์ˆ˜ ์žˆ๋‹ค.

    ๋ฏธ๋ฆฌ๋ณด๊ธฐ ํ•จ์ˆ˜๊ฐ€ ๋˜๋ ค๋ฉด @Preview ์ฃผ์„์„ ์ถ”๊ฐ€ํ•ด์•ผํ•œ๋‹ค.

    @Privew ์ฃผ์„์ด showBackground ๋ผ๋Š” ๋งค๊ฐœ๋ณ€์ˆ˜๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค. 

    showBackground ๊ฐ€ true๋กœ ์„ค์ •๋˜๋ฉด ์•ฑ ๋ฏธ๋ฆฌ๋ณด๊ธฐ์— ๋ฐฐ๊ฒฝ์ด ์ถ”๊ฐ€๋œ๋‹ค. 

    Android ์ŠคํŠœ๋””์˜ค๋Š” ๊ธฐ๋ณธ์ ์œผ๋กœ ํŽธ์ง‘๊ธฐ์— ๋ฐ์€ ํ…Œ๋งˆ๋ฅผ ์‚ฌ์šฉํ•˜๋ฏ€๋กœ showBackground = true์™€ false๊ฐ„์˜ ์ฐจ์ด๋ฅผ ํ™•์ธํ•˜๊ธฐ๊ฐ€ ์–ด๋ ค์šธ ์ˆ˜๋„ ์žˆ๋‹ค. ํ•˜์ง€๋งŒ ์–ด๋‘์šด ํ…Œ๋งˆ์—์„œ๋Š” ์ฐจ์ด๊ฐ€ ๋ถ„๋ช…ํ•œ๋‹ค. 

    @Preview(showBackground = true)
    @Composable
    fun DefaultPreview() {
       GreetingCardTheme {
           Greeting("Meghan")
       }
    }

     

    ์ด๋ฏธ์ง€์˜ ํฐ์ƒ‰ ๋ฐฐ๊ฒฝ์ด true๋กœ ์„ค์ •

     

    728x90