How to Support different screen sizes in Android
Android devices come in all shapes and sizes, so your app’s layout needs to be flexible. By supporting as many screens as possible, your app can be made available to the greatest number of users with different devices, using a single APK And for this you have to provide support all screen sizes of the phone.
This article is based on the problem we face in user on-boarding flow, we had to keep one background image and adjust different layouts on it. i.e Layout should be according to the flow of app itself so we need to adjust views.
At first we tried all possible ways to adjust layout using attributes given by Android Os.We tried different thing’s like giving constant height, width which will suit to device. After testing, We face problem like it was working on 2–3 devices but not all ex. Pixel..
One Common issue - Improper Alignment on other high resolution device’s .
We explorer through multiple stack-overflow questions and blog’s using my googling skill’s, trial and error you know 💻 but nothing help’s as much.😑
Chetan Bhalerao sir suggested me one idea of using “ViewTreeObserver with Dynamic Aspect ratio” while giving margin to the layout to adjust it with background image.
Another hope..! towards solving problem quickly I searched What is Aspect ratio? and How to use it? I found this formula to calculate Aspect Ratio ..
ARG_ASPECT_RATIO = Layout margin from top / Screen height
Example of Calculating Layout margin from top / Screen height :-
lets say we assume layout margin from top is 105 pt and screen height is 603ptso according to formula our Aspect Ratio (AR) is 105 / 603 = 0.1741293532
So after Calculating Aspect ratio you need to pass it to ViewTreeObservers View.getViewTreeObserver() method. and it will help you to calculating screens width and height dynamically on each device and set layout perfectly.
What is ViewTreeObserver?
A view tree observer is used to register listeners that can be notified of global changes in the view tree. Such global events include, but are not limited to, layout of the whole tree, beginning of the drawing pass, touch mode change.
This is my code snippet where I have added Aspect ratio :-
final RelativeLayout relativeLayoutSameDay = rootView.findViewById(R.id.same_day_selection_fragment);ViewTreeObserver viewTreeObserver = relativeLayoutSameDay.getViewTreeObserver();
viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
relativeLayoutSameDay.getViewTreeObserver().removeOnGlobalLayoutListener(this);
int height = relativeLayoutSameDay.getMeasuredHeight();
RelativeLayout.LayoutParams head_params = (RelativeLayout.LayoutParams) actionButtons.getLayoutParams();
head_params.setMargins(0, 0, 0, (int) (height * ARG_ASPECT_RATIO));
actionButtons.setLayoutParams(head_params);
}
});
And all set..! 💃 This code was taking take care of all dimensions on each device :)
