CHƯƠNG IV MỘT SỐ THAO TÁC CƠ BẢN
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (39.29 MB, 420 trang )
4.1 APP ICON – LOADING SCREEN
Phần này sẽ hướng dẫn bạn cách hiển thị cũng như tạo icon, background image,
loading screen cho ứng dụng của bạn. App icon, background image, loading screen cho
ứng dụng của bạn cần dựa theo kích thước quy định của Apple và nên ở định dạng PNG.
Bạn có thể tham khảo thêm kích thước chuẩn ở đây
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/IconM
atrix.html#//apple_ref/doc/uid/TP40006556-CH27-SW1.
4.1.1 App Icon
App icon là biểu tượng của ứng dụng sẽ hiển thị ra màn hình iPhone sau khi ứng
dụng được cài đặt, đồng thời icon của ứng dụng cũng hiển thị lên App Store khi bạn đem
ứng dụng của mình lên App Store. Có hai loại icon là icon dành cho ứng dụng trên iPhone
và icon dành cho ứng dụng trên App Store. App icon cho iPhone Rentina là 120x120,
App icon cho App Store là 1024x1024.
Hình 4.1 Icon
Sau khi chuẩn bị được hình ảnh với kích thước phù hợp, trong phần thông tin của
Project, bạn kéo xuống phần App icon và kéo các icon chuẩn bị sẵn vào đúng vị trí của
icon.
73
Hình 4.2 Kéo thả icon vào vị trí
Bạn tiến hành chạy thử ứng dụng trên iOS Simulator sẽ thấy icon của ứng dụng.
Hình 4.3 Icon trên iOS simulator
74
4.1.2 Loading Screen
Loading Screen là hình ảnh mà khi chạy ứng dụng lên bạn sẽ thấy nó, tùy theo tốc
độ của ứng dụng mà thời gian hiển thị Loading Screen nhanh hoặc chậm khác nhau. Để
chuẩn bị cho Loading Screen bạn cần chuẩn bị trước hình ảnh dạng PNG, kích thước
640x1136 (iPhone 5 trở lên), 640x960 (iPhone 4).
Hình 4.4 Chuẩn bị Background
Sau khi chuẩn bị xong hình ảnh, trong phần Lauch Image, bạn kéo thả hình ảnh vào
Xcode cho đúng vị trí.
Hình 4.5 Kéo thả background image vào Lauch Image
75
4.2 THAY ĐỔI APP NAME
App Name là tên của ứng dụng hiển thị bên dưới App icon trên màn hình iPhone.
Nhiều trường hợp vì tên ứng dụng quá dài nên không thể hiển thị hết trên màn hình
iPhone, do đó bạn cần phải đổi tên ứng dụng lại cho phù hợp, ngắn gọn để có thể hiện
được tên ứng dụng bên dưới icon, như vậy ứng dụng sẽ có tính thẩm mỹ hơn. Để khắc
phục trường hợp này, bạn cần phải thay đổi lại App Name. Bạn truy cập tập tin .plist và
sửa đổi Bundle Display Name thành tên mới của ứng dụng.
Hình 4.6 Truy cập tập tin .plist
76
Hình 4.7 Sửa đổi Bundle display name
Sau khi hoàn tất, bạn chạy ứng dụng trên iOS Simulator để xem kết quả.
Hình 4.8 Thay đổi tên trên iOS Simulator
77
4.3 ẨN STATUS BAR
Việc ẩn status bar cho phép bạn chạy ứng dụng của mình toàn màn hình mà không
phải thu nhỏ một phần giao diện dành chỗ cho status bar. Trước tiên bạn chọn tập tin
.plist trong project, sau đó bạn thêm một dòng mới.
Hình 4.9 Thêm dòng mới
Trong danh sách lựa chọn của dòng mới thêm vào, bạn lựa chọn Status bar is
initially hidden và trả về giá trị là yes.
Hình 4.10 Chọn giá trị Yes
78
Chạy ứng dụng trên iOS Simulator để xem kết quả.
Hình 4.11 Thanh trạng thái Status bar đã mất
4.4 BACKGROUND
4.4.1 Background Image
Hướng dẫn này sẽ hướng dẫn bạn tạo và sử dụng một hình ảnh làm hình nền cho
ứng dụng của bạn. Trước tiên bạn cần phải chuẩn bị một tấm ảnh để làm hình nền. Kích
thước của tấm ảnh này giống như hình ảnh trong Loading Screen: định dạng PNG, kích
thước 640x1136 (iPhone 5 trở lên), 640x960 (iPhone 4).
79
Hình 4.12 Background Image
Sau khi chuẩn bị xong hình ảnh để làm background cho ứng dụng, bạn chép hình
ảnh vào trong project.
Hình 4.13 Chép hình ảnh vào Project
80
Tiếp theo bạn từ Utility area, bạn kéo thả đối tượng UIImage View vào Interface
Builder, điều chỉnh kích thước UIImage View cho vừa với màn hình.
Hình 4.14 Kéo thả UIImage View vào Project
Trong Inspector selector pane > Attributes inspector, bạn tìm đến mục Image
View > chọn Image > lựa chọn hình ảnh bạn muốn làm background.
81
Hình 4.15 Lựa chọn hình ảnh làm background
Kết quả.
Hình 4.16 Thay đổi background bằng image
82
4.4.2 Background Color
Ngoài việc sử dụng hình ảnh làm background cho ứng dụng, nếu bạn yêu thích sự
đơn giản, bạn có thể tạo background bằng cách dùng một màu mà bạn ưa thích. Trong
Inspector selector pane, bạn chọn Attributes inspector, tìm đến phần Background.
Hình 4.17 Attributes inspector
Tại đây bạn cho hiện ra bảng màu để chọn lựa với nhiều màu khác nhau, hãy lựa
chọn cho mình một màu phù hợp, nếu muốn nhiều màu hơn có thể chọn Other.
Hình 4.18 Chọn màu
83
