Implementing Android Table Layout To Format App Contents Efficiently

Table Layout in Android

Do you remember using <table> tag while creating HTML webpages? Well, the concept of Android Table Layout works similar to the HTML tables. The table layout android is an extension of Linear Layout. And as the name suggests, the Android tablelayout is used to format app elements in columns and rows.

Android Table Layout Example

In today’s Android tableview app tutorial, we’ll be creating a table layout android to display the android versions. Each row in this table will have 3 cells containing the version code, version name, and the API level.

Let’s Get Started

Create a new project under the file menu and modify the project details.

Table Layout in Android

Select Mini SDK Version in the next tab.

Android Table Layout Example

Next, Add an Empty activity.

Table Layout in Android

Lastly, Customize your activity and click on finish.

Android Table Layout Demo

Start Code Integration

MainActivity

public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}

Activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.tablelayoutdemo.MainActivity">
<TableRow
android:background="@color/colorAccent"
android:padding="@dimen/dimen_8dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Version"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Version Name"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="API Level"
android:textColor="@android:color/white" />
</TableRow>
<TableRow
android:background="@color/colorPrimaryDark"
android:padding="@dimen/dimen_8dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="7.0"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Nougat"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="24"
android:textColor="@android:color/white" />
</TableRow>
<TableRow
android:background="@color/colorPrimaryDark"
android:padding="@dimen/dimen_8dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="6.0"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Marshmallow"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="23"
android:textColor="@android:color/white" />
</TableRow>
<TableRow
android:background="@color/colorPrimaryDark"
android:padding="@dimen/dimen_8dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="5.0"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Android Lollipop"
android:textColor="@android:color/white" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="21"
android:textColor="@android:color/white" />
</TableRow>
</TableLayout>

Dimens.xml

<resources>
<!-- Default screen margins, per the Android Design guidelines. -->
<dimen name="dimen_8dp">8dp</dimen>
</resources>

And Done!

Simple as that! Now when you run the demo, it will give you output like this:

Android Table Layout Tutorial

While developing your Android app, or hiring Android app development company for your project, do remember to add tablelayout Android example in the design plan. Not only it will enhance the app user interface, but it will also contribute to clean content management of your Android app.

In case, if you still have any query or confusion regarding Indian app developers cost, how to make money with an app idea, iPad application development or app development, then you can get in touch with us through our contact us form. One of our sales representatives will revert to you as soon as possible. The consultation is absolutely free of cost.

Grab a free copy of Table Layout example demo from Github.

Also Read:

This page was last edited on May 25th, 2020, at 5:53.

Author Bio

Amit Patolia

Amit Patolia

Designation: Android Team Lead

Amit Patolia is an Android Team Lead at Space-O Technologies. He has over 7 years of experience in Android app development. He has guided to develop over 100 Android apps with unique features and functionalities. He also has expertise in Kotlin-based apps.

 
 

Want to Develop Android App From Scratch? Contact Us Now

Get your free consultation now

Leave a Reply

Your email address will not be published. Required fields are marked *

Get Your Free Quote