legend and fieldset in android

Dahevos picture Dahevos · Aug 28, 2012 · Viewed 10.4k times · Source

I want to know if it's possible in android to do a form like that :

enter image description here

At this moment, I made a shape to produce the border (I use this shape as a background of my linearlayout, but i don't know how to deal with the text).

Thanks in advance.

Answer

Aleks G picture Aleks G · Aug 28, 2012

I have managed to get a frame with title using the following technique.

  1. Use FrameLayout for the overall layout.

  2. Inside add another layout for your main content - this can be anything. For the background of this layout, use a custom XML drawable with stroke to draw the frame. Make sure to add margins in this layout, especially marginTop, as you need some room to display the title of the frame. Also add some padding to make it look nicer.

  3. Use TextView with opaque background and some paddings as the title. Set marginLeft on it to a reasonable value to offset the title from the left.

Here's my XML for this:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:background="@android:color/white">

    <!--  This is the main content -->
    <RelativeLayout
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_margin="15dp" android:background="@drawable/frame"
        android:orientation="vertical" android:padding="20dp">

        <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:text="Main Content" android:layout_centerInParent="true" />

    </RelativeLayout>

    <!--  This is the title label -->
    <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:background="@android:color/white" android:padding="5dp"
        android:text="Testing"
        android:layout_marginLeft="30dp" android:textColor="@android:color/black" />

</RelativeLayout>

When executed, I get this on the app:

enter image description here

Feel free to tweak the margins/paddings to align the title the way you need.