๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๐Ÿค์•ˆ๋“œ๋กœ์ด๋“œ ๊ฐœ๋ฐœ ๊ธฐ๋ก/Filmo ์˜ํ™” ํ”„๋กœ์ ํŠธ

Android LiveData & StateFlow ์ฐจ์ด ๋น„๊ตํ•ด๋ณด๊ธฐ(์ž‘์„ฑ์ค‘)

by hyeonha 2024. 6. 14.

๋ชฉ์ฐจ

    ๐Ÿ˜„๋“ค์–ด๊ฐ€๊ธฐ ์ „์—

    Android ๋ทฐ์— ๋ณด์ด๋Š” ๋ฐ์ดํ„ฐ๋ฅผ ์ฒ˜๋ฆฌํ•˜๊ธฐ ์œ„ํ•ด ๋ทฐ๋ชจ๋ธ์„ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ๋‹ค.

    ์„œ๋ฒ„์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์˜ค๋ฉด ์ด๋ฅผ ๋ฆฌ์‚ฌ์ดํด๋Ÿฌ๋ทฐ์— ๋‚˜ํƒ€๋‚ด๊ธฐ ์œ„ํ•ด LiveData๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ๋‹ค.

    ViewModel๊ณผ LiveData ๊ทธ๋ฆฌ๊ณ  StateFlow์— ๋Œ€ํ•ด ์ง์ ‘ ๊ตฌํ˜„ํ•ด๋ณด๋ฉฐ ์ดํ•ดํ•ด๋ณด๋ ค ํ•œ๋‹ค.

     

    ํŠนํžˆ LiveData์™€ StateFlow์˜ ๊ธฐ๋Šฅ์ด ์œ ์‚ฌํ•œ๋ฐ ์–ด๋–ค ์ฐจ์ด๊ฐ€ ์žˆ๋Š”์ง€ ์•Œ์•„๋ณด๋Š” ๊ฒƒ์ด ๋ชฉํ‘œ์ด๋‹ค!


    ๐ŸซฑUI ์ปจํŠธ๋กค๋Ÿฌ๋ž€?

    UI ์ปจํŠธ๋กค๋Ÿฌ์—๋Š” ํฐ ํ™”๋ฉด ํ•˜๋‚˜๋ฅผ ๋‚˜ํƒ€๋‚ด๋Š” ์•กํ‹ฐ๋น„ํ‹ฐ์™€ ๋ถ€๋ถ„ ํ™”๋ฉด์„ ์ด๋ฃจ๋Š” ํ”„๋ž˜๊ทธ๋จผํŠธ๊ฐ€ ์žˆ๋‹ค. UI ์ปจํŠธ๋กค๋Ÿฌ๋Š” ํ™”๋ฉด์— ๋ทฐ๋ฅผ ๊ทธ๋ฆฌ๊ณ  ์‚ฌ์šฉ์ž ์ด๋ฒคํŠธ๋‚˜ ์‚ฌ์šฉ์ž์™€ ์ƒํ˜ธ์ž‘์šฉํ•˜๋Š” ๋ชจ๋“  UI ๊ด€๋ จ ๋™์ž‘์„ ํฌ์ฐฉํ•˜์—ฌ UI๋ฅผ ์ œ์–ดํ•œ๋‹ค.

     

    ์ด ๋•Œ ์•ฑ์˜ ๋ฐ์ดํ„ฐ ๋˜๋Š” ๋ฐ์ดํ„ฐ์™€ ๊ด€๋ จ๋œ ๋กœ์ง์€ UI ์ปจํŠธ๋กค๋Ÿฌ ํด๋ž˜์Šค์— ํฌํ•จ๋˜์–ด์„œ๋Š” ์•ˆ๋œ๋‹ค.

    ๊ทธ ์ด์œ ๋Š” ์•ˆ๋“œ๋กœ์ด๋“œ ์‹œ์Šคํ…œ ํŠน์„ฑ ์ƒ ์‹œ์Šคํ…œ ์กฐ๊ฑด์œผ๋กœ ์ธํ•ด ์–ธ์ œ๋“ ์ง€ UI ์ปจํŠธ๋กค๋Ÿฌ๋ฅผ ์ œ๊ฑฐํ•  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค. ์ด๋ฅผ ๊ฐœ๋ฐœ์ž๊ฐ€ ์ œ์–ดํ•  ์ˆ˜ ์—†๊ธฐ ๋•Œ๋ฌธ์— UI ์ปจํŠธ๋กค๋Ÿฌ์— ์•ฑ ๋ฐ์ดํ„ฐ๋‚˜ ์ƒํƒœ๋ฅผ ์ €์žฅํ•˜๋ฉด ์•ˆ๋˜๋Š” ๊ฒƒ์ด๋‹ค!!

    ๋Œ€์‹  ์ด๋Ÿฌํ•œ ์•ฑ ๋ฐ์ดํ„ฐ๋‚˜ ์ƒํƒœ ๊ด€๋ จ ๋กœ์ง์„ ViewModel์—์„œ ์ฒ˜๋ฆฌํ•˜๋ฉด ๋œ๋‹ค.


    ๐ŸซฑViewModel : ์‚ฌ์šฉ์ž ์•ก์…˜์œผ๋กœ ๋ณ€๊ฒฝ๋˜๋Š” ๋ฐ์ดํ„ฐ ์ €์žฅํ•˜๊ธฐ

    ๋ทฐ๋ชจ๋ธ์ด๋ž€ ๋ทฐ์— ํ‘œ์‹œ๋˜๋Š” ์•ฑ์˜ ๋ฐ์ดํ„ฐ์˜ ์ฒ˜๋ฆฌ๋ฅผ ๋‹ด๋‹นํ•˜๋Š” ๊ตฌ์„ฑ ์š”์†Œ์ด๋‹ค. ํ™œ๋™์ด๋‚˜ ํ”„๋ž˜๊ทธ๋จผํŠธ๊ฐ€ ์†Œ๋ฉธ๋˜๊ณ  ๋‹ค์‹œ ์ƒ์„ฑ๋  ๋Œ€ ํ๊ธฐ๋˜์ง€ ์•Š๋Š” ์•ฑ ๊ด€๋ จ ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•œ๋‹ค.

    ViewModel ๊ฐ์ฒด๋Š” ๊ตฌ์„ฑ์ด ๋ณ€๊ฒฝ๋˜๋Š” ๋™์•ˆ ์ž๋™์œผ๋กœ ์œ ์ง€๋˜์–ด ๋ณด์œ ํ•˜๊ณ  ์žˆ๋Š” ๋ฐ์ดํ„ฐ๊ฐ€ ๋‹ค์Œ ํ™œ๋™ ๋˜๋Š” ํ”„๋ž˜๊ทธ๋จผํŠธ ๊ฐ์ฒด์— ์ฆ‰์‹œ ์‚ฌ์šฉ๋  ์ˆ˜ ์žˆ๋‹ค. 

    ๋ทฐ๋ชจ๋ธ ๊ฐ์ฒด๋Š” ํ™œ๋™์ด๋‚˜ ํ”„๋ž˜๊ทธ๋จผํŠธ ๊ฐ์ฒด์ฒ˜๋Ÿผ ์†Œ๋ฉธ๋˜์ง€ ์•Š๊ธฐ ๋•Œ๋ฌธ์ด๋‹ค

     

    ๋ทฐ๋ชจ๋ธ์„ ํ†ตํ•ด์„œ ์‚ฌ์šฉ์ž์™€์˜ ์ƒํ˜ธ์ž‘์šฉ์„ ํ†ตํ•ด ๋ณ€๊ฒฝ๋œ ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•  ์ˆ˜ ์žˆ๋‹ค. 

     

    1๏ธโƒฃ ๐Ÿ™…๋ทฐ ๋ชจ๋ธ์„ ๊ทธ๋ƒฅ  ์ธ์Šคํ„ด์Šคํ™”ํ•˜๋ฉด ์•ˆ๋˜๋Š” ์ด์œ !

    ์šฐ๋ฆฌ๋Š” ๊ฐ์ฒด๋ฅผ ์ดˆ๊ธฐํ™”ํ•ด์ค„ ๋•Œ ๊ฐ€์žฅ ๋‹จ์ˆœํ•˜๊ฒŒ๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•ด์ค€๋‹ค. 

    private val viewModel = GameViewModel()

     

    ๊ทธ๋Ÿฌ๋‚˜ ์ด๋ ‡๊ฒŒ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•ด์ค„ ๊ฒฝ์šฐ ๋ฌธ์ œ๊ฐ€ ์žˆ๋‹ค. 

     

    ๊ธฐ๊ธฐ์—์„œ ๊ตฌ์„ฑ ๋ณ€๊ฒฝ์ด ๋ฐœ์ƒํ•˜๋Š” ๋™์•ˆ ์•ฑ์€ ๋ทฐ๋ชจ๋ธ ์ฐธ์กฐ์˜ ์ƒํƒœ๋ฅผ ์†์‹คํ•˜๊ฒŒ ๋œ๋‹ค. ๊ธฐ๊ธฐ๊ฐ€ ํšŒ์ „ํ•˜๋ฉด ํ™œ๋™์ด ์†Œ๋ฉธ๋œ ํ›„ ๋‹ค์‹œ ์ƒ์„ฑ๋˜๊ณ  ์ดˆ๊ธฐ ์ƒํƒœ์˜ ์ƒˆ๋กœ์šด ๋ทฐ๋ชจ๋ธ ์ธ์Šคํ„ด์Šค๊ฐ€ ๋‹ค์‹œ ์‹œ์ž‘๋˜๋Š” ๋ฌธ์ œ๊ฐ€ ์žˆ๋Š” ๊ฒƒ์ด๋‹ค.

     

    ๋”ฐ๋ผ์„œ ์ด ๋ฐฉ์‹์ด ์•„๋‹ˆ๋ผ by viewModels() ์†์„ฑ ์œ„์ž„ ์ ‘๊ทผ ๋ฐฉ์‹์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ทฐ๋ชจ๋ธ์„ ์ดˆ๊ธฐํ™”ํ•ด์ค€๋‹ค.

    ๋ทฐ๋ชจ๋ธ์„ ์ดˆ๊ธฐํ™”ํ•  ๋•Œ ๊ณต์‹๋ฌธ์„œ๋ฅผ ๋ณด๊ณ  ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•ด์™”๋‹ค. ๋„๋Œ€์ฒด ์™œ ์ด๋ ‡๊ฒŒ ์ž‘์„ฑํ•ด์ฃผ์–ด์•ผํ•˜๋Š”๊ฑธ๊นŒ?

    private val viewModel: GameViewModel by viewModels()

     

    - ์†์„ฑ ์œ„์ž„ ์ ‘๊ทผ ๋ฐฉ์‹

    // Syntax for property delegation
    var <property-name> : <property-type> by <delegate-class>()

     

    ์ด๋ ‡๊ฒŒ ์†์„ฑ ์œ„์ž„ ์ ‘๊ทผ ๋ฐฉ์‹์„ ์‚ฌ์šฉํ•˜์—ฌ viewModel ๊ฐ์ฒด์˜ ์ฑ…์ž„์„ viewmodels ๋ผ๋Š” ๋ณ„๋„์˜ ํด๋ž˜์Šค์—๊ฒŒ ์œ„์ž„ํ•œ๋‹ค

     

    viewModel ๊ฐ์ฒด์— ์ ‘๊ทผํ•˜๋ฉด ์ด ๊ฐ์ฒด๋Š” ๋Œ€๋ฆฌ์ž ํด๋ž˜์Šค viewModels์— ์˜ํ•ด ๋‚ด๋ถ€์ ์œผ๋กœ ์ฒ˜๋ฆฌ๋œ๋‹ค. ๋Œ€๋ฆฌ์ž ํด๋ž˜์Šค viewModels๋Š” ์ฒ˜์Œ ์•ก์„ธ์Šค ์‹œ ์ž๋™์œผ๋กœ viewModel ๊ฐ์ฒด๋ฅผ ๋งŒ๋“ค๊ณ  ์ด ๊ฐ’์„ ๊ตฌ์„ฑ ๋ณ€๊ฒฝ ์ค‘์—๋„ ์œ ์ง€ํ•˜๋ฉฐ ์š”์ฒญ์ด ์žˆ์„ ๋•Œ ๋ฐ˜ํ™˜ํ•ด์ค€๋‹ค ๐Ÿ™‚

     

    - ํด๋ž˜์Šค๋ฅผ ์œ„์ž„ํ•œ๋‹ค๋Š” ๊ฒƒ์ด ๋ฌด์—‡์„ ์˜๋ฏธ์ผ๊นŒ?

    2๏ธโƒฃ๋ทฐ๋ชจ๋ธ ์ƒ๋ช…์ฃผ๊ธฐ

     

     


    ๐ŸซฑLiveData : ๋ณ€๊ฒฝ๋œ ๋ฐ์ดํ„ฐ๋ฅผ UI์— ๋ฐ˜์˜ํ•˜๊ธฐ

    ๊ทธ๋Ÿฌ๋‚˜ ์ด๋ ‡๊ฒŒ ๋ณ€๊ฒฝ๋œ ๋ฐ์ดํ„ฐ๊ฐ€ UI์— ๋ฐ˜์˜๋˜์ง€๋Š” ์•Š๋Š”๋‹ค. ์ด ๋•Œ ํ•„์š”ํ•œ ๊ฒƒ์ด LiveData์ด๋‹ค!

    728x90