k-coding

SwiftUI ) 커스텀 Container View 만들기 SwiftUI에서는 VStack, HStack, List등등 내장 컨테이너 뷰가 많이 있지만, 때로 사용자가 커스텀해서 컨테이너를 정의할 수 있습니다. 이러한 상황은 주로 사용자가 스크롤할 수 있는 구성요소를 갖춘 뷰를 구성할 때 사용됩니다. struct ContentView: View { let content: Content var body: some View { // } } ContentView: View 해당 라인을 보면 Generic을 사용하여 ContentView에게 원하는 모든 종류의 content를 제공할 수 있지만 모든 content가 View 프로토콜에 적합해야한다는 문장입니다. 물론 제네릭이 닫힌 뒤에도 ContentView 자..

SwiftUI ) Binding SwiftUI가 스토리보드와 다른 이점은 역시 Preview에 있다. Preview를 사용할 때 확인하기 위해서 초기값을 주어야 하는데 초기값을 설정하다 보면 다음과 같은 타입이 나올 때가 있습니다. Int면 그냥 Int고 Optional 까직은 배웠는데 Binding는 무엇일까요? 이 형태는 struct에 @Binding로 외부의 값을 대여해왔기 때문입니다. 그렇다면 위 같은 타입에 그냥 Int를 넣으면 어떻게 될까요? 타입이 맞지 않는다고 뜨는군요? 이럴때는 정적메서드인 .constant를 활용하여 preview의 고정값을 설정해 줄 수 있습니다. 에러없이 값이 잘 전달된 모습입니다.

SwiftUI) ZStack / zIndex https://choiki923.tistory.com/121?category=1037696 SwiftUI (HStack / VStack) SwiftUI (HStack / VStack) SwiftUI 에서 사용되는 HStack과 VStack에 대해서 알아보겠습니다. 우선 기존 Swift에서 StoryBoard를 구상할 때 StackView를 굉장히 유용하게 사용을 많이 하셨을것입니다. SwiftUI.. choiki923.tistory.com ZStack을 알아보기전에 HStack과 VStack에 대해서 먼저 알고 공부해야합니다. 기존에 알던 HStack은 수평, VStack은 수직으로 정렬하였습니다. ZStack은 그림을 보시면 나열이 된것처럼 안보이겠지만 실제..

SwiftUI ) Identifiable 프로토콜 SwiftUI에서는 List나 ForEach처럼 데이터를 나열하는 View 혹은 alert, actionSheet처럼 화면을 띄울 항목을 구분해야할 때 Identifiable프로토콜을 요구합니다. 앱 내에서 다음과 같은 구조체가 존재한다고 봅시다. Struct Profile { let name: String let age: Int } 위 구조체를 이용하여 객체를 생성할 때 let kim1 = Profile(name: "KimMinJae", age: 26) let kim2 = Profile(name: "KimMinJae", age: 26) let kim3 = Profile(name: "KimMinJae", age: 27) 위와 같이 객체가 생성되었다면 ki..

SwiftUI ) AsyncImage AsyncImage는 iOS15로 업데이트되면서 생긴 기능으로 URLSession 인스턴스를 사용하여 할당된 URL에서 이미지를 가져오는 기능을 수행하여줍니다. 실제로 디바이스를 실행하고 몇 초 후 이미지가 나타나게 하는곳에 사용될 수 있습니다. 이번엔 이 AsyncImage를 활용하는 방법을 알아보겠습니다. 1. AsyncImage struct ContentView: View { private var imageUrl : String = "https://img.freepik.com/free-vector/character-bee-set_77984-116.jpg" var body: some View{ AsyncImage(url: URL(string: imageUrl)) ..

SwifUI에서 메뉴를 만들어보는 방법에 대하여 알아보겠습니다. SwiftUI에서는 기본적으로 Menu라는 전용 뷰를 제공합니다. 이를 활용하여 메뉴에 표시할 수 있는 항목을 설정할 수 있는데요 struct ContentView: View { var body: some View { Menu("메뉴창 열기") { Button("1번", action: {}) Button("2번", action: {}) } } } 다음과 같이 Menu{} 안에 메뉴에 해당 될 버튼 혹은 Label을 넣어주시면 됩니다. 위와같이 입력했다면 입력한 순서의 역순대로 아래와 같이 나오게 됩니다. 물론 메뉴안에 메뉴도 넣을 수 있게 됩니다. struct ContentView : View { var body: some View { Me..

SwiftUI Image로 TabView 만들어보기 이전에 TabView를 활용하여 여러가지 모드의 TabBar를 만들어보았는데요. https://choiki923.tistory.com/141 Swift UI TabBar Swift UI TabView 오늘은 SwiftUI에서 간단하게 TabView를 구현하는 방법을 알아보겠습니다. TabView를 이용하여서 TabBar를 만들어줄 수 있는데요 탭바가 어떤것인지는 다들 잘 아실거라고 생각합니다. choiki923.tistory.com 이번엔 TabView를 활용하지않고 Image를 통하여 커스텀된 Tabbar를 만들어보겠습니다. import Foundation import SwiftUI struct MyView: View { var title: Strin..

SwiftUI Geometry Reader 오늘은 Swift UI에서 View의 크기 비율을 정할 수 있게 해주는 Geometry Reader에 관하여 알아보겠습니다. 우선 저희가 SwiftUI에서 하나의 View를 만들어봅시다. 예를 들어 아래와같은 코드로 아래의 화면을 만들었습니다. struct GeometryReader : View { var body: some View { HStack(spacing: 0) { Text("A") .frame(width : 50) .background(Color.red) Text("B") .frame(width : 50) .background(Color.green) Text("C") .frame(width : 50) .background(Color.yellow) } ..

Swift UI TabView 오늘은 SwiftUI에서 간단하게 TabView를 구현하는 방법을 알아보겠습니다. TabView를 이용하여서 TabBar를 만들어줄 수 있는데요 탭바가 어떤것인지는 다들 잘 아실거라고 생각합니다. 이 친구들이죠 이 탭바의 특징이라면 해당 탭을 클릭하면 그 화면으로 넘어간다는것인데요. 간단한 예제를 통하여 탭바를 한번 만들어보겠습니다. 우선 전에 공부했던 Navigation처럼 탭바를 사용하기위한 부분을 우선 TabView { // ... } 로 감싸주어야 합니다. 그 안에 화면을 구상할 코드와 각 TabBar에 타이틀과 이미지를 넣어주면 되는데요. 이러한 뷰는 어떻게 만들수 있을까요? 먼저 전체 코드를 보여주고 설명해보겠습니다. import Foundation import ..

오늘은 이전에 다루었던 HStack과 VStack을 효율적으로 다루는 방법에 대해서 알아보겠습니다. 1. Divider() 우선 예제를 하나 만들어보겠습니다. struct ContentView: View { var body : some View { VStack { Text("Ractangle") .font(.system(size: 30)) .fontWeight(.heavy) Rectangle() .frame(width: 100, height: 100) .foregroundColor(Color.red) Rectangle() .frame(width: 100, height: 100) .foregroundColor(Color.blue) Rectangle() .frame(width: 100, height: 100..