Monday, December 29, 2008

Simple TableLayout in Android

First of our Containers Example on android is TableLayout, coming from Web development background, TableLayout is probably the easiest to understand. TableLayout in android is the same as table tag on HTML. Here is an example of it:

HTML:
<body>
<table>
    <tr>
        <td><input type="button" value="Record"></td>
        <td><input type="button" value="Play"></td>
        <td><input type="button" value="Stop"></td>
    </tr>
    <tr>
        <td><input type="button" value="Pause"></td>
        <td><input type="button" value="Forward"></td>
        <td><input type="button" value="Rewind"></td>
    </tr>
</table>
</body>


Android:
<xml version="1.0" encoding="utf-8"?>
<TableLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
>
    <TableRow>
        <Button android:id="@+id/RecordBtn"
            android:text="Record" />
        <Button android:id="@+id/PlayBtn"
            android:text="Play" />
        <Button android:id="@+id/StopBtn"
            android:text="Stop" />
    </TableRow>
    <TableRow>
        <Button android:id="@+id/PauseBtn" 
            android:text="Pause" />
        <Button android:id="@+id/Forward"
            android:text="Forward" />
        <Button android:id="@+id/Rewind" 
            android:text="Rewind" />
    </TableRow>
</TableLayout>

Explanation:
If you know html then by now you know that there is no td and instead we use one of the the views/components in android.
This the most basic example of tableLayout, in the future post we shall tackle on some of its properties.


Hope it helps :)

Update History
   Jan 17, 2012 - Visual Update
Post a Comment