iOS (29) 썸네일형 리스트형 SwiftUI에서 스켈레톤 UI 적용하기 Steleton UI ? 먼저 스켈레톤 UI는 앱에서 데이터를 받아오는 지연시간 동안 임시로 뼈대의 뷰를 보여주어 사용자에게 지루함을 덜어주고 UI상으로도 깨지는 현상을 줄여주는 효과가 있는 기법이다. 예) 유튜브의 스켈레톤 UI 적용 구현하기 위의 유튜브 스켈레톤 UI를 목표로 클론해보자..! 먼저 데이터가 있는 것처럼 간단하게 뷰를 그려보았다. struct ContentView: View { var body: some View { ScrollView { ForEach(0.. [SwiftUI] EnvironmentObject / ObservedObject / StateObject EnvironmentObject, ObservedObject, StateObject 세가지의 특징을 간단한 예제를 통해 알아보자 class ViewModel: ObservableObject { @Published var count = 0 } @main struct [YourAppName]: App { var body: some Scene { WindowGroup { ContentView() .environmentObject(ViewModel()) } } } struct ContentView: View { @EnvironmentObject var environment: ViewModel var body: some View { VStack { AView(observed: ViewModel()) Button(.. [Swift] Codable로 JSON파싱하기 -확장- 앞서 기초편에서 간단하게 JSON을 파싱하는 법을 알았는데 확장편에서는 마주할 법한 상황을 가정하여 좀 더 자세하게 다뤄 볼 예정이다. 목차 1. Json에 null값이 들어 왔을 때 2. 아예 Key값이 안들어 왔을 때 3. Json안에 Object가 들어 있을 때 4. CordingKeys 사용해보기 Json에 null값이 들어 왔을 때 struct User: Codable { let name: String let age: Int let picture: String let isActive: Bool } 우리는 기초편에서 User의 모델을 위와 같이 정의했다. 하지만 이 구조체는 모든 값이 유효할 때만 데이터를 성공적으로 파싱할 수 있다. { "name": "이기회", "age": 77, "pictur.. [Swift] Codable로 JSON파싱하기 -기초- RESTful API 의 기본인 JSON데이터를 Swift의 Codable을 사용해 파싱해보자! 먼저 초기 JSON과 UI를 대략 그려본다. { "name": "이기회", "age": 77, "picture": "sample", "isActive": true, } struct ContentView: View { var body: some View { VStack { Image(systemName: "person") .resizable() .frame(width: 150, height: 150) .clipShape(Circle()) .overlay(Circle().stroke(.gray, lineWidth: 4)) Text("Name") Text("Age") } } } 이제 위의 UI에서 Image에 Js.. [SwiftUI] PencilKit을 사용해 캔버스 만들기 Swift의 PencilKit을 사용해 간단한 드로잉 앱을 만들어 보자 !! 가장 먼저 PencilKit을 임포트 해준다. import SwiftUI import PencilKit UIKit의 PKCanvasView를 SwiftUI에서 사용하기 UIViewRepresentable를 사용하여 UIKit의 컴포넌트를 SwiftUI에서 사용할 수 있게 랩핑해준다. struct CanvasView: UIViewRepresentable { let canvas: PKCanvasView let toolPicker: PKToolPicker func makeUIView(context: Context) -> PKCanvasView { canvas.isOpaque = false canvas.backgroundColor = .. 이전 1 2 3 4 다음
