Bài 0 - Thiết kế giao diện trong lập trình ios

Trong phần về ios, tôi post bài viết này đầu tiên vì đây là vấn đề gây nhầm lẫn, vấp váp, làm nản lòng các bạn khi mới học lập trình ios. Đó là khi thiết kế giao diện trong ios. Người ta thường dạy bạn cách dùng kéo thả, nhưng đó là một cách làm không tốt, không tối ưu, thậm chí rất tồi.

Khi bạn lập trình, việc đưa ra màn hình các hình ảnh, chữ, nút bấm được gọi là thiết kế giao diện. Trong lập trình ios, hầu hết các sách Beginning, các hướng dẫn trên mạng đều dùng kéo thả. Ví dụ, bạn muốn đưa một Label ra màn hình đề hiển thị dòng chữ Hello World, thường bạn sẽ được dạy như sau.

Trong Xcode, tại Main.storyboard, trong Object Library ở bên phải phía dưới, tìm Label, nháy chuột phải giữ và kéo nó vào storyboard.

Tiếp theo dùng Constraint để căn chỉnh vị trí của nó và kích thước to nhỏ.

Tức là bạn phải tìm hiểu về Constraint, xem các biểu tượng nhỏ dưới chân bên phải màn hình đó có ý nghĩa gì, dùng như thế nào.

Tiếp theo, để liên kết giao diện với code, bạn lại phải kéo từ Label vào giao diện code để kết nối, đặt tên cho Label, hiển thị lên đó dòng chữ mà mình muốn.

Do mới học, cái gì cũng chưa biết nên bạn chỉ có cách dò dẫm làm theo. Cố gắng ghi nhớ cách dùng Constraint, hơi xê dịch chỗ nào đi một tý lại phải update Constraint , kiểm tra để add Missing Constraints…

Việc dạy như vậy không sai, nhưng thử nghĩ xem nếu bạn cần đưa 100 cái Label ra màn hình ở những vị trí chính xác thì sao ? Không thể dùng tay kéo thả rồi dùng Constraint căn chỉnh thủ công như vậy được.

Ngay cả nếu như chỉ có 1 cái Label thì làm bằng kéo thả vừa mất thời gian, qua nhiều bước phức tạp, vừa có cái gì đó rất nghiệp dư. Nhìn cái Label lôi thôi xộc xệch trong storyboard cảm giác rất chán.

Cách làm đúng đắn là làm trong Code, không động đến Main.storyboard, tức để nó trắng trơn.

Tại màn hình cửa sổ code của file ViewController.swift , để tạo một Label, bạn khai báo nó trước tiên.

var la: UILabel!

Rồi định vị trí của nó.

la = UILabel(frame: CGRect(x: 100, y: 100, width: 280, height: 25))

Set chữ ra, tô màu chữ.

la.text = "Đây là dòng chữ ví dụ"

la.textColor = UIColor.blueColor()

Cuối cùng cho vào view.

view.addSubview(la)

Vậy là chỉ copy vài dòng code vào là xong rồi, rất nhanh gọn đơn giản. Dù là ảnh, nút bấm bạn đều có thể làm như vậy. Muốn tạo nhiều Label, Button, bạn chỉ cần copy các dòng lệnh, sửa đi một chút các chỉ số như tên, vị trí, kích thước, vậy là xong, không cần quan tâm tới storyboard, Constraint và kéo thả nữa.

Đây là cách thiết kế giao diện đúng đắn, được dùng phổ biến khi làm các ứng dụng thực tế. Một khi bạn đã biết cách làm này và sự tiện dụng của nó, bạn không bao giờ còn dùng đến kéo thả nữa.

Khi mới học ios, vì chưa biết làm trong code nên tôi cứ tưởng kéo thả là cách duy nhất. Thế là vừa học Constraints, vừa co kéo thử, vừa than thở sao mà chán thế. Cuối cùng sau vài tuần, chán quá, tôi đành dừng lại, bỏ. Cứ kéo thả như thế thì không thể làm được với nhiều Label. Nhìn cái Storyboard lằng nhằng, lộn xộn với đám Label, Image là phát ngán không thể học được nữa.

Rồi tôi đọc quyển ebook Ios 8 Swift Programming Cookbook, tức là quyển sách trình độ trên Beginning một chút, trong đó, người ta toàn làm giao diện bằng code. Tôi hiểu ra đây mới là cách trong thực tế người ta làm các ứng dụng. Không ai lọ mọ kéo thả từng cái một, người ta dùng code và copy hàng loạt.

Và từ đó mọi thứ trở nên trôi chảy hoàn hảo. Một ngày giờ bằng cả tháng dọ dề trước kia. Không cần quan tâm constraint nữa, học nó chỉ phí công.

Việc học lập trình quan trọng là cách học cho đúng. Bạn cần đọc không chỉ các quyển Beginning mà cả các quyển nâng cao nữa. Vì trong Beginning người ta chỉ dạy bạn cách làm sơ đẳng. Vấn đề là cách sơ đẳng đó có khi lại khó khăn rắc rối hơn cách làm chuyên nghiệp. Và vì mới học, bạn có thể bị sự rắc rối đó cản trở đến mức nghĩ là mình không thể học được.

Lập trình không chỉ có logic mà còn là kỹ năng thao tác cụ thể. Việc học sai cách sẽ mang lại cho bạn những khó khăn không cần thiết. Và vì cảm giác, bạn cứ tưởng rằng mình không đủ tư duy để học nó.

Đây là điều cần tránh đối với bất cứ ai muốn học lập trình.