iT邦幫忙

2024 iThome 鐵人賽

DAY 24
0
Mobile Development

自己的 app 自己寫系列 第 24

[Day24] 好像有些人週五請假

  • 分享至 

  • xImage
  •  

聽說有些人週五要請假,不過我應該是會乖乖上班吧。
希望明天會是好天氣。


app 開發中,手勢和觸控應該是非常常見的功能,而 SwiftUI 中就有一些函示是用來處理這些行為。像是 TapGesture 是用來處理點擊,並且可以設定是單次點擊或多次點擊才會觸發。LongPressGesture 則用來偵測長按,還可以偵測長按時間,設定 minimumDuration 在超過一定時間後才觸發行為,並用 onChanged 和 onEnded 來在不同時間點執行邏輯。。

struct ContentView: View {
    var body: some View {
        Text("Hit it")
            .padding()
            .onTapGesture(count: 1) {
                print("Clicked!")
            }
    }
}

struct ContentView: View {
    var body: some View {
        Text("Click and hold")
            .padding()
            .gesture(
                LongPressGesture(minimumDuration: 2.0)
                    .onEnded { _ in
                        // ...
                    }
            )
    }
}

DragGesture 用來處理拖移,能夠追蹤軌跡的位置變化。.offset 是在不改變原始座標的情況下,去調整偏移量,既而使 view 改變顯示的位置。

struct ContentView: View {
    @State private var offset = CGSize.zero

    var body: some View {
        Text("Drag it")
            .offset(offset)
            .gesture(
                DragGesture()
                    .onChanged { gesture in
                        offset = gesture.translation
                    }
                    .onEnded { _ in
                        print("Dragging end.")
                    }
            )
    }
}

在 SwiftUI 之前,一個很常見的框架就是 UIKir,當中有 UISwipeGestureRecognizer 來處理滑動行為。SwiftUI 中沒有偵測滑動手勢的 function,但可以透過 DragGesture 的變動量來模擬滑動左右行為。

struct ContentView: View {
    @State private var offset = CGSize.zero

    var body: some View {
        Text("Scroll")
            .background(Color.blue)
            .cornerRadius(10)
            .gesture(
                DragGesture()
                    .onEnded { gesture in
                        if gesture.translation.width > 100 {
                            print("Swipe to right")
                        } else if gesture.translation.width < -100 {
                            print("Swipe to left")
                        }
                    }
            )
    }
}

上一篇
[Day23] 明明還沒到冬天台北怎麼開始下雨了
下一篇
[Day25] 買隊服是充值信仰還是盤子
系列文
自己的 app 自己寫30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言