Edited Question:
Mobile Resolution:
I would like to design different screen dpi like following resolutions.
320x480,
480×800,
540x960,
720x1280 (Samsung S3),
1080x1920 (S4, Nexus5,Nexus 5x, Moto G4),
2560 x 1440 (Nexus 6, Nexus 6p, Samsung edge)
Tablet Resolution:
480x800 (micromax) ,
600x1024 (samsung tab2),
800x1280 (nexus 7),
1200x1920 (new nexus 7),
2048x1536 (nexus 9)
I want to use different font sizes depending on the device display resolution.
Q1) What is the best
way to solve this problem
?
Q2) What is best option doing throw coding or XML?
Q3) Which drawable folder is represent which device resolution?
Q4) Application Launcher icon size for different resolution?
res/sw600dp/layout. xml -> will be used for all screen sizes bigger or equal to 600dp. This does not take the device orientation into account. 2) Available Screen Width - Specifies a minimum available width in dp units at which the resources should be used.
These screen resolutions are also defined as numbers- HD is denoted as 720p, Full HD is known as 1080p, and QHD is referred to as 2000 pixels or 2K. This resolution certainly does contribute to better detailing, and the difference can be seen in the quality of the image as opposed to Full HD.
36x36 (0.75x) for low-density (ldpi) 48x48 (1.0x baseline) for medium-density (mdpi) 72x72 (1.5x) for high-density (hdpi) 96x96 (2.0x) for extra-high-density (xhdpi)
App launcher icon size in pixels for different resolution
Mobile Resolution
Use following folders if you wish to have tablet-specific layouts:
layout-large-mdpi (1024x600) layout-large-tvdpi (800x1280) layout-large-xhdpi (1200x1920) layout-xlarge-mdpi (1280x800) layout-xlarge-xhdpi (2560x1600)
Mobile
res/drawable (default) res/drawable-ldpi/ (240x320 and nearer resolution) res/drawable-mdpi/ (320x480 and nearer resolution) res/drawable-hdpi/ (480x800, 540x960 and nearer resolution) res/drawable-xhdpi/ (720x1280 - Samsung S3, Micromax Canvas HD etc) res/drawable-xxhdpi/ (1080x1920 - Samsung S4, HTC one, Nexus 5, etc) res/drawable-xxxhdpi/ (1440X2560 - Nexus 6,Samsung S6edge).
Tablet Resolution:
NOTE: Always try to use SP whenever you deal with
textSize
, liketextsize=12sp
Use predefined textAppearance
:
It will set text size automatically as per device density.
<TextView android:textAppearance="?android:attr/textAppearanceSmall"/> <TextView android:textAppearance="?android:attr/textAppearanceMedium"/> <TextView android:textAppearance="?android:attr/textAppearanceLarge" />
Sample usage:
<TextView style="@android:style/TextAppearance.Small" android:text="Sample Text - Small" /> <TextView style="@android:style/TextAppearance.Medium" android:text="Sample Text - Medium" /> <TextView style="@android:style/TextAppearance.Large" android:text="Sample Text - Large" />
Use dimension.xml
for each device:
From Google IO Pdf, we see structure below:
Mobile:
res/values/dimens.xml(default) res/values-ldpi/dimens.xml (240x320 and nearer resolution) res/values-mdpi/dimens.xml (320x480 and nearer resolution) res/values-hdpi/dimens.xml (480x800, 540x960 and nearer resolution) res/values-xhdpi/dimens.xml (720x1280 - Samsung S3, Micromax Canvas HD, etc) res/values-xxhdpi/dimens.xml (1080x1920 - Samsung S4, HTC one, etc)
res/values-xxxhdpi/dimens.xml (1440X2560 - Nexus 6,Samsung S6edge).
Tablet:
For tablet you can use more specific folder like values-xlarge
, values-large
.
res/values-large/dimens.xml (480x800) res/values-large-mdpi/dimens.xml (600x1024)
or
res/values-sw600dp/dimens.xml (600x1024) res/values-sw720dp/dimens.xml (800x1280) res/values-xlarge-xhdpi/dimens.xml (2560x1600 - Nexus 10") res/values-large-xhdpi/dimens.xml (1200x1920 - Nexus 7"(latest))
For further information:
Refer to Supporting Multiple Screens.
See Page# 77 of Google IO Pdf for Design device density. In that, you will find the way to handle
dimens.xml
for different different devices.- Getting Your Apps Ready for Nexus 6 and Nexus 9.
The density-independent pixel is equivalent to one physical pixel on a 160 dpi screen, which is the baseline density assumed by the system for a "medium" density screen. At runtime, the system transparently handles any scaling of the dp units, as necessary, based on the actual density of the screen in use. The conversion of dp units to screen pixels is simple:
px = dp * (dpi / 160)
. For example, on a 240 dpi screen, 1 dp equals 1.5 physical pixels. You should always use dp units when defining your application's UI, to ensure proper display of your UI on screens with different densities.
First you create the different values folders for different screens.and put the size according to the screens in res->values->dimens.xml
file and call the simple font size using "@dimen/text_size"
.
res/values/dimens.xml res/values-small/dimens.xml res/values-normal/dimens.xml res/values-xlarge/dimens.xml //for small <?xml version="1.0" encoding="utf-8"?> <resources> <dimen name="text_size">15sp</dimen> </resources> //for normal <?xml version="1.0" encoding="utf-8"?> <resources> <dimen name="text_size">20sp</dimen> </resources> //for large <?xml version="1.0" encoding="utf-8"?> <resources> <dimen name="text_size">30sp</dimen> </resources> //for xlarge <?xml version="1.0" encoding="utf-8"?> <resources> <dimen name="text_size">40sp</dimen> </resources>
and retrieve the font size in TextView
as given below.
<TextView android:id="@+id/lblHeader" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="@dimen/text_size" android:textStyle="bold" android:typeface="serif" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With