2

I want to enclose the pair of checkboxes and the radio buttons here:

enter image description here

...in a rectangle or "bounding box" so that it look something like this:

enter image description here

...but less ugly, of course. How can I do that with the following XML as a starting point:

<LinearLayout 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"
    android:orientation="vertical"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="hhs.app.SettingsActivity">

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="5dip"
        android:text="@string/select_your_printer"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <CheckBox
        android:id="@+id/ckbxNoPrinter"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/no_printer" />

    <CheckBox
        android:id="@+id/ckbxZebraQL220"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:checked="true"
        android:text="@string/zebra_ql220" />

    <Space
        android:layout_width="match_parent"
        android:layout_height="5dp" />

    . . .

    <RadioGroup
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <RadioButton
            android:id="@+id/radbtnBar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/using_labels_black" />

        <RadioButton
            android:id="@+id/radbtnPlain"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            android:text="@string/using_plain_labels" />
    </RadioGroup>

    <Space
        android:layout_width="match_parent"
        android:layout_height="2dp" />

    . . .
    </LinearLayout>

</LinearLayout>

?

UPDATE

I tried to apply Der Golem's suggestion, like so:

<LinearLayout 
    android:orientation="vertical"
    android:layout_width="wrap_content">
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle"
        android:layout_width="wrap_content">
        <stroke
            android:width="4dp"
            android:color="#f000"
            android:layout_width="wrap_content" />
        <TextView
            android:text="@string/after_fetching_palabra"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            />
    </shape>
</LinearLayout>

...but that does nothing (good); the TextView is just in there as a test, starting with one simple widget to begin with.

NOTE: This is a LinearLayout within a LinearLayout. When I remove this, it's fine, but with it, the Layout won't even render.

UPATE 2

So I take it that I put the shape in a \res\drawable folder. But in Droidio, it gives me four, count 'em, four, drawable folders, namely:

drawable-hdpi
drawable-mdpi
drawable-xhdpi
drawable-xxhdpi

Do I need to put the xml in each of those folders, or can I create a "generic/default" plain old "drawable" folder and put it there?

B. Clay Shannon-B. Crow Raven
  • 8,547
  • 144
  • 472
  • 862

1 Answers1

3

Use a vertical LinearLayout to enclose your CheckBoxes and another one to enclose your RadioButtons and assign them an xml drawable as the background (you could alternatively use a 9 patch, if you feel more comfortable with):

The two extra LinearLayouts are children of the outer container.

/res/drawable/box.xml (self contained xml drawable):

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
    >
    <stroke
        android:width="4dp"
        android:color="#f000"
    />
</shape>

For reference: http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape

[EDIT]

Apply the xml drawable as a normal background:

This is just one of the two layous: the "CheckBox" one:

...

<LinearLayout 
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/box"
    >
     <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="5dip"
        android:text="@string/select_your_printer"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <CheckBox
        android:id="@+id/ckbxNoPrinter"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/no_printer" />

    <CheckBox
        android:id="@+id/ckbxZebraQL220"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:checked="true"
        android:text="@string/zebra_ql220" />
</LinearLayout>

...

[EDIT 2]

Now a little digression.
You asked for a simple square box and nothing else, so that's what I provided.
BUT. In the link I provided is shown in details how you can (for instance) not only make the corners round, but also give your shape a different background color or even a color gradient.
Just to name some interesting properties of the Shape Drawable.

Phantômaxx
  • 37,901
  • 21
  • 84
  • 115