๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

๐ŸŽ iOS/SwiftUI

[SwiftUI] View Life Cycle

์•ˆ๋…•ํ•˜์„ธ์š” ์ œ์ธ์ž…๋‹ˆ๋‹ค :)

๊ทธ๋™์•ˆ ๋ธ”๋กœ๊ทธ ๊ธ€์„ ๋ชป์ผ๋Š”๋ฐ,,, ์ตœ๊ทผ์— ๊ฐœ์ธ ํ”„๋กœ์ ํŠธ๋ฅผ ํ•˜๋‚˜ ์ง„ํ–‰ํ–ˆ์Šต๋‹ˆ๋‹ค..ใ…Ž

SwiftUI ํ”„๋ ˆ์ž„์›Œํฌ๋กœ ๊ฐœ์ธ ํ”„๋กœ์ ํŠธ ๊ฐœ๋ฐœ์„ ์ง„ํ–‰ํ•˜๋ฉฐ ํ•™์Šตํ•œ ๋‚ด์šฉ๋„ ๋งŽ์•„์„œ ์ƒˆ๋กญ๊ฒŒ ํ•™์Šตํ•˜๊ฑฐ๋‚˜ ์ •๋ฆฌํ•ด๋‘” ๋‚ด์šฉ์„

๋ธ”๋กœ๊ทธ์—๋„ ๊ณต์œ ํ•ด๋ณผ๊ฒŒ์š”~! (์ด์ œ๋ณด๋‹ˆ UIKit ๊ธ€์„ ๊ฑฐ์˜ ์•ˆ์ผ๋„ค์š”...?ใ…‹.......)

SwiftUI View Life Cycle

Lifecycle์€ SwiftUI ๋ทฐ์˜ ์ƒ์„ฑ๋ถ€ํ„ฐ ์†Œ๋ฉธ๊นŒ์ง€ ์ƒ๊ธฐ๋Š” ์ผ๋ จ์˜ ์ด๋ฒคํŠธ ์ž…๋‹ˆ๋‹ค.

SwiftUI์˜ ๊ฐ ๋ทฐ์—๋Š” ์šฐ๋ฆฌ๊ฐ€ ๊ด€์ฐฐํ•˜๊ณ  ์กฐ์ž‘ํ•  ์ˆ˜ ์žˆ๋Š” ์„ธ ๊ฐ€์ง€ ์ฃผ์š” ๋‹จ๊ณ„๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค.

์ด ์„ธ ๊ฐ€์ง€ ๋‹จ๊ณ„๋Š” Appearing, Updating, Disappearing ์ž…๋‹ˆ๋‹ค.

Appearing

Appearing์€ ๋ทฐ ๊ทธ๋ž˜ํ”„์— ๋ทฐ๋ฅผ ์‚ฝ์ž…ํ•˜๋Š” ๊ฒƒ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

์ด ๋‹จ๊ณ„์—์„œ ๋ทฐ๋Š” ์ดˆ๊ธฐํ™”๋˜๊ณ , state๋ฅผ ๊ตฌ๋…ํ•˜๋ฉฐ ์ฒ˜์Œ์œผ๋กœ ๋ Œ๋”๋ง๋ฉ๋‹ˆ๋‹ค.

 

  1. ์ดˆ๊ธฐํ™” ์‹œ์ ์—์„œ ๋ทฐ๋Š” state์™€ ์—ฐ๊ฒฐ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์ด๊ฒƒ์ด ๋ทฐ์˜ ๊ตฌ์ถ•์ž‘์—…์„ ๊ฐ„๋‹จํ•˜๊ฒŒ ๋งŒ๋“ญ๋‹ˆ๋‹ค. ์™œ๋ƒํ•˜๋ฉด ์ „์ฒด ๋ทฐ ๊ณ„์ธต์ด ๋งŒ๋“ค์–ด์ง€๋Š” ๊ฒƒ์ด ์„ ํ–‰๋˜๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค.
  2. ์ดˆ๊ธฐํ™” ์ž‘์—… ์ดํ›„, body๊ฐ€ ๊ณ„์‚ฐ๋˜๊ธฐ ์ „์— ๋ทฐ๊ฐ€ state์— ์—ฐ๊ฒฐ๋ฉ๋‹ˆ๋‹ค.
  3. View์˜ body๊ฐ€ ์ฒ˜์Œ์œผ๋กœ ํ˜ธ์ถœ๋ฉ๋‹ˆ๋‹ค.
  4. ๋ทฐ ๊ทธ๋ž˜ํ”„๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๊ณ  ๋ณ€๊ฒฝ์‚ฌํ•ญ์„ ๋ Œ๋”๋งํ•ฉ๋‹ˆ๋‹ค.
  5. onAppear() ๋ฉ”์„œ๋“œ๋Š” top-down ๋ฐฉ์‹(๋ทฐ๋ชจ ๋ทฐ์—์„œ ์ž์‹ ๋ทฐ ์ˆœ์„œ๋กœ)์œผ๋กœ ํ˜ธ์ถœ๋ฉ๋‹ˆ๋‹ค.

Updating

Updating ์€ ์™ธ๋ถ€ ์ด๋ฒคํŠธ๋‚˜ ์ƒํƒœ ๋ณ€๊ฒฝ์— ๋Œ€ํ•œ ์‘๋‹ต์œผ๋กœ ์ˆ˜ํ–‰๋ฉ๋‹ˆ๋‹ค.

(์—ฌ๊ธฐ์„œ ์™ธ๋ถ€ ์ด๋ฒคํŠธ๋Š” Combine publisher๋ฅผ ์˜๋ฏธ)

 

  1. ์‚ฌ์šฉ์ž ์ž‘์—…์œผ๋กœ ์ธํ•ด ์ƒํƒœ๊ฐ€ ๋ณ€๊ฒฝ๋˜๊ฑฐ๋‚˜ SwiftUI๊ฐ€ View.onRecieve()๋ฅผ ํ†ตํ•ด ๊ด€์ฐฐ๋œ publisher๊ฐ€ ๋ฐฉ์ถœํ•˜๋Š” ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ์ง€ํ•ฉ๋‹ˆ๋‹ค.
  2. ๋ณ€๊ฒฝ๋œ state๋ฅผ ์†Œ์œ ํ•˜๊ณ  ์žˆ๊ฑฐ๋‚˜ ์™ธ๋ถ€ ์ด๋ฒคํŠธ๋ฅผ ๋ฐ›์€ ๋ทฐ์™€ ๊ทธ ๋ทฐ์˜ ๋ชจ๋“  ์ž์‹๋“ค์„ ์ด์ „ ์Šค๋ƒ…์ƒท๊ณผ ๋น„๊ตํ•ฉ๋‹ˆ๋‹ค. (Equatable ํ”„๋กœํ† ์ฝœ ์ด์šฉํ•ด ๋น„๊ต ์ž‘์—… ์ˆ˜ํ–‰)
  3. SwiftUI๋Š” ๋ณ€๊ฒฝ๋œ ๋ทฐ๋“ค์„ ๋ฌดํšจํ™”ํ•ฉ๋‹ˆ๋‹ค.
  4. ๋ทฐ ๊ทธ๋ž˜ํ”„๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๊ณ  ๋ฌดํšจํ™”๋œ ๋ทฐ๋“ค์„ ๋ Œ๋”๋งํ•ฉ๋‹ˆ๋‹ค. ๋ชจ๋“  ์—…๋ฐ์ดํŠธ๋Š” ๋ทฐ ๊ณ„์ธต์„ ํ†ตํ•ด ์•„๋ž˜๋กœ ํ˜๋Ÿฌ ๋‚ด๋ ค๊ฐ‘๋‹ˆ๋‹ค.

์ฐธ๊ณ ) state์— ์—ฐ๊ฒฐ๋œ ๋ทฐ๋งŒ custom equality implementation์„ ์ œ๊ณตํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. state์— ์—ฐ๊ฒฐ๋˜์ง€ ์•Š์€ ๋ทฐ๋Š” ํ•ญ์ƒ ๋‹ค์‹œ ๋ Œ๋”๋ง๋ฉ๋‹ˆ๋‹ค.

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

Disappearing

disappearing์€ ๋ทฐ ๊ณ„์ธต ๊ตฌ์กฐ์—์„œ ๋ทฐ๋ฅผ ์ œ๊ฑฐํ•˜๋Š” ๊ฒƒ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

 

onDisappear()๋ฉ”์„œ๋“œ๋Š” ๊ณ„์ธต ๊ตฌ์กฐ์—์„œ ๋ทฐ๊ฐ€ ์ œ๊ฑฐ๋œ ํ›„์— ํ˜ธ์ถœ๋ฉ๋‹ˆ๋‹ค.

onAppear()์™€ ๋งˆ์ฐฌ๊ฐ€์ง€๋กœ onDisappear() ๋˜ํ•œ top-down ๋ฐฉ์‹(์ƒ์œ„ ๋ทฐ์—์„œ ํ•˜์œ„ ๋ทฐ๋กœ)์œผ๋กœ ํ˜ธ์ถœ๋ฉ๋‹ˆ๋‹ค.

Life Cycle Method

onAppear

  • View๊ฐ€ ๋ณด์ด๊ธฐ ์ „์— action์„ ์ˆ˜ํ–‰ํ•˜๋Š” ํ•จ์ˆ˜
  • View๊ฐ€ ์ฒซ ๋ Œ๋”๋ง ๋˜๊ธฐ ์ „์— action ํด๋กœ์ €๊ฐ€ ๋๋‚˜๋Š” ๊ฒƒ์„ ๋ณด์žฅ
  • → onAppear์—์„œ ์‹œ๊ฐ„ ์˜ค๋ž˜ ๊ฑธ๋ฆฌ๋Š” ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•œ๋‹ค๋ฉด ๋ทฐ๊ฐ€ ๋Šฆ๊ฒŒ ๋œธ (์ž‘์—… ๋๋‚ด๊ณ  appear์‹œํ‚ค๊ธฐ ๋•Œ๋ฌธ)

task

  • View๊ฐ€ ๋ณด์ด๊ธฐ ์ „์— ๋น„๋™๊ธฐ task๋ฅผ ์ˆ˜ํ–‰ํ•˜๋Š” ํ•จ์ˆ˜
  • → ๋น„๋™๊ธฐ task ์ด๋ฏ€๋กœ task ์ข…๋ฃŒ ์—ฌ๋ถ€์— ์ƒ๊ด€์—†์ด task๊ฐ€ ๋๋‚˜๊ธฐ ์ „์— View๊ฐ€ ๊ทธ๋ ค์งˆ ์ˆ˜ ์žˆ์Œ
  • task๊ฐ€ ๋๋‚˜๊ธฐ ์ „์— View๊ฐ€ ์‚ฌ๋ผ์ง€๊ฒŒ(disappear) ๋˜๋ฉด ์ž๋™์œผ๋กœ task๋ฅผ cancel ์‹œํ‚ด
  • iOS 15 ์ด์ƒ๋ถ€ํ„ฐ ์‚ฌ์šฉ ๊ฐ€๋Šฅ

onDisappear

  • View๊ฐ€ ์‚ฌ๋ผ์ง€๊ณ  ๋‚œ ์ดํ›„์— action์„ ์ˆ˜ํ–‰ํ•˜๋Š” ํ•จ์ˆ˜

onChange

  • View์˜ ํŠน์ • ์ƒํƒœ ์†์„ฑ์ด ๋ณ€๊ฒฝ๋  ๋•Œ ํ˜ธ์ถœ๋˜๋Š” ํ•จ์ˆ˜
  • ์ด ๋•Œ ๋‹ค๋ฅธ ๋ฐ์ดํ„ฐ๋ฅผ ์—…๋ฐ์ดํŠธํ•˜๊ฑฐ๋‚˜ ํ™”๋ฉด์„ ๋‹ค์‹œ ๊ทธ๋ฆฌ๋Š” ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ์Œ

[์ฐธ๊ณ  ์ž๋ฃŒ]

 

SwiftUI View Lifecycle

Learn the three phases of SwiftUI view lifecycle: Appearing, Updating and Disappearing.

www.vadimbulavin.com

 

SwiftUI View Lifecycle์— ๋Œ€ํ•ด ์•Œ์•„๋ณด์ž.

์•ˆ๋…•ํ•˜์„ธ์š”. ๊ทธ๋™์•ˆ ๋Œ€์ถฉ์€ ์•Œ๊ณ  ์žˆ์—ˆ๋˜ SwiftUI์˜ View Lifecycle์— ๋Œ€ํ•ด์„œ ์ •ํ™•ํ•˜๊ฒŒ ์•Œ๊ณ  ๊ฐ€๋Š” ์‹œ๊ฐ„์„ ๊ฐ€์ ธ๋ณผ๊ฒŒ์š”. ๊ฐœ์ธ์ ์œผ๋กœ Lifecycle ๊ฐœ๋…๋„ ์ค‘์š”ํ•˜์ง€๋งŒ, Lifecycle์ด ์ •ํ™•ํ•˜๊ฒŒ ์–ธ์ œ ํ˜ธ์ถœ๋˜๋Š”์ง€ (ex.

phillip5094.tistory.com

'๐ŸŽ iOS > SwiftUI' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

[SwiftUI] View ์—…๋ฐ์ดํŠธ ๋ฐฉ์‹ - @State, @Binding  (2) 2024.08.20