CODEWITHSUNDEEP
androidandroid-layoutandroid-intentandroid-widget
String
String

Reputation: 3728

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

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,

enter image description here

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

Could any one help?

Upvotes: 5

Views: 6197

Answers (5)

R KiranKumar
R KiranKumar

Reputation: 835

once Try this:

<TableRow
        android:id="@+id/tableRow1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <SeekBar
            android:id="@+id/seekBar1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight=".8" />

        <Button
            android:id="@+id/play"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight=".2"
           />
    </TableRow>

Main Activity 

private boolean playing = false;
    Button play;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        play=(Button) findViewById(R.id.play);
        play.setBackgroundResource(R.drawable.pause);

        play.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View arg0) {
                // TODO Auto-generated method stub
                if(playing){
                    playing = false;
                    play.setBackgroundResource(R.drawable.pause);
                }
                else {
                    playing = true;
                    play.setBackgroundResource(R.drawable.play);
                }
            }
        });

    }

Upvotes: 1

Homam
Homam

Reputation: 5076

You don't need to create two buttons for it. You can do it with single. I have created a sample program. I find this to be a cleaner approach.

Layout for MainActivity

<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:gravity="center">

    <Button
        android:id="@+id/buttonPlayPause"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</LinearLayout>

Here is MainActivity

package in.live.homam.imagebuttonexample;

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;

public class MainActivity extends Activity {

    private Button buttonPlayPause;

    private static final int resourceIdPlay = R.drawable.play;
    private static final int resourceIdPause = R.drawable.pause;
    private int resourceIdButton = resourceIdPlay;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        buttonPlayPause = (Button) findViewById(R.id.buttonPlayPause);
        buttonPlayPause.setBackgroundResource(resourceIdButton);
        buttonPlayPause.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                if(resourceIdButton == resourceIdPlay) {
                    resourceIdButton = resourceIdPause;
                    Log.d("Tag", "Playing");
                }
                else {
                    resourceIdButton = resourceIdPlay;
                    Log.d("Tag", "Paused");
                }
                buttonPlayPause.setBackgroundResource(resourceIdButton);

            }
        });
    }

}

Upvotes: 0

Passionate Androiden
Passionate Androiden

Reputation: 732

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>

Upvotes: 1

Shadow
Shadow

Reputation: 6899

Why can't you try merge?

Have a glance of this.

http://android-developers.blogspot.in/2009/03/android-layout-tricks-3-optimize-by.html

Upvotes: 0

Renjith
Renjith

Reputation: 5803

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

Upvotes: 8

Related Questions