In previous article we discuss about installation of json2view library and how to change properties of Android ui dynamically but today we discuss about how to change Android layout dynamically with help of json2view library.
You can check installation and implementation of json2view Android library.
Let come with example of json2view Android library and in this tutorial we studying how to dynamically change Android layout using json2view library.
Xml 2 JSON Examples
Using json2view to reorganize the layout of a screen
before
<?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">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:minWidth="250dp"
android:text="menu 01" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:minWidth="250dp"
android:text="menu 02" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:minWidth="250dp"
android:text="menu 03" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:minWidth="250dp"
android:text="menu 04" />
</LinearLayout>
{
"views": [{
"views": [],
"properties": [{
"value": "wrap_content",
"type": "dimen",
"name": "layout_width"
},
{
"value": "wrap_content",
"type": "dimen",
"name": "layout_height"
},
{
"value": "center",
"type": "string",
"name": "layout_gravity"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "250dp",
"type": "dimen",
"name": "minWidth"
},
{
"value": "menu 01",
"type": "string",
"name": "text"
}],
"widget": "Button"
},
{
"views": [],
"properties": [{
"value": "wrap_content",
"type": "dimen",
"name": "layout_width"
},
{
"value": "wrap_content",
"type": "dimen",
"name": "layout_height"
},
{
"value": "center",
"type": "string",
"name": "layout_gravity"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "250dp",
"type": "dimen",
"name": "minWidth"
},
{
"value": "menu 02",
"type": "string",
"name": "text"
}],
"widget": "Button"
},
{
"views": [],
"properties": [{
"value": "wrap_content",
"type": "dimen",
"name": "layout_width"
},
{
"value": "wrap_content",
"type": "dimen",
"name": "layout_height"
},
{
"value": "center",
"type": "string",
"name": "layout_gravity"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "250dp",
"type": "dimen",
"name": "minWidth"
},
{
"value": "menu 03",
"type": "string",
"name": "text"
}],
"widget": "Button"
},
{
"views": [],
"properties": [{
"value": "wrap_content",
"type": "dimen",
"name": "layout_width"
},
{
"value": "wrap_content",
"type": "dimen",
"name": "layout_height"
},
{
"value": "center",
"type": "string",
"name": "layout_gravity"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "250dp",
"type": "dimen",
"name": "minWidth"
},
{
"value": "menu 04",
"type": "string",
"name": "text"
}],
"widget": "Button"
}],
"properties": [{
"value": "match_parent",
"type": "dimen",
"name": "layout_width"
},
{
"value": "match_parent",
"type": "dimen",
"name": "layout_height"
},
{
"value": "vertical",
"type": "string",
"name": "orientation"
}],
"widget": "LinearLayout"
}
after
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:orientation="horizontal">
<Button
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="0.5"
android:text="menu 01" />
<Button
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="0.5"
android:text="menu 02" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:orientation="horizontal">
<Button
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="0.5"
android:text="menu 03" />
<Button
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:layout_weight="0.5"
android:text="menu 04" />
</LinearLayout>
</LinearLayout>
{
"views": [{
"views": [{
"views": [],
"properties": [{
"value": "0dp",
"type": "dimen",
"name": "layout_width"
},
{
"value": "match_parent",
"type": "dimen",
"name": "layout_height"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "0.5",
"type": "float",
"name": "layout_weight"
},
{
"value": "menu 01",
"type": "string",
"name": "text"
}],
"widget": "Button"
},
{
"views": [],
"properties": [{
"value": "0dp",
"type": "dimen",
"name": "layout_width"
},
{
"value": "match_parent",
"type": "dimen",
"name": "layout_height"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "0.5",
"type": "float",
"name": "layout_weight"
},
{
"value": "menu 02",
"type": "string",
"name": "text"
}],
"widget": "Button"
}],
"properties": [{
"value": "match_parent",
"type": "dimen",
"name": "layout_width"
},
{
"value": "0dp",
"type": "dimen",
"name": "layout_height"
},
{
"value": "0.5",
"type": "float",
"name": "layout_weight"
},
{
"value": "horizontal",
"type": "string",
"name": "orientation"
}],
"widget": "LinearLayout"
},
{
"views": [{
"views": [],
"properties": [{
"value": "0dp",
"type": "dimen",
"name": "layout_width"
},
{
"value": "match_parent",
"type": "dimen",
"name": "layout_height"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "0.5",
"type": "float",
"name": "layout_weight"
},
{
"value": "menu 03",
"type": "string",
"name": "text"
}],
"widget": "Button"
},
{
"views": [],
"properties": [{
"value": "0dp",
"type": "dimen",
"name": "layout_width"
},
{
"value": "match_parent",
"type": "dimen",
"name": "layout_height"
},
{
"value": "10dp",
"type": "dimen",
"name": "layout_margin"
},
{
"value": "0.5",
"type": "float",
"name": "layout_weight"
},
{
"value": "menu 04",
"type": "string",
"name": "text"
}],
"widget": "Button"
}],
"properties": [{
"value": "match_parent",
"type": "dimen",
"name": "layout_width"
},
{
"value": "0dp",
"type": "dimen",
"name": "layout_height"
},
{
"value": "0.5",
"type": "float",
"name": "layout_weight"
},
{
"value": "horizontal",
"type": "string",
"name": "orientation"
}],
"widget": "LinearLayout"
}],
"properties": [{
"value": "match_parent",
"type": "dimen",
"name": "layout_width"
},
{
"value": "match_parent",
"type": "dimen",
"name": "layout_height"
},
{
"value": "vertical",
"type": "string",
"name": "orientation"
}],
"widget": "LinearLayout"
}
Next example :
Hope you like this tutorial and if you’ve any problem then comment box is for you.
Nuur Hasan
Share your thoughts