Change layout defined in activity to xml layout

Question

I am attempting to use some of Google's code from their audio capture sample code . They simplified the heck out of their code and made their layout within the class. I want to have an actual xml layout. I know how to do that part, but I would like to know how to change the code below to an onClick method and have all the functionality that is provided with it.

class PlayButton extends Button {      
    boolean mStartPlaying = true;   
    OnClickListener clicker = new OnClickListener() {  
        public void onClick(View v) {          
            onPlay(mStartPlaying);            
            if (mStartPlaying) {              
                setText("Stop playing");        
            } else {              
                setText("Start playing");     
            }          
            mStartPlaying = !mStartPlaying;      
        }      
    };      

    public PlayButton(Context ctx) {   
        super(ctx);           
        setText("Start playing");      
        setOnClickListener(clicker);    
    }   
}

Any help is appreciated.

Answer 1

In the layout file, you'll have something like...

<LinearLayout>
   <Button android:id="play_button"/>
</LinearLayout>

In the activity, onCreate(), you can then do something like..

OnClickListener clicker = new OnClickListener() {  
    public void onClick(View v) {          
        onPlay(mStartPlaying);            
        if (mStartPlaying) {              
            setText("Stop playing");        
        } else {              
            setText("Start playing");     
        }          
        mStartPlaying = !mStartPlaying;      
    }      
};      
Button b = findViewById(R.id.play_button);
b.setOnClickListener(clicker);

ALTERNATELY, you can also define the method in the xml layout that will be called in the Activity ...

<LinearLayout>
   <Button android:id="play_button" onclick="play"/>
</LinearLayout>

and then in the Activity you simply create a method, called play(View view)

public void play(View view) {
            onPlay(mStartPlaying);            
            if (mStartPlaying) {              
                setText("Stop playing");        
            } else {              
                setText("Start playing");     
            }          
            mStartPlaying = !mStartPlaying;      
}

Answer 2

Just define the buttons as Button and declare the booleans as Activity variables. Example...

public class AudioRecordTest extends Activity {
    ...
    private Button mPlayButton = null;
    private boolean mStartPlaying = true;
    // Do the same for mRecordButton and mStartRecording
    ...

    @Override
    public void onCreate(Bundle icicle) {
        super.onCreate(icicle);
        setContentView(R.layout.main);

        // The next line assumes the play button has the id "@+id/play_button"
        mPlayButton = (Button)findViewById(R.id.play_button);
        mPlayButton.setOnClickListener(new OnClickListener() {
            public void onClick(View v) {
                onPlay(mStartPlaying);            
                if (mStartPlaying) {
                    ((Button)v).setText("Stop playing");
                } else {
                    ((Button)v).setText("Start playing");
                }
                mStartPlaying = !mStartPlaying;
            }
        });

        // Do the same for the mRecordButton
    }
}

Answer 3

Extending button just to set an onClickListener is not a good idea. You should only extend something when you are going to add new functionality to it. Not when you are going to use it for a particular purpose that does not require additional functionality.

Button button = new Button(this);
button.setOnClickListener(...);

If you need to use XML, you can load it programmatically with a LayoutInflater.

Your boolean isPlaying is not a property of the button itself but of the media it is playing. You should not hide it inside the button.