Step 03 - Donate Button

Place a button directly on to the activity - attached to the bottom of the screen as shown:

Rename the button in the Outline view:

Fix the lint error - and give the button the text ‘Donate!’. If all goes as expected, your xml files should be like this:

activity_donate.xml

1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:paddingBottom="@dimen/activity_vertical_margin"
6. android:paddingLeft="@dimen/activity_horizontal_margin"
7. android:paddingRight="@dimen/activity_horizontal_margin"
8. android:paddingTop="@dimen/activity_vertical_margin"
9. tools:context=".Donate" >

11. <TextView
12. android:id="@+id/donateTitle"
13. android:layout_width="wrap_content"
14. android:layout_height="wrap_content"
15. android:layout_alignParentLeft="true"
16. android:layout_alignParentRight="true"
17. android:layout_alignParentTop="true"
18. android:text="@string/donateTitle"
19. android:textAppearance="?android:attr/textAppearanceLarge" />

21. <TextView
22. android:id="@+id/donateSubtitle"
23. android:layout_width="wrap_content"
24. android:layout_height="wrap_content"
25. android:layout_alignParentLeft="true"
26. android:layout_alignParentRight="true"
27. android:layout_below="@+id/donateTitle"
28. android:text="@string/donateSubtitle"
29. android:textAppearance="?android:attr/textAppearanceMedium" />

31. <Button
32. android:id="@+id/donateButton"
33. android:layout_width="wrap_content"
34. android:layout_height="wrap_content"
35. android:layout_alignParentBottom="true"
36. android:layout_centerHorizontal="true"
37. android:text="@string/donateButton" />

39. </RelativeLayout>

strings.xml

1. <?xml version="1.0" encoding="utf-8"?>
2. <resources>

4. <string name="app_name">Donation</string>
5. <string name="action_settings">Settings</string>
6. <string name="donateTitle">Welcome Homer</string>
7. <string name="donateSubtitle">Please give generously</string>
8. <string name="donateButton">Donate</string>

10. </resources>

If there is a deviation from the above - retrace your steps (delete the button) until you can match the above.

We can now switch our attention to the Java Activity class Donate:

1. package com.example.donation;

3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;

7. public class Donate extends Activity
8. {

10. @Override
11. protected void onCreate(Bundle savedInstanceState)
12. {
13. super.onCreate(savedInstanceState);
14. setContentView(R.layout.activity_donate);
15. }

17. @Override
18. public boolean onCreateOptionsMenu(Menu menu)
19. {
20. // Inflate the menu; this adds items to the action bar if it is present.
21. getMenuInflater().inflate(R.menu.donate, menu);
22. return true;
23. }
24. }

For any ‘controls’ a user can interact with we usually find it useful to associate a class member with that object. Currently we only have one - a Button. The text fields we dont consider ‘interactive’ as such, so we will not include those.

Insert the following new field into the class:

1. private Button donateButton;

The class will have to be imported. The class name will always match the name in the Pallette:

We are free to call the variable anything we like. However, in order to keep confusion to a minimum, always call the variable by the same name you used in the Outline view:

In onCreate - we need to initialise this variable:

1. donateButton = (Button) findViewById(R.id.donateButton);

We might also add a logging message so we can have some feedback as the app launches:

1. Log.v("Donate", "got the donate button");

This is the complete activity class:

1. package com.example.donation;

3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.util.Log;
6. import android.view.Menu;
7. import android.widget.Button;

9. public class Donate extends Activity
10. {
11. private Button donateButton;

13. @Override
14. protected void onCreate(Bundle savedInstanceState)
15. {
16. super.onCreate(savedInstanceState);
17. setContentView(R.layout.activity_donate);

19. donateButton = (Button) findViewById(R.id.donateButton);
20. Log.v("Donate", "got the donate button");
21. }

23. @Override
24. public boolean onCreateOptionsMenu(Menu menu)
25. {
26. getMenuInflater().inflate(R.menu.donate, menu);
27. return true;
28. }
29. }

Finding the log message can be very difficult, unless you set a filter. In the ‘LogCat’ view in eclipse, create a filter like this:

If you then select the filter, we should see our message:

We should check the donate button actually exists before logging our success:

1. if (donateButton != null)
2. {
3. Log.v("Donate", "Really got the donate button");
4. }

Run the app again, and verify the above message appears.