๐ŸŽ Apple/SwiftUI

[SwiftUI] ViewBuilder๋ž€?

JINiOS 2023. 4. 23. 00:10
728x90

ViewBuilder๋ž€?

ํด๋กœ์ €์—์„œ ๋ทฐ๋ฅผ ๊ตฌ์„ฑํ•˜๋Š” ์ปค์Šคํ„ด ๋งค๊ฐœ๋ณ€์ˆ˜ ์†์„ฑ์ž…๋‹ˆ๋‹ค.

ViewBuilder๋Š” ์ž์‹ ๋ทฐ๋ฅผ ์ƒ์„ฑํ•˜๋Š” ํด๋กœ์ € ๋งค๊ฐœ๋ณ€์ˆ˜์— ๋Œ€ํ•œ ๋งค๊ฐœ๋ณ€์ˆ˜ ์†์„ฑ์œผ๋กœ ์ผ๋ฐ˜์ ์œผ๋กœ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. ๋ทฐ ๋นŒ๋”๋ฅผ ์‚ฌ์šฉํ•ด์„œ ํ•ด๋‹น ํด๋กœ์ €๊ฐ€ ์—ฌ๋Ÿฌ ์ž์‹ ๋ทฐ๋ฅผ ์ œ๊ณตํ•  ์ˆ˜ ์žˆ๋„๋กํ•ฉ๋‹ˆ๋‹ค. 

 

์ฆ‰, SwiftUI์—์„œ๋Š” ViewBuilder๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํด๋กœ์ € ๋‚ด์—์„œ ์—ฌ๋Ÿฌ ๊ฐœ์˜ ๋ทฐ๋ฅผ ์ƒ์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๊ฐœ๋…์„ ํ™•์žฅํ•˜์—ฌ, ์‚ฌ์šฉ์ž๋Š” ์ž์‹ ๋งŒ์˜ ๋งค๊ฐœ๋ณ€์ˆ˜ ์†์„ฑ์„ ๋งŒ๋“ค์–ด ํด๋กœ์ €์—์„œ ๋ทฐ๋ฅผ ์ƒ์„ฑํ•˜๋„๋ก ์ง€์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ๋งค๊ฐœ๋ณ€์ˆ˜ ์†์„ฑ์„ ์‚ฌ์šฉํ•˜๋ฉด, ๋ทฐ๋ฅผ ์ƒ์„ฑํ•˜๋Š” ์ฝ”๋“œ๋ฅผ ๋ณด๋‹ค ๊ฐ„๊ฒฐํ•˜๊ณ  ๊ฐ€๋…์„ฑ ๋†’๊ฒŒ ์ž‘์„ฑํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ์žฌ์‚ฌ์šฉ์„ฑ๋„ ๋†’์•„์ง‘๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ์‚ฌ์šฉ์ž ์ง€์ • ๋งค๊ฐœ๋ณ€์ˆ˜ ์†์„ฑ์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ทฐ์˜ ์ƒ‰์ƒ, ํ…Œ๋‘๋ฆฌ ์Šคํƒ€์ผ, ๋ฐฐ์น˜ ๋ฐฉ์‹ ๋“ฑ์„ ์‰ฝ๊ฒŒ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

 

 

ViewBuilder๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์—ฌ๋Ÿฌ ๊ฐœ์˜ ํ•˜์œ„ ๋ทฐ๋ฅผ ํฌํ•จํ•˜๋Š” customView๋ฅผ ๋งŒ๋“œ๋Š” ์˜ˆ์‹œ

import SwiftUI

struct ContentView: View {
    var body: some View {
        customView {
            Text("Hello,")
            Text("ViewBuilder!")
        }
    }
}

struct customView<Content: View>: View {
    let content: () -> Content
    
    init(@ViewBuilder content: @escaping () -> Content) {
        self.content = content
    }
    
    var body: some View {
        VStack {
            content()
        }
    }
}

customView๋Š” ViewBuilder๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์—ฌ๋Ÿฌ ๊ฐœ์˜ ํ•˜์œ„ ๋ทฐ๋ฅผ ํฌํ•จํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

customView๋Š” @ViewBuilder ์†์„ฑ ๋ž˜ํผ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์—ฌ๋Ÿฌ ๋ทฐ๋ฅผ ์ธ์ˆ˜๋กœ ๋ฐ›๋Š” ํด๋กœ์ €๋ฅผ ์ „๋‹ฌ๋ฐ›์Šต๋‹ˆ๋‹ค.

customView์˜ body ์ปดํ“จํ‹ฐ๋“œ ํ”„๋กœํผํ‹ฐ์—์„œ๋Š” VStack์„ ์ด์šฉํ•˜์—ฌ ์—ฌ๋Ÿฌ ํ•˜์œ„ ๋ทฐ๋ฅผ ๋ Œ๋”๋งํ•ฉ๋‹ˆ๋‹ค.

content() ๋ฉ”์†Œ๋“œ๋ฅผ ํ˜ธ์ถœํ•˜์—ฌ ViewBuilder์—์„œ ์ „๋‹ฌ๋ฐ›์€ ์—ฌ๋Ÿฌ ๋ทฐ๋ฅผ ๋ Œ๋”๋งํ•ฉ๋‹ˆ๋‹ค.

728x90