How to place 2 buttons at the same position in my layout

Question

I have My Table row like below in my xml layout:

<TableRow 
          android:layout_marginTop="10dp"
            >

            <SeekBar
                android:id="@+id/seekBar1"
                android:layout_width="256dp"
                android:layout_height="wrap_content"
                android:layout_alignLeft="@+id/titlename"
                android:layout_="@+id/playbtn"
                android:layout_marginTop="4dp"
               />
             <Button
            android:id="@+id/playbtn"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_alignParentBottom="true"
            android:background="@drawable/play"
            android:layout_marginBottom="3dp"/>

        <Button
            android:id="@+id/pausebtn"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_toTopOf="@+id/playbtn"
            android:layout_alignParentBottom="true"
            android:background="@drawable/pause"
            android:layout_marginBottom="3dp"/>
        </TableRow>

and my output is as below,

my requirement is to show play pause buttons at the same position in my layout?

Could any one help?

Answer 1

Use FrameLayout and put one button over another

Like this

<FrameLayout ... >
      <Button
            android:id="@+id/playbtn"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:background="@drawable/play"/>

        <Button
            android:id="@+id/pausebtn"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:background="@drawable/pause"/>

</FrameLayout>

This will put Pause button over Play Button. Make the necessary button visible and invisible according to your need

Answer 2

Try using this layout. Use combination of LinearLayout and FrameLayout to achieve the desired result.

<TableRow 
      android:layout_marginTop="10dp">
<LinearLayout 
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="horizontal">
        <SeekBar
            android:id="@+id/seekBar1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:weight="1"
            android:layout_alignLeft="@+id/titlename"
            android:layout_="@+id/playbtn"
            android:layout_marginTop="4dp"
           />

 <FrameLayout 
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" >
    <Button
        android:id="@+id/playbtn"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:background="@drawable/play"/>
    <Button
        android:id="@+id/pausebtn"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:background="@drawable/pause"/>

  </FrameLayout>
</LinearLayout>
</TableRow>