Bộ xương ứng dụng để hỗ trợ nhiều màn hình


92

Như chúng ta đã biết Android đi kèm với nhiều thiết bị có các Tính năng, Độ phân giải và Kích thước màn hình khác nhau, vì vậy trong khi phát triển một Ứng dụng hỗ trợ nhiều màn hình (nhỏ và lớn) sẽ có trở ngại về kích thước và bố cục.

Điều này dẫn đến sự kết hợp khác nhau giữa kích thước màn hình, độ phân giải và DPI và tạo ra khá nhiều thách thức khi thiết kế và phát triển cho các thiết bị Android. Trong khi một số Nhà sản xuất khác (không phải Android) có độ phân giải và DPI khác nhau, chúng có cùng kích thước màn hình và độ phân giải tuân theo cùng một tỷ lệ khung hình. Do đó, một hình ảnh có thể được tạo để phù hợp với các thiết bị không phải Android.

Câu hỏi của tôi là có một luồng hoặc kiến ​​trúc thích hợp mà người ta nên tuân theo để đáp ứng yêu cầu không?

nhập mô tả hình ảnh ở đây

Hãy nhớ rằng chúng tôi có các máy tính bảng có kích thước và độ phân giải khác nhau.

Tôi biết rằng Nhà phát triển Android có chứa thông tin này nhưng quan điểm của tôi là từ việc triển khai.

Từ kiến ​​thức của tôi, những gì tôi hiểu là để thiết kế đồ họa Android, ngay cả Lập trình viên cũng phải biết khái niệm thiết kế.


13
Các bạn có chắc câu hỏi này không mang tính xây dựng không?
Mohammed Azharuddin Shaikh

6
Tôi nghĩ nó rất mang tính xây dựng. Muốn biết lý do của việc bỏ phiếu xuống.
Lazy Ninja

11
@MKJParekh mất MicroMax Funbook gsmarena.com/micromax_funbook_p300-4701.php 7", 480X800, Ldpi (133 dpi) bạn có thể cho tôi biết trong đó loại (drawble lớn hoặc Ldpi hoặc nếu Android v3.0 sw-480) nó sẽ rơi?
Mohammed Azharuddin Shaikh

1
@LazyNinja lý do của việc giảm phiếu bầu là những kẻ mất trí và những kẻ điên rồ. Ai chỉ nghĩ rằng họ chỉ có thể đặt câu hỏi mang tính xây dựng: p
AZ_

1
@AZ_ :) Chúng tôi đã sử dụng cấu trúc res này trong thư mục res drawable drawable-hdpi drawable-hdpi-v11 drawable-hdpi-v9 drawable-big drawable-big-hdpi drawable-ldpi drawable-mdpi drawable-mdpi-v11 drawable-small drawable- xhdpi drawable-xhdpi-v11 drawable-xxhdpi drawable-xxhdpi-v11 layout layout-small layout-sw530dp layout-sw720dp layout-xlarge giá trị-sw530dp giá trị-sw720dp giá trị-v14 giá trị-xlarge và sử dụng kích thước được xác định rõ ràng trong xml từ thư mục giá trị . FYKI ứng dụng của chúng tôi hỗ trợ hơn 5 nghìn loại thiết bị.
MKJParekh

Câu trả lời:


147

Cuối cùng đã tạo ra một cấu trúc xử lý các bố cục và biểu tượng cho nhiều màn hình.

Android tổng hợp hiển thị thiết bị thành các danh mục dựa trên hai tham số:

  • Kích thước màn hình, kích thước vật lý của màn hình (được đo theo đường chéo)
  • Mật độ màn hình, mật độ điểm ảnh vật lý của màn hình (tính bằng pixel trên inch hoặc ppi)

Để nhanh chóng xác định kích thước và mật độ màn hình, vui lòng cài đặt ứng dụng " Kích thước của tôi " dành cho Android.

Kích thước màn hình

Android xác định bốn kích thước màn hình tổng quát:


 Qualifier           Size

 small               ~3 inches (approx) 
 normal              ~4 inches (approx) 
 large               Exceeds 4 inches    
 xlarge              Exceeds 7 inches  
  • Hầu hết các điện thoại được phân loại là nhỏ hoặc bình thường (khoảng 3 đến 4 inch theo đường chéo). Nhưng hiện nay, có rất nhiều điện thoại có màn hình lớn như Galaxy S4, HTC One, Xperia Z
  • Một máy tính bảng nhỏ như Samsung Galaxy Tab được phân loại là lớn (lớn hơn 4 inch)
  • Cực lớn áp dụng cho các thiết bị lớn, ví dụ: máy tính bảng lớn

Android xác định bốn mật độ màn hình tổng quát:


 Qualifier         Description         Nominal value

 ldpi              low density          120 ppi
 mdpi              medium density       160 ppi
 hdpi              high density         240 ppi
 xhdpi             extra high density   320 ppi

Điển hình:

  • kích thước màn hình ảnh hưởng nhiều nhất đến bố cục ứng dụng của bạn
  • mật độ màn hình ảnh hưởng nhiều nhất đến tài nguyên hình ảnh và đồ họa của bạn

Nó được liệt kê ở đây sự khác biệt phần trăm của màn hình thiết bị

  • Ldpi- 75%
  • Mdpi- 100% (cơ sở theo trang web nhà phát triển Android)
  • Hdpi- 150%
  • XHdpi- 200%

nhập mô tả hình ảnh ở đây

Nhưng như chúng ta biết bây giờ hầu hết các thiết bị đi kèm với 480X800, vì vậy tôi coi đây là thiết bị dựa trên, vì vậy phép tính mới của chúng tôi sẽ như thế này

  • Ldpi- 50%
  • Mdpi- 66,67%
  • Hdpi- 100%
  • XHdpi- 133,33%

có nghĩa là biểu tượng và thiết kế đầu tiên sẽ chỉ được tạo cho 480X800 và sau đó là các biểu tượng và thiết kế còn lại (tức là Ldpi, Mdpi, Xhdpi).

Có những hình ảnh chung cho tất cả các bố cục và phải đồng nhất về màu sắc và hình dạng (không có hình dạng phức tạp, không có đường cong) vì vậy đối với loại hình ảnh này, chúng tôi đang tạo hình ảnh sẽ 9patchđược đưa vào thư mục “có thể vẽ (không có hậu tố)”. Để tạo hình ảnh 9Patch, bạn có thể sử dụng DrawNinePatch hoặc BetterNinePatch

Bây giờ chỉ cần đổi tên hình ảnh của bạn dựa trên tiêu chuẩn của Android và hoàn thành ứng dụng của bạn hdpi, sau đó chỉ cần lấy drawable-hdpithư mục và Mở Adode Photoshop (được khuyến nghị) tạo Hành động có nhiều kích thước (chỉ cần thay đổi kích thước theo tỷ lệ phần trăm) sau khi Hành động được tạo cho tất cả kích thước rồi chỉ cần thực hiện Tự động hóa hàng loạt và cung cấp nguồn (drawable-hdpi) và đích (drawable-ldpi, drawable-mdpi, drawable-xdpi).

Lý do tôi nhấn mạnh bạn sử dụng Photoshop vì nó sẽ tự động thay đổi kích thước hình ảnh của bạn bằng Actions và một điểm cộng nữa là bạn không cần phải đổi tên tệp (nó sẽ gán tên giống như tên gốc).

sau khi bạn hoàn thành việc tạo tất cả các hình ảnh, hãy làm mới dự án của bạn và kiểm tra nó.

Đôi khi có thể có khả năng bố cục hỗ trợ màn hình (xhdpi, hdpi, mdpi) có thể bị cắt trong màn hình nhỏ (ldpi), vì vậy để xử lý điều này, chỉ cần tạo thư mục Bố cục riêng biệt (bố cục nhỏ) cho nó và thêm ScrollView (chủ yếu). Đó là nó.

Máy tính bảng Máy tính bảng được phân loại thành hai kích thước.

  1. 7 "(1024X (600-48 (thanh điều hướng))) = 1024X552 (có thể kéo được-lớn)
  2. 10 "(1280X (800-48 (thanh điều hướng))) = 1280X752 (drawable-xlarge)

Trong điều này, chúng ta cần tạo hình ảnh cho cả màn hình và chỉ cần đặt chúng cho phù hợp

Vì vậy, tất cả chúng ta sẽ có thư mục này trong ứng dụng của mình để hỗ trợ nhiều màn hình.

drawable
drawable-ldpi
drawable-mdpi
drawable-hdpi
drawable-xhdpi
drawable-large
drawable-xlarge

sẽ là sự kết hợp nhiều vòng loại hơn với Screen size and Screen density

drawable-large-ldpi
drawable-large-mdpi
drawable-large-hdpi
drawable-large-xhdpi

vòng loại hơn với Screen density and Version

drawable-ldpi-v11
drawable-mdpi-v11
drawable-hdpi-v11
drawable-xhdpi-v11

và nhiều vòng loại hơn với Screen size and Version

drawable-large-v11
drawable-xlarge-v11

và nhiều vòng loại hơn với Smallest width concept(SW)

 drawable-sw???dp

Hơn nữa trong Android V3.0 Honeycomb, họ đã giới thiệu khái niệm mới về SW(smallest width)thiết bị được phân loại theo chiều rộng màn hình, vì vậy nếu chúng tôi đang tạo một thư mục có têndrawable-sw360dp thì thiết bị có 720dp (chiều rộng hoặc chiều cao) sẽ sử dụng tài nguyên từ thư mục này.

ví dụ để tìm hậu tố Samsung Galaxy S3 dp thành drawable-sw? dp
với tham chiếu của DP Tính toán , Nếu bạn muốn hỗ trợ bố cục của mình hoặc có thể vẽ cho S3 thì phép tính cho biết

px = Chiều rộng của thiết bị = 720
dpi = Mật độ của thiết bị = 320

công thức đưa ra

    px = dp * (dpi / 160)

hoán đổi công thức vì chúng ta có giá trị của px

    dp = px / (dpi / 160)

bây giờ đặt giá trị,

     dp= 720 / (320/160);
     dp=360. 

vì thế drawable-sw360dp sẽ làm công việc

Giúp bạn cấu hình thiết bị từ GsmArena bạn cũng có thể tạo thư mục theo phiên bản API Android của thiết bị tức là drawable-hdpi-v11` vì vậy thiết bị có API11 và là Hdpi thì nó sẽ sử dụng tài nguyên này.

Mẹo bổ sung:

  • Sử dụng bố cục tương đối, dp, sp và mm

    đơn vị dp - pixel độc lập của thiết bị được chuẩn hóa thành 1 pixel vật lý trên màn hình 160 ppi tức là mật độ trung bình. Được mở rộng trong thời gian chạy. Sử dụng cho kích thước phần tử màn hình

    đơn vị sp - pixel được chia tỷ lệ, được chỉ định dưới dạng giá trị dấu chấm động, dựa trên đơn vị dp nhưng được chia tỷ lệ bổ sung cho cài đặt tùy chọn kích thước phông chữ của người dùng. Được mở rộng trong thời gian chạy. Sử dụng cho các kích thước phông chữ

    bạn nên luôn sử dụng RelativeLayout cho các bố cục; AbsoluteLayout không được dùng nữa và không nên sử dụng.

  • Sử dụng các định dạng hình ảnh thích hợp - PNG so với JPEG

    Android "prefers" PNG for bitmap image files, "accepts" JPEG, and "discourages" GIF.

    Tuy nhiên, PNG và JPEG không phải là tương đương. Chúng có sự đánh đổi chất lượng khác nhau và PNG không phải lúc nào cũng tốt nhất:

    JPEG có thể giảm tới 50% kích thước tệp so với PNG, điều này rất quan trọng nếu ứng dụng của bạn có nhiều hình ảnh

    JPEG "mất dữ liệu" chất lượng cao hơn có thể trông đẹp hơn PNG "không mất dữ liệu" được nén cao, cho cùng kích thước tệp

  • Thêm nhãn vào hình ảnh và đồ họa của bạn để gỡ lỗi

  • Sử dụng phần tử màn hình hỗ trợ

  • Định cấu hình trình giả lập của bạn với các giá trị thiết bị thực

    Thông thường, các hệ thống máy tính để bàn hiển thị ở 72ppi (Mac) hoặc 96ppi (Windows, Linux). So với di động, màn hình máy tính để bàn luôn có mật độ thấp.

    Luôn định cấu hình trình giả lập Android của bạn để bắt chước các giá trị thiết bị thực và luôn đặt chúng theo tỷ lệ để mô phỏng mật độ thiết bị.

    Trong Eclipse, thật dễ dàng để tạo nhiều trình giả lập (từ thanh menu Eclipse, chọn Window> AVD Manager> New ) được định cấu hình với các giá trị cho thiết bị thực:

    Đặt tên trình giả lập cho thiết bị thực mà nó đang mô phỏng Chỉ định độ phân giải, không sử dụng Kích thước chung được tích hợp sẵn Đặt mật độ thiết bị để khớp với thiết bị thực (trong ngăn Phần cứng đặt Thuộc tính LCD trừu tượng thành mật độ thực, luôn là giá trị số nguyên)

    Khi bạn khởi chạy thiết bị, luôn chọn Tỷ lệ hiển thị thành kích thước thực và nhập kích thước màn hình thực bằng inch.

    Nếu bạn không đặt mật độ thiết bị, trình giả lập sẽ mặc định ở mật độ thấp và luôn tải các tài nguyên dành riêng cho ldpi. Độ phân giải (kích thước pixel) sẽ chính xác, nhưng tài nguyên hình ảnh phụ thuộc vào mật độ của bạn sẽ không hiển thị như dự kiến.

    Tất nhiên, không có gì bạn làm sẽ tái tạo chất lượng hình ảnh mật độ cao hơn trên màn hình máy tính để bàn có mật độ thấp hơn.

Đây là Dữ liệu được thu thập trong khoảng thời gian 7 ngày kết thúc vào ngày 1 tháng 10 năm 2012. Để xem thống kê mới nhất về phiên bản nền tảng Android, hãy truy cập vào đây

Dựa trên kích thước màn hình

nhập mô tả hình ảnh ở đây

Dựa trên mật độ màn hình

nhập mô tả hình ảnh ở đây


2
Đối với Samsung Galaxy Tab 7" chúng ta phải giữ hình ảnh dưới drawable-hdpi lớn khác hình ảnh sẽ bị kéo căng hoặc co.
rajpara

@rajpara có rất nhiều kết hợp và hoán vị, chúng tôi sẽ bao gồm tất cả các trường hợp như vậy sau này.
Mohammed Azharuddin Shaikh

1
see @AlexBonel, ya Tôi đồng ý với bạn, nhưng phương châm chính của tôi là nhận thức được mọi thứ có thể được thực hiện như thế nào khi hỗ trợ Đa màn hình. Người ta có thể sửa đổi / thao tác luồng / khái niệm này vì phần trên là để làm rõ vấn đề ban đầu. Ngoài ra, tôi cũng sửa đổi dựa trên thiết kế ứng dụng. Bài đăng của bạn cho tôi cảm giác rằng bạn đã hiểu khái niệm này. Hy vọng bạn hiểu quan điểm của tôi.
Mohammed Azharuddin Shaikh

1
Câu trả lời hay đấy. Sau khi tìm kiếm rất nhiều và rất nhiều ngày tại sao trường hợp ngoại lệ này xảy ra, tôi đã nhận được bài đăng này là câu trả lời hay nhất với ví dụ và giải thích tuyệt vời. ví dụ: Hãy xem xét máy tính bảng Halo Value 7 inch. PPI = 133. Độ phân giải = 480 * 800. Kích thước = 7 'Inch. Nếu chúng ta coi mdpi là cơ sở, nó phải lấy thứ nguyên được xác định trong giá trị-sw480 nhưng nó đang lấy thứ nguyên từ giá trị-sw600. Tôi không hiểu tại sao điều này lại xảy ra. Thực sự cảm ơn bạn rất nhiều cho bài viết của bạn. Tiết kiệm thời gian và xóa nhầm lẫn. Tôi nghĩ điều này nên có trên trang web chính thức của Android. Đánh giá cao nỗ lực của bạn.
Smeet

1
Tôi nghĩ đây là câu trả lời hay nhất mà tôi từng thấy. Tôi đang tìm kiếm câu trả lời như vậy từ lâu. Và cuối cùng tôi đã nhận được nó. Cảm ơn mọi người đã đóng góp cho câu trả lời này để làm cho nó dễ hiểu hơn.
Hiren Dixit

1

Các nhà thiết kế nên tạo ra các thiết kế cơ sở của

base size of mdpi devices * density conversion factor of highest supported density bucket
Kích thước màn hình cơ sở là 320 X 480 px và giới hạn mật độ như sau:

  • ldpi: 0,75
  • mdpi: 1,0 (mật độ cơ bản)
  • hdpi: 1,5
  • xhdpi: 2.0
  • xxhdpi: 3.0
  • xxxhdpi: 4.0

Và để giải quyết thêm dung lượng trống trên thiết bị Android nên sử dụng các thành phần có thể co giãn theo cả hai hướng (ngang và dọc). Thông tin chi tiết có tại đây:

http://vinsol.com/blog/2014/11/20/tips-for-designers-from-a-developer/

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.