I. Giới thiệu
Trong phát triển ứng dụng cho Android, một vấn đề mà nhà phát triển cần lưu tâm đó là hệ sinh thái Android có rất nhiều loại thiết bị với các độ phân giải, kích thước màn hình khác nhau. Do vậy, khi muốn đặt ảnh nền cho các thành phần như Button, EditText, Layout… sẽ gặp trường hợp bị vỡ hạt. Hãy xem một ảnh hình màu tím viền đen được đặt làm nền cho layout như sau:
Để khắc phục điều này, Android có đề xuất sử dụng ảnh nine-patch (ảnh có khả năng tự co dãn, phần mở rộng file là thường là .9.png). Cách hoạt động của ảnh loại này là nó cho phép định nghĩa những vùng trên ảnh có thể kéo căng ra mà không bị vỡ, xem hình 1 sau.
Hình 1
Khi áp dụng làm ảnh nền, sự co dãn sẽ thực hiện ở những vùng chỉ định, xem hình 2:
Hình 2
Việc tạo ảnh nine-patch khá dễ dàng, nhất là giờ đây đã được hỗ trợ trên Android Studio. Hãy xem bài hướng dẫn sau đây.
II. Hướng dẫn
Trước hết, hãy tạo ứng dụng Android, hoặc nếu đã có rồi thì việc của bạn là hãy mở lên bằng Android Studio :D.
1. Tạo file ảnh
Nếu bạn biết Photoshop, bạn có thể tạo ảnh bằng công cụ chuyên nghiệp này, ngược lại bạn có thể dùng nhiều công cụ khác (ví dụ tại bài viết này sẽ dùng công cụ Paint trên Google Drive) để tạo ảnh.
Hình 3 – tạo mới bản vẽ bằng Paint trên Google Drive
Hình 4 – thiết lập bản vẽ có kích thước 30x30px
Hình 5 – 30x30px là ảnh nhỏ, ít tốn bộ nhớ
Hình 6 – vẽ hình chữ nhật có góc bo tròn
Hình 7 – Tải ảnh về máy định dạng .png
2. Tạo ảnh nine-patch
Với bộ SDK cũ, công cụ nine-patch đặt tại thư mục tools (Hình 8), còn hiện tại với bản SDK mới đi kèm Android Studio thì đã được tích hợp sẵn (Hình 9).
Hình 8 - draw9patch tích hợp sẵn trong Android SDK
Hình 9 – tích hợp sẵn trên Android Studio
Với bản cũ, mở file draw9patch.bat lên sẽ mở công cụ như Hình 10:
Hình 10
Còn trên Android Studio sẽ như Hình 11:
Hình 11
Cách sử dụng công cụ như sau: đặt dấu chấm đen ở 4 cạnh của hình, kéo thanh Patch Scale để xem hình ảnh khi bị bóp méo, co dãn trông như nào ở hình bên tay phải. Nếu dùng draw9patch.bat thì bạn cần save lại với phần mở rộng là .9.png. Xem hình 12:
.png)
Hình 12
Hình 13 – chọn resource ảnh nine-patch cho android:bachground
Hình 14 – kết quả mỹ mãn :D
III. Kết luận
Như vậy, qua hướng dẫn này bạn đã biết cách tạo ảnh tự co dãn sử dụng cho các loại màn hình, các độ phân giải khác nhau trên các ứng dụng Android. Hy vọng bài viết giúp ích nhiều cho các bạn. Nếu thích, hãy “lai” và chia sẻ bài viết, xin cảm ơn và hẹn gặp tại Bachkhoa-Aptech.
Giảng viên: Vũ Tuấn Minh
