Android Login Screen Tutorial

person folder_openAndroidaccess_time March 24, 2015

In this tutorial we are going to show how to navigate from one activity to second activity. To demonstrate this,  we would like to use a clean user login screen example.

See flowing Steps :

  1. Create login activity layout which contains EditText widgets so that user can enter input data.
  2. Set OnClickListener to the Button
  3. Use Intent to pass data to another activity. We can use that data wherever we want.
  4. In this example we are using two activities. So we have to declare them in Manifest file.

1. Manifest file

 <?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.loginandroid"
    android:versionCode="1"
    android:versionName="1.0" >
    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="19" />
    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.example.loginandroid.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
         <activity
            android:name="com.example.loginandroid.SecondActivity"
            android:label="@string/app_name" >
        </activity>
    </application>
</manifest>

2. Activity layout file

 <LinearLayout xmlns:tools="http://schemas.android.com/tools"
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/container"
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="match_parent" >
    <LinearLayout
        android:id="@+id/layout1" android:orientation="horizontal"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:layout_width="match_parent">
        <TextView
            android:id="@+id/usertext"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="User_Name" />
        <EditText
            android:id="@+id/useredit"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:ems="10" >
            <requestFocus />
        </EditText>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/layout2"
        android:orientation="horizontal"
        android:layout_height="wrap_content"
        android:layout_width="match_parent">
        <TextView
            android:id="@+id/passtext"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Password" />
        <EditText
            android:id="@+id/passwordedit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:ems="10" >
            <requestFocus />
        </EditText>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/layout3"
        android:orientation="horizontal"
        android:layout_marginTop="20dp"
        android:layout_height="wrap_content"
        android:layout_width="match_parent">
        <Button
            android:id="@+id/login"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Login"
            android:onClick="loginButton"
            android:layout_marginLeft="50dp" />
        <Button
            android:id="@+id/reset"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Reset"
             android:onClick="resetButton"
            />
    </LinearLayout>
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:orientation="horizontal"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text1"
        android:text=" Hello  "
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:layout_width="wrap_content"
        android:textSize="15sp"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
         android:layout_marginTop="10dp"
          android:textSize="15sp" />
</LinearLayout>

3. Main Activity code

package com.example.loginandroid;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.Toast;
public class MainActivity extends Activity {
    public EditText username,userpassword;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // initializing EditText for user name & password
        username=(EditText)findViewById(R.id.useredit);
        userpassword=(EditText)findViewById(R.id.passwordedit);
    }
    public void loginButton(View v)
    {
    	// loginButton action defined in XML
        String userName = (username.getText().toString()).trim();
        String userPassword = (userpassword.getText().toString()).trim();
        if(userName.matches("") && userPassword.matches("")){
        	// if username or password is empty, it will show the toast
        	Toast.makeText(getApplicationContext(),
                    "UserName/ Password should not be Empty", Toast.LENGTH_SHORT)
                    .show();
        }else{
        	// if username / password not empty it will take you to Next screen
        	 Intent intent=new Intent(this,SecondActivity.class);
             intent.putExtra("name",userName);
             startActivity(intent);
        }
    }
    public void resetButton(View v)
    {
    	// resetButton action defined in XML
    	// clear edittext values
       username.setText("");
       userpassword.setText("");
    }
}
 
package com.example.loginandroid;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.widget.TextView;
public class SecondActivity extends Activity {
    TextView viewtext;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_second);
        viewtext = (TextView) findViewById(R.id.textview);
        Bundle bundle = getIntent().getExtras();
        String message = bundle.getString("name");
        Log.d("string","2"+message);
        viewtext.setText(message);
    }
}

4. Demonstration
Login Activity with validation

Login Activity with validation
Login Activity with validation

Login Activity with user input

Username and password entered
Username and password entered

Second Activity – Login success

Username is passed to the next activity through intent extras
Username is passed to the next activity through intent extras

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">