Question

I have made a custom button bar as described here.

Now, I want to add a separator between the first and the second and between the second and the third button. My button bar is defined as follows:

<LinearLayout
            android:id="@+id/buttonBar"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/buttonbarstyle"
            android:layout_alignParentBottom="true"
            android:orientation="horizontal"
            >
            <ImageButton
                android:id="@+id/buttonBarImageButton1" 
                android:scaleType="centerInside"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_weight="1"
                android:src="@drawable/copy"
                android:padding="2dip"
                android:background="@drawable/buttonbar_background_selector"
                android:layout_gravity="center_vertical"
            />              
            <ImageButton 
                android:id="@+id/buttonBarImageButton2"
                android:scaleType="centerInside"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_weight="1"
                android:src="@drawable/options"
                android:padding="2dip"
                android:background="@drawable/buttonbar_background_selector"
                android:layout_gravity="center_vertical"
            />              
            <ImageButton
                android:id="@+id/buttonBarImageButton3" 
                android:scaleType="centerInside"
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:layout_weight="1"
                android:src="@drawable/media_play"
                android:padding="2dip"
                android:background="@drawable/buttonbar_background_selector"
                android:layout_gravity="center_vertical"
            />              
        </LinearLayout>

The task seems so simple, but I can’t find a good way to do it. It’s supposed to have a grey-ish separator between each button, so that it looks somewhat like this.

I’m sure it’s easy, please just point me to the right direction.

Answer 1

Place this in between each button.

<View android:layout_height="fill_parent"
    android:layout_width="2px"
    android:background="#90909090"/>

should give you a slim greyish vertical bar.