Cách xoay hình ảnh trong ImageView theo góc độ trên iOS bằng Swift

Giới thiệu

Xoay hình ảnh (rotate) là kỹ thuật phổ biến trong các app chỉnh sửa ảnh, game, hoặc hiệu ứng UI. iOS cung cấp cách đơn giản qua thuộc tính transform của UIView (kế thừa bởi UIImageView).

Các bước thực hiện

Bước 1: Tạo dự án

Xcode → New Project → Single View Application → Tên "RotateImage".

Bước 2: Thiết kế giao diện

Thêm 1 UIImageView và 2 Button ("Xoay 90°", "Xoay 45°") lên Main.storyboard. Thêm ảnh mẫu vào ImageView.

Bước 3: Kết nối IBOutlet & IBAction

@IBOutlet var imageView: UIImageView!

@IBAction func rotate90button(_ sender: Any) { }
@IBAction func rotate45button(_ sender: Any) { }

Bước 4: Viết code xoay ảnh

Sử dụng transform.rotated(by:) với góc tính bằng radian:

@IBAction func rotate90button(_ sender: Any) {
    // 90 độ = π/2 radian
    imageView.transform = imageView.transform.rotated(by: CGFloat(Double.pi / 2))
}

@IBAction func rotate45button(_ sender: Any) {
    // 45 độ = π/4 radian
    imageView.transform = imageView.transform.rotated(by: CGFloat(Double.pi / 4))
}

Bước 5: Chạy thử

Mỗi lần bấm button, ảnh xoay thêm góc tương ứng (tích lũy).

Công thức chuyển đổi độ sang radian

radian = degree * Double.pi / 180

Ví dụ:

• 90° → Double.pi / 2
• 45° → Double.pi / 4
• 180° → Double.pi
• 270° → 3 * Double.pi / 2

Nâng cao: Animation xoay mượt mà

@IBAction func rotateAnimated(_ sender: Any) {
    UIView.animate(withDuration: 0.5) {
        self.imageView.transform = self.imageView.transform.rotated(by: CGFloat(Double.pi / 2))
    }
}

Nâng cao: Xoay về góc cố định (không tích lũy)

// Xoay chính xác 90 độ từ trạng thái gốc
imageView.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi / 2))

// Xoay 45 độ từ trạng thái gốc
imageView.transform = CGAffineTransform(rotationAngle: CGFloat(Double.pi / 4))

// Reset về gốc
imageView.transform = .identity

Lưu ý

• transform tác động lên toàn bộ view (kể cả subviews).
• Xoay liên tục làm biến dạng frame - tránh dùng frame sau khi transform.
• Để xoay chỉ ảnh bên trong mà không xoay frame, hãy xoay imageView.layer hoặc dùng UIImage vẽ lại.