Geeks
After showing students response to the mobile app dev, we decided to start new thread to our website for mobile app dev.
This is out first tutorial to design your first simple android app.
This tutorial assumes that you are well acquainted with Java, done with Installing of Android setup in your Development Environment or Development Computer and have already created a new project in Eclipse.The application built in this tutorial will demonstrate how to do various tasks in Android over making a truly productive application.
If you don’t know how to install it go through http://developer.android.com/sdk/installing.html
Application Design:
Let’s see what here we are looking to build:
We are looking to build a Login Application which on Successful Validation, redirect user on Browser. Let’s see in detail.
Setup Application Resources:
Android people did an excellent job creating a project layout that allows you to easily separate data from code. The res/directory in the project stores layout, images, and application data.
Strings
Now let’s see how to set and use different features provided by Android, starting from String, open res/values/strings.xmlwhich holds static strings of the project.
Next add strings named “login_page_heading” by clicking add then select string and press OK. A new String will appear in the list and the input fields to the right should be blank. Enter “login_page_heading” in the name and “LOGIN MODULE” in the value fields both without quotes and save it by CTRL+s. Do the same for other strings we need to create like shown in following screen:
At the bottom of the pane there are 2 tabs, resources and strings.xml. Click the strings.xml tag to view the raw XML of the file, which is visible in above screen. You can add String manually by switching to raw XML mode of the file.
Android Layouts
Android builds display components out of views. The views are built from XML files that tell android how to build the display. These layouts are stored in res/layout/. Open the res/layout/main.xml layout file. The Eclipse SDK includes a visual layout tool that should have come up.
We have used RelativeLayout amongst plenty of Layout provided by Android. Let’s create our login application layout.
RelativeLayout
The RelativeLayout is simple Android layout. RelativeLayouts allows you to position objects relative to other objects on the page. Right click on res/layouts/ and select New > Android XML file. In the dialog box enter anyname.xml for the File. This is to create new layout but we are using main.xml which has been, by default, provided by Android.
Click on TextView and drag it into the view from the left Panel under “Form Widgets” option, once done you would be able to see a TextView in your view screen and in bottom pane you could change its properties as usual, set its id to “@+id/TextViewHeading” something relative to its job, set its width and height according to screen, what text you wanted to display in this TextView so set text field to “@string/login_page_heading”, a string we already added in previous section in string.xml file, now after making such changes you would be able to see few changes in your view panel.
Same way you can add different widgets in the screen and set their positions according to each other or previous and later one as Relative layout positions components relative to each other, and change their properties.
Let’s see a ScreenShot which explains what we have done up till now in this Layout Section:
We are going to explore visual layout tool, to design a layout for our login screen:
Here in above screen we have shown how you can design an attractive User Interface for your application.
Android Manifest file
Android Manifest file is simply a doorway to any Android Application as it checks which of the permissions this application is asking for and which are the activities listed in the application and what are their role. We can say like as in Java main() is the starting point of an Application, here its AndroidManifest file.
<?xmlversion="1.0"encoding="utf-8"?> <manifestxmlns:android="http://schemas.android.com/apk/res/android" package="com.motionfrog.example.LoginBrowser" android:versionCode="1" android:versionName="1.0"> <applicationandroid:icon="@drawable/icon"android:label="@string/app_name"> <activityandroid:name=".LoginBrowser" android:label="@string/app_name"> <intent-filter> <actionandroid:name="android.intent.action.MAIN"/> <categoryandroid:name="android.intent.category.LAUNCHER"/> </intent-filter> </activity> </application> <uses-permissionandroid:name="android.permission.INTERNET"/> </manifest>
Notice the manifest starts with the standard xml tag. Then there is a manifest tag that links to the schema and defines the package, versionCode, and versionName attributes. Nested inside the manifest tag is an application tag. The application tag has the attributes android:icon and android:label that define the applications icon and the label respectively. The application tag contains the activity nodes that define the accessible activities of the application.
When the project was created the first activity for LoginBrowser was pre-populated into the file.
The intent-filter tag is used to declare the intents for the activity. Intent is simply a tag defining an attributes of the activity. The action tag with a name of “android.intent.action.MAIN” and category tag with a name of “android.intent.category.LAUNCHER” allows the activity to be an initial activity and will list the activity in the Android application launcher.
If you want to add new Activity you can simply add these statements in raw XML mode
<activityandroid:name="NextActivity" android:label="@string/app_name"> </activity>
Or you can add by Visual View of it.
Press Add and provide necessary information with respect to create new Activity.
Build Java File
Now when we are almost ready with UI and other work, what is left is to code for our Login Application which intense to open a Browser on Successful Login.
When we created a new Project it by default comes with following code:
packagecom.motionfrog.example.LoginBrowser;
importandroid.app.Activity;
importandroid.os.Bundle;
publicclassLoginBrowserextends Activity {
/** Called when the activity is first created. */
@Override
publicvoidonCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}
Let’s add such functionality that on button click it check whether Username and password equals to something, on matching we will redirect user on browser with a URL.
Create two Buttons, two EditText so that we can verify them and set some action to them and two strings for simple validation purpose.
private Button mButtonLogin, mButtonReset;
privateEditTextmUserInputBox, mPasswordInputBox;
private String mUserName="motionfrog", mPassword="motionfrog";
Initialize those views created in Xml file, like two EditTexts for Username Password, two Buttons for Login and Reset.
mButtonLogin=(Button)findViewById(R.id.ButtonLogin);
mButtonReset=(Button)findViewById(R.id.ButtonReset);
mUserInputBox=(EditText)findViewById(R.id.EditTextUser);
mPasswordInputBox=(EditText)findViewById(R.id.EditTextpassword);
Now put an OnClickListener event on both the buttons:
mButtonLogin.setOnClickListener(newOnClickListener() {
@Override
publicvoidonClick(View arg0) {
}
});
Now within this OnClickListener read inputs of EditTexts we have created for Username and Password and validate them with strings we created up above, just to check that whether user has entered username = “motionfrog” and password = “motionfrog”.
if(mUserInputBox.getText().toString().equals(mUserName)
&&mPasswordInputBox.getText().toString().equals(mPassword)){
}
else {
}
Within this If condition add an Intent to open up a browser with passing a static URL
Intent browser = newIntent(Intent.ACTION_VIEW);
browser.setData(Uri.parse("http://www.motionfrog.com"));
startActivity(browser);
And within else you can add code to show a Toast to inform user.
Toast.makeText(LoginBrowser.this, "wrong username or password", Toast.LENGTH_SHORT).show();
Let’s see an Output of above code:
I know you are facing it hard or little bit complex, but i am here you can comment your problems will replay ASAP.
So Start Android now 
. use coding and develop your self.
Subscribe to Free EngiGuide Latest Update SMS Alerts.
