Search code examples
androidlayoutseekbar

Android layout, how to position two images and an seekbar


What I want to achieve

I'm trying to make a layout equal to the next link: http://www.flickr.com/photos/59647462@N08/7038207573/

What I have

  <LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/minVolume"
        android:src="@drawable/ic_volume_min" />

    <SeekBar
        android:id="@+id/seekBar1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/maxVolume"
        android:src="@drawable/ic_volume_max" />
</LinearLayout>

the result I'm getting with this code that the seekbar extends over the right icon.

  • I would like to have it scaled appropriately on different screenszes
  • If its possible without using the weight attribute, i would love that solution

any advice is appreciated


Solution

  • make a relative layout and make the left image anchored to the left side (ALIGN_PARENT_LEFT), the right image anchored to the right side (ALIGN_PARENT_RIGHT) and the seekbar between them with android:layout_toRightOf and android:layout_toLeftOf.

    For more info see the docs: http://developer.android.com/reference/android/widget/RelativeLayout.html