Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> iOS

วิธาจัดการ Swipe Gesture ซ้าย/ขวา ใน iOS App

ใช้ UISwipeGestureRecognizer จัดการ Swipe Gesture 4 ทิศทาง (Left, Right, Up, Down)

วิธีที่ 1: Storyboard

  1. ลาก Swipe Gesture Recognizer จาก Object Library → วางบน View Controller
  2. Attributes Inspector → Swipe → เลือก Direction (Right/Left/Up/Down)
  3. Ctrl+Drag ไป Class → Action: @IBAction func swipeHandler(_ sender: UISwipeGestureRecognizer)
  4. ทำซ้ำสำหรับทิศทางอื่น (ต้องสร้าง Gesture แยกตัวละทิศทาง)

วิธีที่ 2: โค้ด (Programmatic) - แนะนำ


override func viewDidLoad() {
    super.viewDidLoad()
    
    let directions: [UISwipeGestureRecognizer.Direction] = [.left, .right, .up, .down]
    
    for direction in directions {
        let swipe = UISwipeGestureRecognizer(target: self, action: #selector(handleSwipe(_:)))
        swipe.direction = direction
        view.addGestureRecognizer(swipe)
    }
}

@objc func handleSwipe(_ sender: UISwipeGestureRecognizer) {
    switch sender.direction {
    case .left:
        print("⬅️ Left Swipe")
        // Next Page, Delete Action, etc.
    case .right:
        print("➡️ Right Swipe")
        // Previous Page, Undo, etc.
    case .up:
        print("⬆️ Up Swipe")
    case .down:
        print("⬇️ Down Swipe")
    default:
        break
    }
}

Swipe บน Element เฉพาะ (ไม่ใช่ Full View)


// เพิ่มบน Table View Cell (ใน cellForRowAt)
let swipeLeft = UISwipeGestureRecognizer(target: self, action: #selector(cellSwiped(_:)))
swipeLeft.direction = .left
cell.addGestureRecognizer(swipeLeft)

let swipeRight = UISwipeGestureRecognizer(target: self, action: #selector(cellSwiped(_:)))
swipeRight.direction = .right
cell.addGestureRecognizer(swipeRight)

@objc func cellSwiped(_ sender: UISwipeGestureRecognizer) {
    guard let cell = sender.view as? UITableViewCell,
          let indexPath = tableView.indexPath(for: cell) else { return }
    
    if sender.direction == .left {
        // Show Delete Button
    } else {
        // Hide/Action
    }
}

UISwipeGestureRecognizer vs UIPanGestureRecognizer

คุณสมบัติSwipePan
Detectทิศทาง Discrete (4 ทิศ)Continuous (Velocity, Translation)
ใช้สำหรับNavigation, Delete, DismissDrag & Drop, Custom Slider, Pull to Refresh
Precisionต่ำสูง

UITableView Swipe Actions (iOS 11+ แนะนำ)


func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
    let delete = UIContextualAction(style: .destructive, title: "Delete") { _, _, complete in
        // Delete logic
        complete(true)
    }
    delete.backgroundColor = .systemRed
    delete.image = UIImage(systemName: "trash")
    
    let archive = UIContextualAction(style: .normal, title: "Archive") { _, _, complete in
        complete(true)
    }
    archive.backgroundColor = .systemBlue
    
    return UISwipeActionsConfiguration(actions: [delete, archive])
}

func tableView(_ tableView: UITableView, leadingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
    let favorite = UIContextualAction(style: .normal, title: "Favorite") { _, _, complete in
        complete(true)
    }
    favorite.backgroundColor = .systemOrange
    return UISwipeActionsConfiguration(actions: [favorite])
}