SwiftUI (5) 썸네일형 리스트형 [SwiftUI] Stack 이번 포스팅에서는 SwiftUI에서 View를 배치하는 데 사용하는 ContainerView이자 하나의 View인 Stack에 대해서 알아보겠다. UIStakcView 같은 역할인데 UIKit에서는 반복되는 view들의 정렬 같은 상황에서 개발자가 선택적으로 사용을 했다면 SwiftUI에서는 거의 필수적으로 사용을 함과 동시에 사용법도 매우 간단해졌다고 한다. 먼저 가로 방향으로 View들을 나열하는 Horizontal Stack에 대해 알아보겠다. 두개의 사각형 View를 가로 Stack으로 위치시키면 하단과 같은 모습으로 나오게 된다. HStack { Rectangle() .fill(Color.green) .frame(width: 100, height: 100, alignment: .center) R.. [SwiftUI] Image (2) 저번 포스팅에 이어 image를 다루는 두번째 시간이 되겠다. SwiftUI에서는 clipShape 수식어를 사용해서 image를 원하는 모양으로 만들 수 있다. 전달인자에 Circle을 초기화 해주면 원형의 image로 바뀌는걸 볼 수 있다. cornerRadius를 설정하기 위한 imageView.width의 / 2와 maskToBounds 같은 코드는 더이상 필요하지 않다. Image("swiftui") .resizable() .clipShape(Circle()) .frame(width: 100, height: 100, alignment: .center) image의 렌더링 모드는 template랑 original 이라는 모드로 2가지가 사용된다. template는 image의 불투명 영역이 가진 .. [SwiftUI] Image (1) SwiftUI에서 Image 사용법에 대해 알아보겠다. UIKit에서 쓰이던 UIImageView를 대체할 수 있는 녀석이다. 일단 에셋에 image 하나를 넣어주겠다. ( image이름 - "swiftui" ) 그리고 아래와 같이 body 안에 코드를 입력하면 끝이다. UIImageView에 UIImage를 넣어주고 하는 과정이 한줄의 코드로 가능한것이다. var body: some View { Image("swiftui") } 여기서 주의사항은 image는 기본적으로 image 본연의 사이즈를 유지한다는 점이다. 이게 무슨말이냐 하면 image 파일을 열어서 사이즈를 확인해보면 해당 image의 사이즈를 알 수 있는데 그사이즈를 유지하고 있다는 말이다. 이말은 곧 frame이라는 수식어를 사용해서 i.. [SwiftUI] Text 이번 포스팅에는 SwiftUI에서 사용되는 Text에 대해서 알아보겠다. UILabel 보다 사용성이 훨씬 크고 UILabel 과 일맥상통 하다고 말하면 뭔가 이해하기 쉬울까 그전에 우리가 익숙해 있었던 UIKit와 SwiftUI 요소들의 비교를 몇개 먼저 해보자면 아래와 같다. Views and Control UILabel Text UITextField TextField UITextField의 Secure 설정 SecureField ( TF의 속성을 설정하는게 아닌 새로운 TF 생성 ) UIButton Button UIImageView Image UISwitch Toggle UISlider Slider UIStepper ( 이런게 있었네요,, ) Stepper UIPickerView Picker(Whe.. [SwiftUI] Hello SwiftUI SwiftUI에 대해서 공부를 시작하려고 한다. "스윗한 SwiftUI" 라는 책을 베이스로 공부하되 추가적으로 필요한 부분이 있을시 검색을 해나가면서 진행하는 방향으로 공부할 생각이다. 일단 첫 시작이니 프로젝트 생성부터 하겠다. App을 선택하고 Interface를 SwifttUI로 선택한다. 그러면 평소 기본으로 위치해있던 ViewController가 아닌 ContentView라는 이름의 swift 파일이 있을것이다. SwiftUI에서는 ViewController를 사용하지 않는다. 대신 "View 프로토콜을 준수하는 구조체를 사용해서 body라는 프로퍼티에 UI를 구성하는 코드를 작성" 하여 구현 한다고 한다. 일단 ContentView에 기본으로 작성된 코드를 보면 "Hello, world!"라.. 이전 1 다음
