If you have a layout that you want to appear on a number of screens, you can create it once and re-use it for each screen.
It’s easy to include layouts in other layouts:
- Simply create the layout file that you want to re-use
- Then in the layout where you want your included layout to appear, add it using the <include> tag
Here’s an example of an activity layout which includes another layout:
The text, image and blue background are defined in an XML layout file, include_me.xml which we include in this activity’s layout. The button is defined in the activity’s layout
This is what the XML code for the include_me.xml layout file looks like; it’s a normal layout file
This is what the include_me.xml layout looks like on a screen
We simply use the above code to include the include_me.xml layout in another layout
You can change the look of the included layout by overriding any of the layout parameters. Here’s an example:
This is what it looks like after we’ve included it and changed the layout attributes
This is the code for including the layout and changing its layout attributes
Don’t repeat yourself, use the <merge> tag
Using merge reduces the number of views in your layouts when you include other layouts.
Here’s an example.
Let’s say that you have a layout, call it main_layout, with a LinearLayout as its root view. You also have a layout, include_layout that you want to include in the main_layout. It also has a LinearLayout as its root view.
Now when you include it, there will be two LinearLayouts in the main-layout. The second LinearLayout doesn’t serve any purpose as the main_layout’s LinearLayout takes care of arranging the views. The extra LinearLayout only slows the app up and wastes scarce resources.
Using <merge> as the root view of your included file solves the problem.
When the included file is inflated in the main_layout, the merge tag is ignored and the views are inserted in the main_layout as if they were part of that layout.
The main_layout’s LinearLayout places them in the correct position on the screen.
Here’s an example of a <merge> layout:
Our merge_me.xml layout that we want to reuse has a <merge> element as its root view. The <merge> tag is ignored when the layout is included in another layout
This is what the views would look like:
The views are all on top of each other as the <merge> element does not supply a visual structure
This is what the included file would look like when included in another layout which has a vertical LinearLayout as the root view:
The included merge layout’s views are structured by the parent layout’s LinearLayout
This is the end result of including the two layouts:
This activity’s layout includes the include_me (top) and the merge_me (bottom) layouts
I hope that you have found this tutorial helpful.