Gesture
OnTapGesture
.onTapGesture(count: 2, perform: {
if imageScale == 1 { // 확대되지 않은 상태면
withAnimation(.spring()) {
imageScale = 5 // Scale up
}
} else { // 확대된 상태면
resetImageState() // 위치와 크기 원래 상태로 되돌림
}
})UIKit에서도 터치 이벤트를 다루는 메소드가 있었는데 SwiftUI에서는 .onTapGesture 가 그 역할을 한다. 파라미터로는 count 와 perform 이 있는데, count 는 view 를 몇 번 터치했는지, perform 은 그 경우 발생하는 action 을 정의한다. 위 코드에서는 사용자가 view 를 더블 클릭하면 perform에 정의된 구문이 실행된다.
MagnificationGesture
.gesture(
MagnificationGesture()
.onChanged { value in
withAnimation(.linear(duration: 1)) {
if imageScale >= 1 && imageScale <= 5 {
imageScale = value
} else if imageScale > 5 {
imageScale = 5
}
}
}
.onEnded { _ in
if imageScale > 5 {
imageScale = 5
} else if imageScale <= 1 {
resetImageState()
}
}
)이미지를 손가락으로 확대하거나 축소할 때 사용한다. 사용자가 화면과의 상호작용을 하게 되면 .onChange() 안에 있는 구문이 실행된다.
previewLayout()
SwiftUI에서 파일을 생성하면 뷰를 구성하는 구조체와 프리뷰를 생성하는 구조체 각각 하나씩이 생성된다. 이 때 프리뷰는 보통 Xcode의 코드 작성 파트 오른쪽에 이렇게 표시된다.
그런데 위 사진처럼 element 하나를 위해 만들어진 뷰가 있을 수 있다. 그런 뷰에서 조금 더 작업을 쉽게 하기 위해 SwiftUI에서는 previewLayout() 을 지원하는데, .previewLayout(.sizeThatFits) 이렇게 코드를 작성하면 ... 놀랍게도 아무 일도 일어나지 않는다. 강의에서는 휴대폰 화면이 사라지고 돋보기만 남았는데, 버전이 달라서 그런가? 라는 생각을 하다가 해결책을 찾았다.
왼쪽 아래에 있는 버튼 중 왼쪽에서 두번째 버튼을 누르면 된다.
그러면 이렇게 화면이 바뀐다.
Group
Group {
HStack {
// SCALE DOWN
Button {
withAnimation(.spring()) {
if imageScale > 1 {
imageScale -= 1
if imageScale <= 1 { // defensive coding
resetImageState()
}
}
}
} label: {
ControlImageView(icon: "minus.magnifyingglass")
}
// RESET
Button {
resetImageState()
} label: {
ControlImageView(icon: "arrow.up.left.and.down.right.magnifyingglass")
}
// SCALE UP
Button {
withAnimation(.spring()) {
if imageScale < 5 {
imageScale += 1
if imageScale > 5 { // defensive coding
imageScale = 5
}
}
}
} label: {
ControlImageView(icon: "plus.magnifyingglass")
}
} //: CONTROLS
.padding(EdgeInsets(top: 12, leading: 20, bottom: 12, trailing: 20))
.background(.ultraThinMaterial)
.cornerRadius(12)
.opacity(isAnimating ? 1 : 0)
}
.padding(.bottom, 30)
, alignment: .bottom여러 개의 View에 동일한 속성을 부여하고 싶은 경우 사용한다.
참고자료
https://seons-dev.tistory.com/entry/Button버튼
https://velog.io/@snack/SwiftUI-OnTapGesture