.2 Kết nối đối tượng TapGestureRecognizer với ImageView

Một phần của tài liệu Giáo trình lập trình di động trên iOS Dành cho bậc Cao đẳng (Trang 85 - 88)

Cuối cùng, liên kết code dạng hành vi với đối tượng Tap Gesture Recognizer này với phương thức có tên pickUpImage và trong hàm thêm dòng lệnh để Test thử:

//MARK: Tap Gesture Recognizer Action

@IBAction func pickUpImage(_ sender: UITapGestureRecognizer) { print("The Image view is tapped!")

}

Chạy chương trình và thử Tap lên đối tượng Image view, quan sát kết quả.

Xử lý sự kiện cho đối tượng Button “Go to Map”:

Chức năng này sẽ được thực hiện sau. Tuy nhiên, ta có thể liên kết code trước: //MARK: Go to Map Action

@IBAction func goToMap(_ sender: UIButton) { print("This function is implemented later!") }

2.5.3 Làm việc với UITapGestureRecognizer

Trong phần này chúng ta sẽ tiếp tục xử lý việc lấy ảnh từ thư viện ảnh của iPhone mỗi khi người dùng Tap lên đối tượng ImageView. Với các ứng dụng iOS điều này có thể dễ dàng thực hiện thông qua đối tượng UIImagePickerController. Cũng giống như

TextField, đối tượng Image Picker cũng cho phép nơi sử dụng tự định nghĩa các hành vi đối với ảnh dựa trên UIImagePickerControllerDelegate. Ngồi ra, vì đối tượng

78

Image Picker sẽ được hiển thị mỗi khi tìm và lấy ảnh từ thư viện, do đó ứng dụng cũng cần các chức năng liên quan đến Navigation và cần thực hiện Protocol

UINavigationControllerDelegate. Bước 1: Thực hiện các Protocol cần thiết

class ViewController: UIViewController, UITextFieldDelegate, UIImagePickerControllerDelegate, UINavigationControllerDelegate {…}

Bước 2: Thực hiện chức năng chọn và lấy ảnh

Che dòng lệnh Test trong hàm pickUpImage đã tạo trước đó và thêm vào các dòng lệnh sau để thực hiện việc lấy ảnh mỗi khi Tap lên Image view:

//MARK: Tap Gesture Recognizer Action

@IBAction func pickUpImage(_ sender: UITapGestureRecognizer) { //print("The Image view is tapped!")

// 1. Hide the Keyboard of Textfield txtFoodName.resignFirstResponder()

// 2. Declare object of Image Picker Controller let imagePicker = UIImagePickerController() // 3. Config the images source for the picker imagePicker.sourceType = .photoLibrary

// 4. Delegation of Image picker's Functions imagePicker.delegate = self

// 5. Present the image picker controller to screen present(imagePicker, animated: true, completion: nil) }

Lưu ý: Nếu sử dụng Xcode phiên bản trước 9.0 thì để truy xuất vào thư viện ảnh của

iPhone cần cấp quyền truy cập trong file Info.plist: Mở file Info.plist => Add new item vào cuối file => Chọn “Privacy - Photo Library Usage Description” trong danh sách sổ xuống => String => Thêm vào mơ tả cho quyền (Ví dụ như: Allow to access the Photo Library of the iPhone!).

Bài tập: Chạy chương trình và cho nhận xét!

Bước 3: Viết các hàm xử lý việc lấy ảnh cho đối tượng Image Picker

Đó là các hàm được uỷ quyền với đối tượng Image Picker và chúng ta cần tự viết thao tác cho các hàm đó. Ở đây, hàm imagePickerControllerDidCancel luôn hoạt động ở chế độ mặc định nên không cần viết lại (ngoại trừ chúng ta muốn thay đổi hành vi của nó). Ta chỉ cần viết lại hàm imagePickerController để xử lý việc lấy ảnh vào ứng dụng.

//MARK: Image Picker Controller Delegation's Functions

func imagePickerController(_ picker: UIImagePickerController,

didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey :

Any]) {

guard let selectedImage = info[.originalImage] as? UIImage else { print("Can not read the image!")

return }

// Set the selected image to the image view mealImage.image = selectedImage

// Hide the image picker controller dismiss(animated: true, completion: nil) }

Mỗi khi ảnh được đối tượng Picker lấy về sẽ chứa trong Dictionary info, dựa vào đó chúng ta lấy ảnh gốc về, ép kiểu về dạng UIImage và đưa nó vào trong imageview.

2.5.4 Xây dựng Control mới cho ứng dụng

Với ứng dụng quản lý món ăn, chúng ta cần một đối tượng control để rating cho các món ăn khác nhau có dạng như sau:

Trong phát triển ứng dụng trên iOS, có nhiều cách khác nhau để tạo một control mới như vậy, một trong những cách đó là xây dựng một đối tượng mới dựa trên những đối tượng đã có. Một trong những thiết kế dễ nhất trong trường hợp này là xây dựng đối tượng kế thừa từ lơp StackView (theo chiều ngang), trong đó mỗi ngơi sao có thể là một image view hoặc một button. Ở đây ta sẽ sử dụng các Button.

Bước 1: Xây dựng lớp đối tượng RatingControl

Tạo file mới (Cocoa Touch class) có tên RatingControl kế thừa từ lớp UIStackView (Hình 2.5.4.1) và nội dung lớp sau khi tạo có dạng:

import UIKit

class RatingControl: UIStackView {

// Code to initiate the control here! }

Khi một View được xây dựng, sẽ có hai cách để tạo đối tượng view đó: Tạo bằng câu lệnh trong code hoặc tạo bằng load đối tượng từ storyboard. Do vậy, mỗi đối tượng view mới khi thiết kế cũng cần có hai phương thức khởi tạo tương ứng init(frame:) cho việc tạo đội tượng dùng lệnh và init?(coder:) cho việc load view từ storyboard.

80

Với Control chúng ta đang xây dựng thì cả hai phương thưc này đều sẽ cùng gọi đến một phương thức chung setUpButtons cho việc xây dựng nên Control đó.

Một phần của tài liệu Giáo trình lập trình di động trên iOS Dành cho bậc Cao đẳng (Trang 85 - 88)

Tải bản đầy đủ (PDF)

(137 trang)