So, Let’s begin.
By the definition of Constraint Layout,
” Constraint Layout is a view group that allows you to create large and complex layouts with a flat view hierarchy (no nested view groups). It’s similar to Relative Layout in that all views are laid out according to relationships between sibling views and the parent layout, but it’s more flexible than RelativeLayout and easier to use with Android Studio’s Layout Editor.”
and the definition of Relative Layout,
“Relative Layout is a view group that displays child views in relative positions. The position of each view can be specified as relative to sibling elements (such as to the left of or below another view) or in positions relative to the parent Relative Layout area (such as aligned to the bottom, left or center).”
We try to understand the differences between layouts with below diagrams :
In the diagram, Constraint layout has one layout means flat hierarchy, but Relative layout has nested layouts.
We can discuss the differences between Layouts as brief with the below points :
1. Flat View Hierarchy – No nested view groups :
Constraint Layout has flat view hierarchy unlike other layouts, so it does a better performance than Relative Layout. It is the biggest advantage of constraint Layout, the only single layout can handle your UI. Where in the Relative layout, you need multiple nested layouts means (LinearLayout+RelativeLayout).
2. GUI Builder – Drag and drop functionality
In Android Studio you can drag and drop GUI component like TextView , Button , TextInputLayout etc. So now its make life easier to developers and make they work faster UI development and more productive so they continue improving drag-drop GUI builder. However drag-and-drop gestures, the developer is only providing you with X/Y coordinates of a widget, based on where you release the mouse button and completes the drop.
With RelativeLayout is difficult for GUI builder to handle drag-drop and probably you will have to dig inside the XML code to get things done.
But in ConstraintLayout, you have an option to constraint applying by the use of blueprint and visual editor tool which makes it easy to design a page.
3. Recomputing size and position
Each changes the detail of a widget often cause the sizes to have to be recomputed.
Let’s take an example a change in EditText might starting point that a whole hierarchy to go through re-size and re-position work. If the application UI (user interface) has a container inside the container which is inside another container etc. Means that parents re-size or re-position their children and that can be very expensive (rework again on the user interface) for deep hierarchies.
So understanding the differences between the layouts, we can ask some questions related to layouts.
1. Does the ConstraintLayout have better performance than a nested Layout?
Yes,ConstraintLayout has designed with performance optimization in mind, more effective, easy use and trying to eliminate as many pass scenarios as possible. This is done by eliminating the deeply-nested view hierarchies with flat view hierarchy.
2. Can we replace RelativeLayout with ConstraintLayout completely?
Yes, you can completely replace RelativeLayout with ConstraintLayout.ConstraintLayout does all that RelativeLayout does, and more.
In this article, We understood the difference between Constraint Layout and Relative Layout in Android. In Summary :
- Constraint layout follows flat view hierarchy, but Relative layout has nested layouts.
- Constraint layout have an option to constraint applying by using blueprint and visual editor tool to design a page easily, but Relative layout is difficult for GUI builder to handle drag-drop and look up XML code to get things done.
- Constraint layout uses flat view hierarchy so parent re-size or re-position their children can do easily, but Relative Layout can difficult and very expensive (rework again on the UI) for deep hierarchies.