반응형

SwiftUI 19

SwiftUI Segmented Control

개요UIKit에서 UISegmentedControl은 SwiftUI의 Picker와 같은 역할을 한다. 이번에는 Picker 컴포넌트와 UISegmentedControl 함수를 통해 서로 다른 이미지를 View에 표시해주는 간단한 프로젝트를 해볼 예정이다. 코드SideOfTheForceenum SideOfTheForce: String, CaseIterable { case light = "Light" case grey = "Grey" case dark = "Dark" }Picker의 타이틀을 정해주는 String 타입의 enum이다. light, grey, dark 총 3가지의 case가 있고 이것을 String값으로 반환해준다. CaseIterable 프로토콜을 채용하면 안에 있는 값들을 배열처럼 사용할..

SwiftUI 2021.04.01

SwiftUI Binding, Environment

개요 swiftUI에서 자신의 뷰에서의 상태값을 저장할 때는 @State 키워드를 사용한다. 하지만 이 상태값을 자신의 하위 뷰에도 적용시킬 때가 분명히 필요하다 이럴 때 사용하는 것이 바로 @Binding 키워드이다. 그리고 모든 View에는 환경 기본값이 존재한다. 사용하기 전에 따로 설정을 하지 않아도 기본적으로 설정되어있는데 이 값을 바꾸고 싶을 때는 @Environment 키워드를 사용하여 변경이 가능하다. 시작하기 @Binding 키워드를 통해서 다크모드를 사용할 수 있는 Boolean 변수를 다른 View와 공유를 하고 @Environment 키워드를 통해서 현재 View의 presentationMode의 값을 변경해서 현재 열려있는 View를 종료할 수 있게 도와주는 변수를 만들 예정이다...

SwiftUI 2021.03.31

SwiftUI Profile View

오늘은 SwiftUI 프레임워크를 이용하여 간단한 Profile UI를 만들 예정이다.결과프로필 사진과 사용자에 대한 간단한 정보를 담아주는 Textfield가 있고 오른쪽 상단에는 저장하는 버튼과 삭제하는 버튼을 생성하였다. State 변수 선언struct ContentView: View { @State private var firstName = "" @State private var lastName = "" @State private var company = "" var body: some View { } }우선 TextFiled에 입력된 값을 담는 변수들을 State로 감싸서 선언해주었다. SwiftUI의 컴포넌트는 일반적으로 Struct단위로 구성되어 사용되는데 Struct 내에서는 값이 변경이 ..

SwiftUI 2021.03.30

SwiftUI 사진 가져오기(3)

swiftUI 사진 가져오기(1) swiftUI 사진 가져오기(2) macOS macOS에서 프로젝트를 실행할 때 사용하는 소스코드이다. 앞서 말했듯이 Target을 OS에 맞게 설정하고 소스파일 제목 제일 끝에 "_(원하는 OS)"를 적으면 자동으로 인식한다. NSUIImage_macOS import AppKit import SwiftUI public typealias NSUIImage = NSImage extension NSUIImage { var data: Data? { //비트맵 이미지 데이터 return self.tiffRepresentation } static func image(fromData data: Data) -> Image { return Image(nsImage: NSImage(da..

SwiftUI 2021.03.20

SwiftUI 사진 가져오기(2)

이전 게시물 보기 MemeTextField.swift 위쪽과 아래쪽에 있는 Text컴포넌트의 UI를 꾸며주는 코드이다. import SwiftUI struct MemeTextField: View { @Binding var text: String var body: some View { TextField(text, text: $text) .multilineTextAlignment(.center) .lineLimit(nil) .foregroundColor(.black) .font(Font.system(size: 25, weight: .bold)) .textCase(.uppercase) } } @Binding 어노테이션을 사용하여 text 변수를 사용하였는데 이렇게 지정한 이유는 여러개의 뷰에서 동시에 Stat..

SwiftUI 2021.03.19

SwiftUI 사진 가져오기(1)

[참조] Document-Based Apps Using SwiftUI SwiftUI makes it easier than ever to create document-based apps that work with the iOS document interaction system. In this tutorial, you'll learn how to create a SwiftUI document-based meme-maker app. https://www.raywenderlich.com/14971928-document-based-apps-using-swiftui#toc-anchor-013 개요 xCode의 multi-platform 프로젝트를 사용해서 swiftUI를 통해 해당 디바이스의 사진에 접근해서 새로운..

SwiftUI 2021.03.17

SwiftUI TabView

TabView TabView 컴포넌트는 하단의 아이콘을 통해 여러 페이지를 볼 수 있는 View를 만들어 준다. Example 3개의 페이지로 나뉘어져 있는 TabView import SwiftUI struct Layout: View { var body: some View { TabView { Text("The First Tab") .tabItem { Image(systemName: "1.square.fill") Text("First") } Text("Another Tab") .tabItem { Image(systemName: "2.square.fill") Text("Second") } Text("The Last Tab") .tabItem { Image(systemName: "3.square.fill")..

SwiftUI 2021.03.02

SwiftUI GroupBox, Menu

GroupBox GroupBox 컴포넌트는 일반 Text나 Label 요소를 그룹화하여 스타일링 해주는 컴포넌트이다. Example 간단한 GroupBox 사용방법이다. import SwiftUI struct ContentView: View { var body: some View { GroupBox( label: Label("swiftUI", systemImage: "heart.fill") .foregroundColor(.red) ) { Text("Welcome to swiftUI world") }.padding() } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } } Grou..

SwiftUI 2021.02.26

swiftUI List, Navigation

List List는 목록 인터페이스를 구형하기 위한 컴포넌트이다. UIKit의 UITableView와 같은 기능을 한다. Example1 import SwiftUI struct ContentView : View { var body: some View { List { Text("A List Item") Text("A Second List Item") Text("A Third List Item") } } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } } List 키워드안에 요소들을 하나 씩 집어넣으면 List가 완성된다. 기본적으로 버튼처럼 사용이 가능한데 현재는 아무런 속성없이 ..

SwiftUI 2021.02.25
반응형