Android có hàng tỷ thiết bị, đa dạng phần cứng, kích thước màn hình, tỷ lệ màn hình,… cho nên việc sử lý hình ảnh trên Android chưa bao giờ là dễ dàng.

Để giúp chúng ta xử lý hình ảnh đơn giản hơn, Android SDK cung cấp sẳn cho chúng ta control ImageView với nhiều kiểu sử lý hình ảnh khác nhau như: fitCenter, fitStart, fitEnd, center, centerCrop, centerInside, matrix. Nhưng chúng khác nhau thế nào? chọn cái nào là thích hợp nhất? Để giúp các bạn trả lời những câu hỏi này chúng ta cùng đi sâu tìm hiểu chi tiết với 1 bài demo nho nhỏ.

hình gốc(1500x803)
hình gốc(1500×803)
  • Tất cả các ví dụ bên dưới được hiển thị trên màn hình Nexus 4 (768×1280)
  • 1tấm hình lớn kích thước (1500 × 803) từ tấm hình này tạo ra 4 tấm hình có kích thước và chiều khác nhau.
  • 2 hình có kích thước lớn màn hình device. Gồm 1 landscape và 1 portrait kích thước (1500 × 803)
  • 2 hình có kích thước nhỏ hơn màn hình device. Gồm 1 landscape và 1 portrait kích thước (100 × 53)
  • trong các hình ảnh minh hoạ, thiết bị nào có background màu nâu thì đang hiển thị hình lớn(có thể portrait hoặc landscape), thiết bị nào có background màu xanh thì đang hiển thị hình kích thước nhỏ(có thể portrait hoặc landscape)

– fitCenter: tâm của image view và tâm của bitmap trùng nhau. nhưng bitmap bị scale sao cho toàn bộ khung của bitmap nằm vừa lọt trong khung của ImageView. lúc này toàn bộ bitmap sẽ được hiển và không bị cắt. nhưng ImageView có thể chứa không gian trống(những phần màu nâu, hoặc xanh là những không gian trống).fitcenter

– fitStart: bitmap sẽ được scale tương tự như fitCenter nhưng thay vì tâm của image view và bitmap trung nhau thì lần này left của ImageView và bitmap sẽ trùng nhau.

fitstart

– fitEnd: bitmap củng được scale tương tự như fitCenter nhưng thay vì tâm của image view và bitmap trung nhau thì lần này right của ImageView và bitmap sẽ trùng nhau.

fitend

– fitXY: bitmap sẽ được scale đúng bằng kích thước của ImageView.

fitxy

– center: tâm của ImageView và tâm của bitmap trùng nhau. bitmap không bị scale

center

– centerCrop: tâm của ImageView và tâm của bitmap vẩn trùng nhau. nhưng bitmap bị scale sao cho khung của bitmap vừa chứa gọn toàn bộ khung của ImageView, phần thừa của bitmap sẽ bị cắt đi(nếu có).

centercrop

– centerInside: tâm của ImageView và tâm của bitmap trùng nhau. nếu size của bitmap nhỏ hơn size của ImageView thì bitmap sẽ không bị scale. nếu size của bitmap lớn hơn size của ImageView => bitmap sẽ được scale tương tự fitCenter.

centerinside

– matrix: sử dụng matrix để render bitmap. ImageView.setImageMatrix(matrix). Xử lý hình ảnh bằng matrix rất mạnh mẽ nhưng khá phức tạp, sau này nếu có thời gian mình sẽ viết riêng 1 bài về nó.

matrix

Đến đây mình hi vọng thông qua bài viết này có thể giúp các bạn thu lượm thêm được 1 ít kiến thức về ScaleType trong ImageView. Cái nào củng có khuyết điểm, ưu điểm, sử dụng cái nào là tuỳ vào từng hợp.

Thân ái!

Advertisements