It appears that Android doesn't offer such a useful widget. However, my screen design requires a view like this:
Also, the interaction design requires that such boxes are displayed and hidden, depending on other data.
Of course, I could construct such box from separate elements in my XML layout (e.g. from a shape and a textview over it), but then managing their visibility turns into hell...
So it's clear that what is needed here is a container, like a relative layout. Such container can have children in XML layout and can be shown and hidden with a simple setVisibility(...) call.
Can someone give me a tip how to do that, please?
I don't think there is one, but I hacked together soemthing manual...not the same I know, but thought I'd share "@drawable/divider" is a 2 pixel square grey image. Creates the illusiuon of a box around the controls.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ScrollView android:id="@+id/ScrollView01" android:layout_height="fill_parent" android:layout_width="fill_parent">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_height="wrap_content" android:layout_width="fill_parent" android:id="@+id/linLayout02">
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"/>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/tableRow1" android:visibility="gone">
<TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/image_folder" android:minWidth="100px" android:visibility="gone"></TextView>
<EditText android:text="..." android:layout_height="wrap_content" android:layout_weight="1" android:layout_width="fill_parent" android:id="@+id/txtImageFolder" android:enabled="false" android:visibility="gone"></EditText>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/tableRow2">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<CheckBox android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/cbDisplayText" android:text="@string/text_below_images"></CheckBox>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/tableRow3" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:id="@+id/tvLocale" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/locale" android:minWidth="100px"></TextView>
<Spinner android:id="@+id/cboLocales" android:layout_width="wrap_content" android:layout_height="wrap_content" android:minWidth="100px"></Spinner>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/tableRow3_1" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:id="@+id/tvPitch" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/pitch" android:minWidth="100px"></TextView>
<SeekBar android:minWidth="100px" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/barPitch" android:max="200" ></SeekBar>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:id="@+id/tableRow3_2" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:id="@+id/tvLocale" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/speed" android:minWidth="100px"></TextView>
<SeekBar android:minWidth="100px" android:layout_width="wrap_content" android:id="@+id/barSpeed" android:layout_height="wrap_content" android:max="200"></SeekBar>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:id="@+id/tableRow4" android:layout_height="wrap_content" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<Button android:minWidth="100px" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/btnSave" android:text="@string/save"></Button>
<Button android:minWidth="100px" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/btnCancel" android:text="@string/cancel"></Button>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingBottom="2dp"
android:paddingTop="2dp" />
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:paddingTop="2px">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingBottom="2dp"
android:paddingTop="2dp" />
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:text="@string/download_msg" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:text="Step 1: Download and Install eSpeak:" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
<Button android:minWidth="80px" android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/btneSpeak" android:text="@string/eSpeak"></Button>
<ProgressBar android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/barESpeak" android:visibility="gone"></ProgressBar>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:text="Step 2: Download and Install Languages:" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
<Button android:minWidth="80px" android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/btnLanguages" android:text="@string/languages"></Button>
<ProgressBar android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/barLanguages" android:visibility="gone"></ProgressBar>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:text="Step 3: Reboot the device:" android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
<Button android:minWidth="80px" android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/btnReboot" android:text="Reboot"></Button>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="left">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
<TextView android:text="Note: If Text to speech still fails repeat Step 2 and reboot again." android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:layout_width="fill_parent" android:gravity="right">
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:scaleType="fitXY"/>
</LinearLayout>
</LinearLayout>
</TableRow>
<TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" >
<ImageView
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@drawable/divider"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingBottom="2dp"
android:paddingTop="2dp" />
</TableRow>
</LinearLayout>
</ScrollView>
</LinearLayout>
Keep this in your Drawable file name "selector_fieldset_background.xml"
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#FFFFFF" />
<stroke
android:width="1dip"
android:color="#4fa5d5" />
</shape>
And this in you layout:
<RelativeLayout 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="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="13dp"
android:background="@drawable/selector_fieldset_background"
android:orientation="vertical" >
</LinearLayout>
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:background="@color/white"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:text="Order Information"
android:textAppearance="?android:attr/textAppearanceLarge"/>
</RelativeLayout>
This will create a Group box Component as shown in your image.
来源：https://stackoverflow.com/questions/3977566/android-how-to-make-a-groupbox-widget