๊ณํ๋ง ํ๊ณ ์๋ Jetpack Compose,
์ด๋ฒ์ ํ๋ฒ ํจ๊ป ๋ฐฐ์๋ณผ๊น์?
JetPack Compose์ ์ฅ์ , ์๊ณ ๊ณ์ ๊ฐ์?
๊ธฐ์กด XML์ ์ด์ฉํด์ ์๋์ ๊ฐ์ ํ๋ฉด์ ๋ง๋ค์ด๋ฌ๋ผ๋ ์๊ตฌ์ฌํญ์ด ์์ ๋ ์ด๋ค ์๊ฐ์ด ๋จผ์ ๋์๋์? (์๋์ ์ฑ์ ๋ชจ๋ ์ง์ ๊ฐ์์์ ๋ง๋ค์ด๋ด
๋๋ค.)
"๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ฐพ์๋ด์ผ๊ฒ ๋ค."
"์ปค์คํ
๋ทฐ๋ก ๋ง๋ค๋ ค๋ฉด ๋ณต์กํ๊ฒ ๋๋ฐ?"
ํ๋ ์๊ฐ์ด ์ฐ์ ์ ์ผ๋ก ๋ค์ง๋ ์๋์?
๊ทธ๋ ๋ค๋ฉด Jetpack Compose ๋์
์ ๊ฒํ ํด๋ณผ ์ ์์ต๋๋ค!
์ฌ์ ํ Compose์ ์ฅ์ ์ ๋๋ผ๊ธฐ ์ด๋ ค์ฐ์ ๊ฐ์?
๊ทธ๋ ๋ค๋ฉด ์ด๋ฐ ์ฑ์ ์ด๋ ์ ๊ฐ์?
์ด๋ฐ ์ ๋๋ฉ์ด์
๋ํ Compose๋ฅผ ์ด์ฉํ๋ฉด ์ฝ๊ฒ ๊ตฌํํ ์ ์์ต๋๋ค.
๋ชจ๋ ๊ฐ์์์ ์ง์ ํด๋ณผ ์ ์๋๋ก ์๋ ค๋๋ฆด๊ฒ์!
์ง์ ๊ฒฝํํ JetPack Compose์
์ ์ฉํจ์ ์ ํด๋๋ ค์.
Jetpack Compose๋ ์๋๋ก์ด๋์์ ์ ์ ์ฝ๋๋ก UI ๊ฐ๋ฐ์ ๊ฐ์ํํ ์ ์๋ ๋๊ตฌ์
๋๋ค.
โ(โฆ) ๋ค์ดํฐ๋ธ Android UI๋ฅผ ๋น๋ํ๊ธฐ ์ํ ์ต์ ๋๊ตฌ ํคํธ์
๋๋ค. Jetpack Compose๋ ๋ ์ ์ ์์ ์ฝ๋, ๊ฐ๋ ฅํ ๋๊ตฌ, ์ง๊ด์ ์ธ Kotlin API๋ก Android์์์ UI ๊ฐ๋ฐ์ ๊ฐ์ํํ๊ณ ๊ฐ์ํํฉ๋๋ค.โ (๊ตฌ๊ธ ๊ณต์ ๋ฌธ์)
์ฌ๋ด์์ ๋ณต์กํ UI๋ฅผ ๋ง๋๋ ํ๋ก์ ํธ๊ฐ ์์ด, ์ ๊ทน์ ์ผ๋ก Jetpack Compose์ ์คํฐ๋ํ๊ณ ๋์
ํด๋ดค์ต๋๋ค. ์ค์ ๋ก ๋์
ํด ๋ณด๋ UI ์์ฑ์ ์ฝ๋๊ฐ ์๋นํ ์ค์ด๋๋ ๊ฒ์ ๋ณผ ์ ์์๊ณ , UI์ ๋น์ฆ๋์ค ๋ก์ง์ ์ฐ๊ฒฐํ๋ ๊ณผ์ ์์ ํผ๋ก๋๊ฐ ์ค์ด๋๋ ๊ฒ์ ๋๋ ์ ์์์ต๋๋ค. ๊ฒฐ๊ณผ์ ์ผ๋ก, ๊ธฐ์กด XML๋ง ์ฌ์ฉํ์ฌ ์๋๋ก์ด๋ ํ๋ฉด์ ๊ฐ๋ฐํ๋ ๊ฒ๋ณด๋ค ์์ฐ์ฑ ๋ํ ๋์์ง ๊ฒ์ ํ์ธํ ์ ์์์ฃ .
๊ทธ๋์, ์ด๋ฐ ๋ถ๋ค๊ป ์ถ์ฒํฉ๋๋ค!
๊ธฐ์กด ์๋๋ก์ด๋(XML)๋ก ์ฑ ๊ฐ๋ฐ์ ํด๋ณด์
จ๊ณ , Compose ๋์
์ ๊ฒํ ์ค์ด์ ๋ถ๋ค
Jetpack Compose๊ฐ ์ด๋ค ๊ฑด์ง, ์ค์ ์ฅ์ ์ ๋ฌด์์ธ์ง ๊ถ๊ธํ์ ๋ถ๋ค
์๋๋ก์ด๋ ๊ฐ๋ฐ์๋ก ์ทจ์
์ ์ค๋นํ์๋ ๋ถ๋ค (์์ฆ ์ฑ์ฉ ๊ณต๊ณ ์ Compose๊ฐ ๋ง์ด ์ธ๊ธ๋ฉ๋๋ค!)
โ ์ ๊น! ์ด๋ฐ ๋ถ๋ค๊ป๋ ๋ง์ง ์์์.
- ์๋๋ก์ด๋ ์ฑ ๊ฐ๋ฐ์ด ์ฒ์์ด์ ๋ถ๋ค : ์ฝํ๋ฆฐ ๋๋ ์์ด๋ณด ์๋๋ก์ด๋ ๊ฐ์๋ฅผ ์ถ์ฒํด๋๋ ค์.
- ์ด๋ฏธ Compose๋ก ๊ฐ๋ฐ์ ์ด๋ ์ ๋ ํด ๋ณด์๊ณ , ์ฌํ ๊ณผ์ ์ ์ํ์๋ ๋ถ๋ค : ์ฌํ ๊ณผ์ ์ ๋ค์ ๊ฐ์๋ก ์ค๋นํ๊ฒ ์ต๋๋ค.
์ฌ์ด ๊ฒ๋ถํฐ ์ฐจ๊ทผ์ฐจ๊ทผ
Jetpack Compose ๊ธฐ์ด ์์ฑ
์ฌ์ด ์์ ๋ถํฐ ์กฐ๊ธ์ฉ ๋์ด๋๋ฅผ ๋์ฌ๊ฐ๋ฉฐ, Jetpack Compose์ ์ต์ํด์ง ์ ์๋๋ก ๊ตฌ์ฑํ์์ต๋๋ค.
์น์
1 - ๊ฐ๋จํ ๋ ์ด์์ ์ดํด๋ณด๊ธฐ
Jetpack Compose์ ๋ค์ํ ๊ธฐ๋ฅ๋ค์ ์ค์ตํด๋ณด๋ฉฐ ์๋ฐ์
์ ํฉ๋๋ค.
์น์
2 - ์ด๋ ฅ์ ์ฑ ๋ง๋ค๊ธฐ
์ด์ ์น์
์์ ๋ฐฐ์ด ๋ด์ฉ์ ๋ฐํ์ผ๋ก ๊ฐ๋จํ ์ด๋ ฅ์ ์ฑ์ ๋ง๋ค์ด๋ด
๋๋ค.
์น์
3 - ์ฃผ์ฌ์ ์ฑ ๋ง๋ค๊ธฐ
์ฃผ์ฌ์ ์ซ์๊ฐ ๋ณ๊ฒฝ๋ ๋๋ง๋ค ๋ํ๋๋ ํ๋ฉด์ ์ด๋ฏธ์ง๊ฐ ์๋ ์ฝ๋๋ก ์ฝ๊ฒ ๊ตฌํํด๋ด
๋๋ค.
์น์
4 - ๊ทธ๋ํ ์ฑ ๋ง๋ค๊ธฐ
์ค์ต์ ํตํด ๋ค์ํ ๊ทธ๋ํ๋ฅผ ์ฝ๊ฒ ๋ง๋๋ ์ฑ์ ์ ์ํด๋ด
๋๋ค.
์น์
5 - ๋ฌ๋ ฅ ์ฑ ๋ง๋ค๊ธฐ
๊ธฐ์กด XML์์ ๋ง๋ค๊ธฐ ์ด๋ ค์ ๋ ๋ฌ๋ ฅ ํ๋ฉด์ ์ฝ๊ฒ ๊ตฌํํด๋ด
๋๋ค.
์น์
6 - Theme
ํ๋ก์ ํธ ์์ฑ ์ ์ฒ์ ๋ง๋ค์ด์ง๋ Theme๊ฐ ์ด๋ค ๊ฒ์ธ์ง ์ดํด๋ณด๊ณ ์ปค์คํ
ํด๋ด
๋๋ค.
์น์
7 - ์ฟ ํก ๋ฉ์ธ ํ๋ฉด ๋ง๋ค๊ธฐ
์ฟ ํก ๋ฉ์ธ ํ๋ฉด๊ณผ ์ ์ฌํ ํ๋ฉด์ ๋ง๋ค์ด๋ณด๋ฉด์ Scroll๊ณผ Pager์ ๋ํด์ ์ค์ตํฉ๋๋ค.
์น์
8 - ํฌ์ผ๋ชฌ ์นด๋ ๋ง๋ค๊ธฐ
์นด๋๊ฐ ๋ค์งํ๋ ์ ๋๋ฉ์ด์
์ ์ค์ตํด๋ณด๋ฉฐ, Compose์์ ์ ๋๋ฉ์ด์
์ด ๊ฐ๋จํ๊ฒ ๊ตฌํ๋๋ ๊ฒ์ ์ค์ตํด๋ด
๋๋ค.
์น์
9 - Compose ์ฌ์ฉ ์ฝ๊ฐ์ ํ (๋ณด๋์ค!)
Compose๋ฅผ ์ฌ์ฉํ๋ฉด์ ํท๊ฐ๋ฆด ์ ์๋ ๋ถ๋ถ๊ณผ XML๊ณผ ํจ๊ป ์ฌ์ฉํ๋ ๋ฐฉ๋ฒ์ ์์๋ด
๋๋ค.
Q&A ๐ฌ
Q. ์ ์ ์ง์์ด ํ์ํ๊ฐ์?
๋ค. ๊ธฐ์กด XML์ ์ด์ฉํ์ฌ RecyclerView ์ ๋๋ ๋ง๋ค ์ ์๋ ๋ถ์ด ์๊ฐํ์๋ฉด ์ข์ ๊ฒ ๊ฐ์ต๋๋ค. ๋ํ ์ฝํ๋ฆฐ ๋ฌธ๋ฒ์ ๋ํ ๊ธฐ๋ณธ์ ์ธ ์ง์์ด ํ์ํฉ๋๋ค.
Q. ์ด๋ ์ ๋์ ์์ค๊น์ง Compose๋ฅผ ๋ค๋ฃจ๋์?
์ฃผ๋ก ๊ธฐ์ด์ ์ธ UI ์ค์ฌ์ผ๋ก ๊ฐ์๊ฐ ์งํ๋ฉ๋๋ค.
Q. ๊ฐ์ ์คํ์ผ์ ์ด๋ค๊ฐ์?
์๋น์์ ์์
์ ๋ฏธ๋ฆฌ๋ณด๊ธฐ๋ก ์ค์ ํด๋์์ต๋๋ค. ๋ฏธ๋ฆฌ๋ณด๊ธฐ ์์
์ ํ์ธํด๋ณด์ ๋ค์ ๊ฐ์ ์คํ์ผ์ด ๋ง๋์ง ํ์ธํด๋ณด์ ํ ์๊ฐํ์๊ธฐ๋ฅผ ๊ถ์ฅ๋๋ฆฝ๋๋ค.
Q. ๊ตฌ๊ธ ๊ณต์ ๋ฌธ์๊ฐ ์๋๋ฐ ์ ๊ฐ์๋ฅผ ๋ค์ด์ผ ํ๋์?
๊ฐ์ธ์ ์ผ๋ก ๊ตฌ๊ธ ๊ณต์ ๋ฌธ์๋ ์๊ณ ๋ณด๋ฉด ์ ์ค๋ช
๋์ด ์์ง๋ง, ์
๋ฌธ์ ์
์ฅ์์๋ ์น์ ํ์ง ์๋ค๊ณ ๋๊ปด์ง ๋๊ฐ ๋ง์์ต๋๋ค. ์ด๋ฒ ๊ฐ์์์๋ Jetpack Compose ์
๋ฌธ์ ์
์ฅ์์ ๋จ๊ณ์ ์ผ๋ก ์ฝ๊ฒ ์ค๋ช
๋๋ฆฌ๋ ค๊ณ ๋
ธ๋ ฅํ์ต๋๋ค.
๋ด์ฉ์ ์ถฉ๋ถํ ์ดํดํ ์ ์๋๋ก
์์ค ์ฝ๋ ๋ฐ ๋
ธ์
์๋ฃ๋ฅผ ์ ๊ณตํฉ๋๋ค!
์น์
0 ๊ฐ์์๊ฐ - ๊ฐ์์๋ฃ ๋งํฌ์ ๋
ธ์
์ผ๋ก ๋ณด๊ธฐ ์ข๊ฒ ์์ค ์ฝ๋๋ฅผ ์ ๋ฆฌํ์์ต๋๋ค.
์๋ฆฌ์ฆ ๊ณผ์ ์ผ๋ก
์ฐจ๊ทผ์ฐจ๊ทผ ํ์ต ๐งฐ
์ทจ๋ฏธ๋ก ์๋๋ก์ด๋ ์ฑ ๊ฐ๋ฐ์ ๋ฐฐ์ฐ๊ณ ์ถ๋ค๋ฉด?
[์
๋ฌธํธ] ์๋๋ก์ด๋๋ฅผ ์ํ ์ฝํ๋ฆฐ ๋ฌธ๋ฒ]
[์์ด๋ณดํธ] ์ฑ 8๊ฐ๋ฅผ ๋ง๋ค๋ฉด์ ๋ฐฐ์ฐ๋ ์๋๋ก์ด๋ ์ฝํ๋ฆฐ
์กฐ๊ธ ๋ ๊น๊ฒ ์๋๋ก์ด๋ ๊ฐ๋ฐ์์ฒ๋ผ ๊ฐ๋ฐํ๊ณ ์ถ๋ค๋ฉด?
[์ค๊ธํธ] ์น์ ํ JETPACK ๊ฐ๋ก <์>
[์ค๊ธํธ] ์น์ ํ JETPACK ๊ฐ๋ก <ํ>
์ ์ธํ UI์ ๋ํด์ ์์๋ณด๊ณ ์ถ๋ค๋ฉด?
[LV1] Jetpack Compose - UI ์ฐ์ตํ๊ธฐ
[LV2] Jetpack Compose - UI์ ์ ๋๋ฉ์ด์
[LV3] Jetpack Compose - ๊ทธ๋ด ๋ฏํ ๋ค์ด์ดํธ ์ฑ ๋ง๋ค๊ธฐ
[LV4] Jetpack Compose - ๋์์ธ ํจํด๊ณผ Circuit
์ทจ์
์ ์ผ๋ํด ๋๊ณ ๊ณต๋ถ๋ฅผ ํ๋ค๋ฉด?
[ํฌํธํด๋ฆฌ์ค] ์๋๋ก์ด๋ ์ฑ ๋ง๋ค๊ธฐ - ์ด๋ก ํธ
[ํฌํธํด๋ฆฌ์ค] ์๋๋ก์ด๋ ์ฑ ๋ง๋ค๊ธฐ - ์ค์ตํธ