Date post: | 07-Apr-2018 |
Category: |
Documents |
Upload: | saurabh-bansal |
View: | 225 times |
Download: | 0 times |
of 26
8/3/2019 Android Lab 01
1/26
Lab 1: Introduction to Android
Application Development
In this lab, you will perform the following activities:
Exploring the Eclipse IDE Developing a simple Android application
8/3/2019 Android Lab 01
2/26
8/3/2019 Android Lab 01
3/26
NIIT Introduction to Android Application Development 1.3
Lab 1.1: Exploring the Eclipse IDE
To explore the Eclipse IDE, you need to perform the following steps:
1. Double-click the eclipse - Shortcut icon on the desktop. The Workspace Launcher dialog box isdisplayed.2. Click the Browse button.3. Browse to the directory where you want to create your workspace.4. Click the OK button.5. Click the OK button. This sets your workspace location, and the Java - Eclipse window is
displayed, as shown in the following figure.
The Java - Eclipse Window Welcome Screen
8/3/2019 Android Lab 01
4/26
1.4 Introduction to Android Application Development NIIT
6. Click the Workbench button. The Java - Eclipse window is displayed, as shown in thefollowing figure.
The Java - Eclipse Window
The different elements of the Java-Eclipse window are:
Outline view: This view displays the elements of a structured file currently open in theeditor area. The content of the outline view is editor dependent. For example, if an
Android class file is opened in the editor area, its structural elements, such as classes,
variables, and methods are displayed in the outline view.
Task List window: It helps you to view and edit the tasks in your task list. Double-click atask in your task list to open the editor.
Package Explorer window: The Package Explorer window provides a hierarchical view ofthe resources in the Workbench. You can manage the project with the help of the Package
Explorer view. In this view, you can view all the files and open them in the editor area for
editing, importing and exporting, and other project-related operations. When you
right-click a file in this view, a pop-up menu is displayed. You can choose any of the options
in this menu to perform actions related to project management.
Editor window: The Editor window displays the content of files and allows you to editthem.
When you close the Eclipse IDE, it saves the current state. When you open the Eclipse
IDE next time, it restores to the previously closed state.
Problems
Outline
Editor
Area
Package
ExplorerTask List
8/3/2019 Android Lab 01
5/26
NIIT Introduction to Android Application Development 1.5
Problems view: As you work with resources in the Workbench, various builders mayautomatically log problems, errors, or warnings in the Problems view. For example, when
you save a Java source file that contains syntax errors, those will be logged in the Problems
view. When you double-click the icon for a problem, error, or warning, the editor for the
associated resource automatically opens to the relevant line of code.
7. Close the Java - Eclipse window. The Confirm Exit dialog box appears.8. Click the OK button.
8/3/2019 Android Lab 01
6/26
1.6 Introduction to Android Application Development NIIT
Lab 1.2: Developing a Simple Android Application
You are required to develop an Android application that accepts the name of the user and displays a
message, Hello! . How will you develop the required application?
Solution
To develop the desired Android application, you need to perform the following tasks:
1. Create a new Android Virtual Device (AVD).2. Create an Android application.Task 1: Creating a New AVD
An AVD is a simulation of a real Android device, for you to test your applications before deploying
them on a real device. You need to perform the following steps to create a new AVD:
1. Double-click the eclipse - Shortcut icon on the desktop. The Workspace Launcher dialog box isdisplayed.
Ensure that you choose your workspace location in the Workspace combo box.
2. Click the OK button. The Java - Eclipse window appears.3. Select WindowPreferences. The Preferences window is displayed.
Perform the following steps to set your workspace location in the Workspaceauncherdialog box:
. Click the Browse button in the Workspace Launcherdialog box. The SelectWorkspace Directorydialog box appears, as shown in the following figure.
The Select Workspace Directory Dialog Box
. Browse to the new workspace directory.
. Click the OKbutton.
8/3/2019 Android Lab 01
7/26
NIIT Introduction to Android Application Development 1.7
4. Select the Android node in the left pane. The AndroidPreferences section is displayed in theright pane of the Preferences window.
5. Click the Browse button. The Browse For Folder dialog box is displayed.6. Browse to the C:\Program Files (x86)\Android\android-sdk-windows directory.
7. Click the OK button.8. Click the Apply button.9. Click the OK button.
While performing the preceding step, theAndroid SDKmessage box may appear, as
hown in the following figure.
The Android SDK Message Box
Click the Proceedbutton and perform the preceding step again.
Browse to the C:\Program Files\Android\android-sdk-windows directory while
erforming the preceding step on Windows XP.
8/3/2019 Android Lab 01
8/26
1.8 Introduction to Android Application Development NIIT
10.Select WindowAndroid SDK and AVD Manager. The Android SDK and AVD Manager windowis displayed, as shown in the following figure.
The Android SDK and AVD Manager Window
11. Ensure that the Virtual devices option is selected in the left pane.
In the preceding figure, if an AVD configuration with the name my_avdexists, then
pecify a different name for your AVD configuration in Step13.
8/3/2019 Android Lab 01
9/26
NIIT Introduction to Android Application Development 1.9
12. Click the New button. The Create new Android Virtual Device (AVD) dialog box is displayed, asshown in the following figure.
The Create new Android Virtual Device (AVD) Dialog Box
13. Type my_avd in the Name text box.14. Select the Google APIs (Google Inc.) API Level 8 from the Target list box.15. Select the HVGA option from the Built-in drop-down list.
8/3/2019 Android Lab 01
10/26
1.10 Introduction to Android Application Development NIIT
16. Click the Create AVD button. The Android SDK and AVD Manager window is displayed, asshown in the following figure.
The Android SDK and AVD Manager Window
17. Close the Android SDK and AVD Manager window.
If more than one AVD configurations exist, then the preceding figure may appear, as
hown in following figure.
The Android SDK and AVD Manager Window
8/3/2019 Android Lab 01
11/26
NIIT Introduction to Android Application Development 1.11
Task 2: Creating an Android Application
To create an android application, you need to perform the following steps:
1. Select FileNewOther. The New window is displayed, as shown in the following figure.
The New Window
2. Expand the Android node.3. Select Android Project.
8/3/2019 Android Lab 01
12/26
1.12 Introduction to Android Application Development NIIT
4. Click the Next button. The New Android Project window is displayed, as shown in the followingfigure.
The New Android Project Window
5. Type helloWorld in the Project name text box.6. Select the Android 2.2 check box under the Target Name column in the Build Target section.7. Type Hello! World in the Application name text box.8. Type com.apps.hello in the Package name text box.9. Ensure that the Create Activity check box is selected.10. Type HelloWorld in the text box adjacent to the Create Activity check box.11. Type 8 in the Min SDK Version text box.
8/3/2019 Android Lab 01
13/26
NIIT Introduction to Android Application Development 1.13
12. Click the Finish button. A new project with the name helloWorld is created in the PackageExplorer window, as shown in the following figure.
The helloWorld Created in the Package Explorer Window
13. Expand the helloWorldreslayout nodes in the Package Explorer window.14. Double-click the main.xml file. The main.xml tab appears in the Editor window after a few
moments.
8/3/2019 Android Lab 01
14/26
1.14 Introduction to Android Application Development NIIT
15. Select the Android 2.2 option from the drop down list below the Create button, as shown in thefollowing figure.
The main.xml Tab
16. Click the main.xml tab at the bottom of the Editor window.17. Replace the android:text="@string/hello" code with the following code for the TextView
control:
android:text="Enter your name:"
18. Click the Graphical Layout tab at the bottom of the Editor window.
8/3/2019 Android Lab 01
15/26
NIIT Introduction to Android Application Development 1.15
19. Click the EditText control in the Form Widgets folder and drag it to the black screen in thedesign area. The EditText control appears on the design area, as shown in the following figure.
The EditText Control
20. Click the main.xml tab at the bottom of the Editor window.21. Replace the android:text="EditText" code with the following code for the EditText control:
android:text=""
22. Click the Graphical Layout tab at the bottom of the Editor window.23. Click the Button control and drag it to the black screen in the design area.
8/3/2019 Android Lab 01
16/26
1.16 Introduction to Android Application Development NIIT
24. Right click the Button control on the black screen, and then select Layout WidthMatchParent from the pop-up menu. The Button control appears in the design area, as shown in the
following figure.
Displaying the Button Control on the Design Area
25. Click the main.xml tab at the bottom of the Editor window.26.
Replace theandroid:text="Button"
code with the following code for the Button control:
android:text="Click Here"
27. Type the following highlighted portion of code:
28. Click the Graphical Layout tab at the bottom of the Editor window.
The attributes of the element in the preceding step may not appear in
sequence as given. You just need to match the given attributes and type the
highlighted portion at the end. This is applicable to all the elements.
8/3/2019 Android Lab 01
17/26
NIIT Introduction to Android Application Development 1.17
29. Click the TextView control and drag it to the black screen in the design area. The TextViewcontrol appears in the design area, as shown in the following figure.
Displaying the TextView Control on the Design Area
30. Right click the TextView control in the design area, and then select Layout WidthMatchParent from the pop-up menu.
8/3/2019 Android Lab 01
18/26
1.18 Introduction to Android Application Development NIIT
31. Right click the TextView control, and then select PropertiesGravityCenter horizontal fromthe pop-up menu. The TextView control appears in the design area, as shown in the following
figure.
The TextView Control
32. Click the main.xml tab at the bottom of the Editor window.33. Replace the android:text="TextView" code with the following code for the TextView
control:
android:text=""
34. Expand the helloWorldresvalues nodes in the Package Explorer window.
8/3/2019 Android Lab 01
19/26
NIIT Introduction to Android Application Development 1.19
35. Double-click the strings.xml file. The Resources view of the strings.xml file opens in the Editorwindow, as shown in the following figure.
The Resources View of the strings.xml File
36. Click the strings.xml tab at the bottom of the Editor area.To switch from Resources viewto XML code view, you need to click the strings.xmltab given at the bottom of the Editor window.
37. Type the following code before the element:myClickHandler
38. Select FileSave All.You can save a file by using the Ctrl+S shortcut key, the Save icon, or the Save
ll icon on the toolbar.
39. Expand the src node in the Package Explorer window.40. Expand the com.apps.hello node.41. Double-click the HelloWorld.java file to open it in the Editor window.42. Type the following code after the import android.app.Activity; code:
import android.widget.TextView;
import android.widget.EditText;import android.view.View;
8/3/2019 Android Lab 01
20/26
1.20 Introduction to Android Application Development NIIT
43. Type the following code before the @Override code:TextView textview;EditText edittext;
44. Type the following code in the onCreate() method after thesetContentView(R.layout.main); code:
textview=(TextView)findViewById(R.id.textView1);edittext=(EditText)findViewById(R.id.editText1);
45. Type the following code after the onCreate() method:public void myClickHandler(View view){
switch(view.getId()){case R.id.button1:
textview.setText("Hello!!! "+edittext.getText());break;
}
}
46. Select FileSave All.47. Right-click the helloWorld node in the Package Explorer window, and then select Run AsRun
Configurations from the pop-up menu. The Run Configurations window is displayed, as shown
in the following figure.
The Run Configurations Window
8/3/2019 Android Lab 01
21/26
NIIT Introduction to Android Application Development 1.21
48. Right-click the Android Application node in the left pane, and then select New from the pop-upmenu. The New_configuration option is added under the Android Application node in the left
pane, as shown in the following figure.
Adding the New_configuration Option
ew_configuration represents a named set of project execution properties. It
includes AVD configuration required for the execution of the project. It specifies the
run configuration of the project.
49. Delete the text in the Name text box.50. Type helloWorld in the Name text box.
The run configuration name can be specified by you. The best practice would be to
use your project name as the run configuration name. For example, in the preceding
tep, helloWorldwas set as the run configuration name. However, you can specify
any name to it.
8/3/2019 Android Lab 01
22/26
1.22 Introduction to Android Application Development NIIT
51. Click the Browse button. The Project Selection window appears, as shown in the followingfigure.
The Project Selection Window
52. Select the helloWorld option.53. Click the OK button.54. Click the Target tab below the Name text box in the right pane.55. Select the check box under the AVD Name column in the Select a preferred
Android Virtual Device for deployment list box.
You need to replace in the preceding step with your AVD name that
ou have created in Task2 ofLab 1.2.
8/3/2019 Android Lab 01
23/26
NIIT Introduction to Android Application Development 1.23
56. Click the Run button. After some time, the Hello! World application is displayed in emulator, asshown in the following figure.
The 5554:my_avd Window
After some time, the emulator window displays output.
ometimes, the emulator screen gets locked before displaying the output of the
application, as shown in the following figure.
The Locked Emulator Screen
Drag the lock icon to the right. This unlocks the emulator device, and the output is
displayed.
57. Type David in the Enter your name text box.
8/3/2019 Android Lab 01
24/26
1.24 Introduction to Android Application Development NIIT
58. Click the Click Here button. The output is displayed, as shown in the following figure.
Displaying the Output
59. Close the emulator window.60. Close the Java - helloworld/src/com/apps/hello/HelloWorld.java - Eclipse window. The
Confirm Exit dialog box appears.
61. Click the OK button.
8/3/2019 Android Lab 01
25/26
NIIT Introduction to Android Application Development 1.25
Exercise 1.1
Develop an Android application that accepts the following details from the user:
First name Last name Phone E-mailIn addition, you need to perform the following validations:
The first and last names should not be left empty. The phone number should contain only numeric values. The phone number should contain minimum 8 digits and maximum 10 digits. The e-mail address should contain @ and .(dot). For example, [email protected] following figure displays the user interface of the Android application.
The User Interface
8/3/2019 Android Lab 01
26/26
When a user clicks the Display button, the details entered by the user should be validated. If any of
the user details are invalid, the error messages are displayed, as shown in the following figure.
The User Interface with Error Messages
If the user details are valid, the details should be displayed, as shown in the following figure.
The User Interface with User Details
Hint: Use the indexOf() and lastIndexOf() methods of the String class to check for the
occurrence of @ and . in the email address, respectively. Use the length() method of the String
class to validate the length of the phone number. Use the Integer.valueOf() method to check for
the numeric values in the phone number.