Language/Swift

SwiftUI 에서 State와 Binidng을 이용하 화면 변경하기

IFLA 2023. 1. 7. 12:01

 

기본 코드

struct Book {
    let title: String
    let author: String
}

struct bookReading: View {
    let book = Book(title: "Apple", author: "Happy virus")

    @State var isReading = false

    var body: some View {
        VStack {
            Text(self.book.title)
                .font(.title)
                .foregroundColor(self.isReading ? .blue: .white)

            Text(self.book.author)
                .font(.footnote)
                .foregroundColor(.secondary)

						readingButton(isReading: $isReading)
        }
        .padding(isReading ? 100 : 30)
        .background(self.isReading ? Color.yellow : Color.blue)
        .cornerRadius(self.isReading ? 60 : 10)
    }
}

struct readingButton: View {
    @Binding var isReading: Bool

    var body: some View {
        Button(action: {
            withAnimation {
                self.isReading.toggle()
            }
        }) {
            if(self.isReading) {
                Image(systemName: "pause.fill")
                    .foregroundColor(Color.blue)
            } else {
                Image(systemName: "play.fill")
                    .foregroundColor(Color.black)
            }
        }
        .font(.system(size: 30))
        .padding(12)
    }
}

let read = bookReading()

struct ContentView: View {
    var body: some View {
        VStack {
            Spacer()
            
            bookReading()
                .padding(40)
            Spacer()
        }
        .frame(maxWidth: .infinity)
        .background(Color.yellow)
        .edgesIgnoringSafeArea(.all)
    }
}

 

실행 화면