Hello các bác, dạo gần đây bận công việc quá không có thời gian ngồi chuẩn bị nội dung về hướng dẫn lập trình. Vừa rồi bảo trì mấy cái app trên appstore mới đụng lại cái mớ thư viện mà lúc trước mình viết bằng swift 2.2, nhân tiện giới thiệu luôn cho các bác.
Lập trình IOS đôi khi cũng có nhiều cái tiện và hầu như bất tiện cũng rất là nhiều, nếu các bác lập trình bên .NET, window form, mà sang viết IOS thì cũng hơi bỡ ngỡ vì có khá nhiều control hữu dụng mà apple lại không làm sẵn. Ví dụ như mấy cái radio button, checkbox, hay hiển thị danh sách theo kiểu selectBox thì hầu như IOS chả có mấy control đó. Do đó mà trong quá trình làm việc, mình phải ngồi tạo tay mấy cái thư viện để vẽ control bị thiếu đó.
Trong bài này mình chỉ hướng dẫn các bác xài thế nào thôi nhé, còn cách xây dựng một thư viện như thế nào trong swift thì mình sẽ có bài viết hướng dẫn lập trình IOS sau nhé các bác.
Trước tiên các bác vào github của mình và download các thư viện rồi kéo thả hết vào project của các bác nhé, github mình đây, rồi bây giờ mình sẽ hướng dẫn làm việc với từng cái.
Tạo Radio trong Swift IOS
– Bước 1: Kéo thả thư viện NTPRadio.swift vào trong project của các bác, rồi vào images.xcassets thêm mới 2 tấm hình lần lượt với tên là Selected và unSelected. Nhìn vào thì biết ngay để làm gì rồi, ở đây mình linh động để cho các bạn tự chọn hình như vậy bạn muốn hình dạng của checkbox như thế nào cũng được, Selected là hình ảnh hiển thị lúc đã được check, unSelected thì ngược lại.
– Bước 2: Khởi tạo radio button bằng đoạn code cưới đây
let radio = NTPRadio(frame: CGRectMake(20, 100, 200, 15), name: "name-of-radio", text: "text display for radio", value: "value-of-radio", selected: true)
Các bác nào lập trình IOS thì nhìn vào hiểu liền đúng không, frame là khai báo tọa độ, name là tên của radio, text là nội dung hiển thị bên cạnh radio, value là giá trị nếu được chọn, selected là để set mặc định nó được check hay là không, thế thôi 😀
– Bước 3: Là bước cuối cùng, bước này rất quan trọng và khó nhất trong bài
self.view.addSubview(radio)
Đoạn đấy có nghĩa là gì thì các bác biết rồi, thêm nó vào cái view cha thôi, quá khó đúng không nào, OK vậy là xong rồi đó, vậy để lấy giá trị của các radio thì như thế nào các bác xem đoạn code dưới này nha.
let selected = NTPRadio.getSelected("name-of-radio")
Đoạn trên sẽ trả về dữ liệu là một chuỗi với giá trị là value chỗ các bác set ở Bước 2 đấy, đối với radio thì thường có nhiều cái thì các bác cứ tạo như trong html thôi, quá đơn giản đúng không. Ngoài ra thì các bác có thể thay đổi màu sắc của text qua biến titleColor ở bước khởi tạo luôn nha.
Tạo Checkbox trong Swift IOS
Ở các bước kéo thả khởi tạo thì các bác làm giống như tạo radio luôn nhé file của nó là NTPCheckBox.swift, ở file README.md trong bộ thư viện mình cũng có viết khá rõ cách làm các bác có thể tham khảo thêm nhé, chứ viết lại biếng quá 😀
Để lấy giá trị của Checkbox các bác dùng đoạn code này nhé
let checked = NTPCheckBox.getAllChecked("name-of-checkbox")
Checkbox thì khác với Radio ở chỗ là, radio chỉ có một giá trị được chọn còn thằng checkbox thì chọn bao nhiêu cũng được do đó mà dữ liệu trả về cũng khác, ở radio chỉ trả về dữ liệu là một chuỗi, còn checkbox sẽ trả về một cái mảng chuỗi.
Trong lập trình IOS thì hầu như dữ liệu lưu dưới dạng chuỗi nên mình trả về dạng chuỗi cho nó linh động, các bác thích ép kiểu sang kiểu Int hay gì đó tùy thích, rồi vậy là xong.
Tạo SelectBox Popup trong Swift IOS
Đây cũng là một control khiếm khuyết trong IOS, nó cũng tương tự như UIPickerView nhưng mình thấy nó không đẹp và cũng hơi khó trong một vài trường hợp hiển thị phù hợp với view cha.
– Bước 1: Kéo thả thư viện NTPListPopup.swift vào project, và khởi tạo control bằng đoạn code bên dưới, chỗ controller NTPListPopupDelegate
let data = [["key": "1", "value": "iphone"], ["key": "2", "value": "samsung"]] let dialog = NTPListPopup(view: self, title: "your title", options: data) dialog.delegate = self dialog.setSelected(key)
title: là tiêu đề hiển thị của cái control đó
options: là dữ liệu các bác truyền vào cho cái selectbox, giả sử mình có mảng dữ liệu truyền vào là cái data khai báo ở trên đấy, các bác lưu ý dữ liệu truyền vào phải đúng định dạng và đúng kiểu như trên biến data mình khởi tạo nhé.
dialog.delegate = self
Chỗ đấy mình phải khai báo như vậy là để sử dụng gán các protocol cho view hiện tại, tức là mình có thể gọi các phương thước định nghĩa trong control ở một view khác.
dialog.setSelected(key)
Các bác muốn selectbox mặc định sẽ được chọn cái nào thì dựa vào dòng code trên để làm chuyện ấy 😀 lưu ý là biến truyền vào là key tương tự như trong biến data nha các bác.
– Bước 2 gọi và sử dụng thôi
Các bác gán sự kiện khi touch vào một cái label nào đó thì gọi dòng code dưới đây để hiển thị cái selectbox dạng popup nhé
dialog.show()
– Bước 3: là bước cuối cùng, làm sao để lấy dữ liệu từ cái selectbox đó, thì lúc này các bác thêm function với tên như sau, lưu ý là phải đúng tên như vậy vì hàm này là một protocol trong selectbox
func NTPListPopupClickedAtButtonIndex(index: String){
// index is the key in array data
}
Khi các bác chọn vào một option trong selectbox đó thì cái function ở trên sẽ được chạy, lúc đó dữ liệu trả về là biến index tức là key của một options trong biến data. Thế thôi quá đơn giản phải không.
Ngoài các control ở trên thì còn thư viện để hiển thị alert là NTPAlert.swift cách sài thì mình đã viết rõ trên github các bạn chịu khó đọc nhé chỉ có một dòng thôi. Mặc định thì IOS cũng đã có cái thông báo alert khá chuẩn men và đẹp rồi, nhưng vì mình thích cái thông báo dạng html5, bootstrap nên tiện tay mình viết luôn. các thư viện có thể hoạt động trên mọi màn hình nên các bác cứ an tâm mà sài, chả sợ bố con thằng nào đâu, chấp luôn thằng iphone 7 mới ra lò 😀
Viết đến đây thôi, thấy hay thì like và share nha các bác, chúc các bác học vui và cuối tuần ăn chơi chác táng vui vẻ 😛
