[SwiftUI] watchOS 사용해보기
7개의 애플 제품을 쓰는 필자는 흔히 '앱등이'이다. 그 중 당연하게도 애플워치를 사용하고 있는데 이 애플워치를 활용하여 개발을 하면 재밌을 거 같아서 watchOS를 사용해 보았다. 이번 게시글의 목표인 완성된 결과물을 보자.
먼저, 새 프로젝트를 만드는데 iOS App with Watch App
과 Watch App
이 있다. 전자는 애플워치 뿐만 아니라 아이폰이 함께 동작하도록 개발할 때 선택하고 후자는 독립적으로 애플워치만을 위한 App을 개발할 때 선택한다. 필자는 후자인 Watch App을 선택하였다.
그러면 우리가 iOS에 대해 작업을 했던 것처럼 ContentView
에 작성하면 된다.
먼저 score의 text와 클릭할 때마다 score의 값이 변하는 것을 구현하기 위해 아래와 같이 작성하였다.
struct ContentView: View {
@State var score = 0
var body: some View {
VStack {
Text("score: \(score)")
}
}
}
score를 왼쪽 정렬해야 하므로 아래와 같이 Text를 왼쪽 정렬한 후 Spacer와 함께 HStack
에 넣는다.
struct ContentView: View {
@State var score = 0
var body: some View {
VStack {
HStack {
Text("score: \(score)")
.frame(alignment: .leading)
.padding()
Spacer()
}
}
}
}
마지막으로 버튼을 추가해주면 되는데 버튼을 클릭할 때마다 score를 1씩 증가시키고, switch문을 사용해 현재 score값이 0~9라면 빨간 색, 10~19라면 노란 색, 그 외의 값이라면 파란 색으로 설정해주었다.
아래는 전체 소스 코드이다.
import SwiftUI
struct ContentView: View {
@State var score = 0
@State var currentColor = 0
var colors = [Color.red, Color.yellow, Color.blue]
var body: some View {
VStack {
HStack {
Text("score: \(score)")
.frame(alignment: .leading)
.padding()
Spacer()
}
Button(action: {
score += 1
switch score {
case 0...9:
currentColor = 0
case 10...19:
currentColor = 1
default:
currentColor = 2
}
}) {
Circle()
.fill(colors[currentColor])
}
.buttonStyle(PlainButtonStyle())
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
이렇게 함으로써 우리가 원하는 결과물을 만들어 보았다. 애플워치로 시계와 운동 기능만 즐겼던 필자에겐 간단하지만 재밌었기 때문에 이를 더 확장시켜서 무언가를 만들 계획이다.
Author And Source
이 문제에 관하여([SwiftUI] watchOS 사용해보기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@eunsung-dev/SwiftUI-watchOS-사용해보기저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)