Login Screen handle with text watcher in multiple textinputedittext and validate username and password in Kotlin and handle button onclick xml with function

Login Screen handle with text watcher in multiple textinputedittext and validate username and password in Kotlin and handle button Onclick XML with function

1: Create activity_main.xml to design login form fields as username, password, and button

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout 

xmlns:android="http://schemas.android.com/apk/res/android"   

xmlns:app="http://schemas.android.com/apk/res-auto"  

xmlns:tools="http://schemas.android.com/tools"  

android:layout_width="match_parent"

android:layout_height="match_parent"    

tools:context="www.paymonk.com.kridhankotlin.MainActivity">

<android.support.v7.widget.CardView        

android:id="@+id/cardView"        

android:layout_width="match_parent"        

android:layout_height="wrap_content"        

android:layout_centerHorizontal="true"        

android:layout_centerVertical="true"        

android:layout_margin="25dp"        

app:cardCornerRadius="5dp"        

app:cardElevation="1dp"        

app:cardUseCompatPadding="true">

<LinearLayout            

android:layout_width="match_parent"            

android:layout_height="match_parent"            

android:orientation="vertical">

<android.support.design.widget.TextInputLayout 

android:id="@+id/usernamewrapper"                

android:layout_width="match_parent"                

android:layout_height="wrap_content">


<android.support.design.widget.TextInputEditText 

android:id="@+id/et_username"                    

android:layout_width="match_parent"                    

android:layout_height="wrap_content"                    

android:hint="Username" />


</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout   

android:id="@+id/passwordwrapper"            

android:layout_width="match_parent"               

android:layout_height="wrap_content">

<android.support.design.widget.TextInputEditText  

android:id="@+id/et_password"                   

android:layout_width="match_parent"                    

android:layout_height="wrap_content"                    

android:hint="Password" />
</android.support.design.widget.TextInputLayout>

<Button                

android:id="@+id/btn_login"                

android:layout_width="wrap_content"                

android:layout_height="wrap_content"                

android:layout_gravity="center"                

android:onClick="login"                

android:text="Login" />

</LinearLayout>

</android.support.v7.widget.CardView>
</RelativeLayout>

2: Create MainActivity.kt 

class MainActivity : AppCompatActivity() {


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }


3: Validate fields using validate function


fun validate() {
    var userName = et_username.text.toString()
    var password = et_password.text.toString()

if (userName.equals("") || userName.equals(null)) {
usernamewrapper.error = "Username is not null"        
usernamewrapper.isErrorEnabled = true    
} else if (password.equals("") || password.equals(null)) {
passwordwrapper.error = " Password is not null"        
passwordwrapper.isErrorEnabled = true    
} else {
usernamewrapper.isErrorEnabled = false        
passwordwrapper.isErrorEnabled = false        
Toast.makeText(this, " Login successfully : username-> " 
+ userName + " password-> " 
+ password, 
Toast.LENGTH_SHORT).show()
    }
}

4: onclick xml in create function onclick="login"

fun login(v: View) {
    validate()
}


5: Textwatcher handle multiple textinputedittext by id


inner class Textwatcher(var v: View) : TextWatcher {

    override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {
        //do something    }

    override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
        //do something    }

    override fun afterTextChanged(s: Editable?) {
        when (v.getId()) {
            R.id.et_username -> if (!s.isNullOrEmpty()) {
                usernamewrapper.setErrorEnabled(false)
            }

            R.id.et_password -> if (!s.isNullOrEmpty()) {
                passwordwrapper.setErrorEnabled(false)
            }
        }
    }

}



6:Then complete MainActivity.kt


package www.abhishek.com.kotlin

import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import android.text.Editable
import android.text.TextWatcher
import android.view.View
import android.widget.Toast
import kotlinx.android.synthetic.main.activity_main.*


/** * Created by abhishek * https://abhiandroidknowledge.blogspot.com/2018/04/login-screen-handle-with-text-watcher.html
 * */
class MainActivity : AppCompatActivity() {


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        initialise()
    }

    fun initialise() {
        et_username.addTextChangedListener(Textwatcher(et_username))
        et_password.addTextChangedListener(Textwatcher(et_password))
    }

    fun login(v: View) {
        validate()
    }

    fun validate() {
        var userName = et_username.text.toString()
        var password = et_password.text.toString()


if (userName.equals("") || userName.equals(null)) {
usernamewrapper.error = "Username is not null"            
usernamewrapper.isErrorEnabled = true        
} else if (password.equals("") || password.equals(null)) {
passwordwrapper.error = " Password is not null"            
passwordwrapper.isErrorEnabled = true        
} else {
usernamewrapper.isErrorEnabled = false            
passwordwrapper.isErrorEnabled = false            
Toast.makeText(this, " Login successfully : username-> " 
+ userName + " password-> " 
+ password, 
Toast.LENGTH_SHORT).show()
        }
    }

    inner class Textwatcher(var v: View) : TextWatcher {

        override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {
            //do something        }

        override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
            //do something        }

        override fun afterTextChanged(s: Editable?) {
            when (v.getId()) {
                R.id.et_username -> if (!s.isNullOrEmpty()) {
                    usernamewrapper.setErrorEnabled(false)
                }

                R.id.et_password -> if (!s.isNullOrEmpty()) {
                    passwordwrapper.setErrorEnabled(false)
                }
            }
        }

    }

}



7:Complete login form and validate the form and textwatcher watch the error


Thank you