Now.Zero
Now.Zero

Reputation: 1389

How to make and use an modulized xml file of LinearLayout

I want to make a modulized LinearLayout Xml file, so that I can use it in serveral fragment.

To do this, what should I do?

Upvotes: 0

Views: 27

Answers (1)

Boken
Boken

Reputation: 5446

You have to use include tag. Let's create 2 files in layout directory

FIRST

res > layout > first_element.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <View
        android:layout_width="50dp"
        android:layout_height="30dp"
        android:layout_margin="20dp"
        android:background="@color/colorPrimary" />

    <View
        android:layout_width="50dp"
        android:layout_height="30dp"
        android:layout_margin="20dp"
        android:background="@color/colorPrimary" />

    <View
        android:layout_width="50dp"
        android:layout_height="30dp"
        android:layout_margin="20dp"
        android:background="@color/colorPrimary" />

</LinearLayout>

enter image description here

SECOND

res > layout > second_element.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:textSize="30sp"
        android:text="FIRST"
        android:textColor="@color/colorAccent" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:textSize="30sp"
        android:text="SECOND"
        android:textColor="@color/colorAccent" />

</LinearLayout>

enter image description here

And after that you can reuse them in third layout file using include tag:

THIRD

res > layout > main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <include layout="@layout/first_element"/>

    <include layout="@layout/second_element"/>

</LinearLayout>

And you can expect output: enter image description here

Upvotes: 1

Related Questions