Introduction
Compatibility with various screen sizes and resolutions is an essential element in Android app development. As various mobile devices are released in the market, it has become important to ensure that the same app can be effectively used across different screen sizes. In this post, we will explore in-depth how to build such compatibility using Java.
1. Classification of Android Screen Sizes
Android provides the following classifications based on screen size.
- Small: 3″ display (e.g., old phones)
- Normal: 4″~5″ display (e.g., mid-sized smartphones)
- Large: 7″~10″ display (e.g., tablets)
- Xlarge: 10″ and above display (e.g., large tablets)
1.1 Screen Density
Android must consider the density of the user’s screen by default. Screen density is expressed in ‘dpi’ (dots per inch), with various densities existing as follows.
- ldpi (low) – 120dpi
- mdpi (medium) – 160dpi, the baseline density
- hdpi (high) – 240dpi
- xhdpi (extra-high) – 320dpi
- xxhdpi (extra-extra-high) – 480dpi
- xxxhdpi (extra-extra-extra-high) – 640dpi
2. Layout Design Principles
To create a compatible app, it is necessary to design a layout that can accommodate various screen sizes and densities. Here are some essential principles.
2.1 Use of Inclusive Layouts
Android uses flexible layouts such as ConstraintLayout
to support various screen sizes. This layout allows views to reference each other’s positions through constraints.
2.2 Use of dp and sp
When setting the size of views and text, it is recommended to use dp
(density-independent pixels) and sp
(scale-independent pixels). These two units automatically adjust according to screen density. For instance, when setting textSize, sp
should be used to allow size adjustments based on user preferences.
2.3 Use of Various Layout Resources
In Android, different layouts according to screen size and density can be defined separately through resource directories. For example, layouts can be separated into layout-mdpi
, layout-hdpi
, layout-xhdpi
, etc., to set different layouts.
3. Code Example
Below is example code for a simple Android app designed to adapt to various screen sizes.
3.1 MainActivity.java
package com.example.compatibility;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
3.2 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, Android!"
android:textSize="18sp"
android:layout_centerInParent="true"/>
</RelativeLayout>
3.3 Layout Example for Different Screen Sizes
The following is a layout example with a “More” button that changes based on different screen sizes. Here, the position of the button is adjusted according to the screen size.
layout-small/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="More"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
layout-normal/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="More"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
layout-large/activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="More"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:padding="16dp"/>
</RelativeLayout>
4. Conclusion
In this post, we have examined how to ensure compatibility for Android app development using Java to cater to various screen sizes and resolutions. We hope that applying various techniques and principles to enhance app compatibility will help in developing apps that provide the best user experience.