/android/butterknife/signup-and-login-activity
We want to see how to design signup and login pages in xml then use Buterknife to bind our views and widgets.
Install Butterknife
1. Login Activity/Page
(a). activity_login.xml
<?xml version="1.0" encoding="utf-8"?> <ScrollView android_layout_width="match_parent" android_layout_height="match_parent" android_fitsSystemWindows="true" android_scrollbars="none" > <LinearLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_orientation="vertical" android_paddingLeft="25dp" android_paddingRight="25dp" android_paddingTop="50dp" > <TextView android_layout_width="match_parent" android_layout_height="72dp" android_layout_marginBottom="25dp" android_background="@color/primary" android_gravity="center" android_text="@string/app_name" android_textColor="@color/white" android_textSize="@dimen/login_text_size" /> <android.support.design.widget.TextInputLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_layout_marginBottom="8dp" android_layout_marginTop="8dp" > <EditText android_id="@+id/et_input_email" android_layout_width="match_parent" android_layout_height="wrap_content" android_hint="@string/email" android_inputType="textEmailAddress" /> </android.support.design.widget.TextInputLayout> <android.support.design.widget.TextInputLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_layout_marginBottom="8dp" android_layout_marginTop="8dp" > <EditText android_id="@+id/et_input_password" android_layout_width="match_parent" android_layout_height="wrap_content" android_hint="@string/password" android_inputType="textPassword" /> </android.support.design.widget.TextInputLayout> <android.support.v7.widget.AppCompatButton android_id="@+id/btn_login" android_layout_width="match_parent" android_layout_height="wrap_content" android_layout_marginBottom="25dp" android_layout_marginTop="25dp" android_padding="12dp" android_text="@string/login" android_textAllCaps="false" /> <LinearLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_orientation="horizontal" > <TextView android_id="@+id/tv_forgot_password" android_layout_width="0dp" android_layout_height="wrap_content" android_layout_marginBottom="25dp" android_layout_weight="1" android_gravity="center" android_text="@string/forgot_password" android_textSize="@dimen/middle" /> <View android_layout_width="1dp" android_layout_height="match_parent" android_layout_marginBottom="25dp" android_background="@color/white" /> <TextView android_id="@+id/tv_signup" android_layout_width="0dp" android_layout_height="wrap_content" android_layout_marginBottom="25dp" android_layout_weight="1" android_gravity="center" android_text="@string/sign_up" android_textSize="@dimen/middle" /> </LinearLayout> <LinearLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_orientation="horizontal" android_layout_marginTop="50dp" > <View android_layout_width="0dp" android_layout_height="1dp" android_layout_marginRight="10dp" android_layout_weight="1" android_background="@color/white" android_layout_marginTop="12dp" /> <TextView android_layout_width="wrap_content" android_layout_height="wrap_content" android_text="or" android_textColor="@color/iron" android_textSize="@dimen/middle" android_gravity="center" /> <View android_layout_width="0dp" android_layout_height="1dp" android_layout_marginLeft="10dp" android_layout_weight="1" android_background="@color/white" android_layout_marginTop="12dp" /> </LinearLayout> <LinearLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_layout_marginBottom="10dp" android_layout_marginTop="10dp" android_orientation="horizontal" > <ImageView android_layout_width="0dp" android_layout_height="50dp" android_layout_weight="1" android_src="@mipmap/ic_launcher" /> <ImageView android_layout_width="0dp" android_layout_height="50dp" android_layout_weight="1" android_src="@mipmap/ic_launcher" /> <ImageView android_layout_width="0dp" android_layout_height="50dp" android_layout_weight="1" android_src="@mipmap/ic_launcher" /> <ImageView android_layout_width="0dp" android_layout_height="50dp" android_layout_weight="1" android_src="@mipmap/ic_launcher" /> </LinearLayout> </LinearLayout> </ScrollView>
(b). LoginActivity.java
import android.app.ProgressDialog; import android.content.Intent; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.util.Patterns; import android.widget.Button; import android.widget.EditText; import android.widget.Toast; import butterknife.BindView; import butterknife.ButterKnife; import butterknife.OnClick; import cn.aaronyi.ameneye.R; public class LoginActivity extends AppCompatActivity { private static final int REQUEST_SIGN_UP = 0; @BindView(R.id.et_input_email) EditText _emailText; @BindView(R.id.et_input_password) EditText _passwordText; @BindView(R.id.btn_login) Button _loginButton; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_login); ButterKnife.bind(this); } @Override public void onBackPressed() { // super.onBackPressed(); //防止用户关闭MainActivity moveTaskToBack(true); } @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { // super.onActivityResult(requestCode, resultCode, data); if (requestCode == REQUEST_SIGN_UP) { if (resultCode == RESULT_OK) { // TODO: Implement successful signup logic here // By default we just finish the Activity and log them in automatically this.finish(); } } } @OnClick(R.id.btn_login) public void login() { if (!validate()) { onLoginFailed(); return; } _loginButton.setEnabled(false); final ProgressDialog progressDialog = new ProgressDialog(this, R.style.AppTheme_Dark_Dialog); progressDialog.setIndeterminate(true); progressDialog.setMessage("Authenticating..."); progressDialog.show(); String email = _emailText.getText().toString(); String password = _passwordText.getText().toString(); new android.os.Handler().postDelayed(new Runnable() { @Override public void run() { onLoginSuccess(); progressDialog.dismiss(); } }, 3000); } @OnClick(R.id.tv_signup) public void signUp() { Intent intent = new Intent(this,SignupActivity.class); startActivityForResult(intent,REQUEST_SIGN_UP); } private void onLoginSuccess() { _loginButton.setEnabled(true); finish(); } private void onLoginFailed() { Toast.makeText(this, "Login failed", Toast.LENGTH_SHORT).show(); _loginButton.setEnabled(true); } private boolean validate() { boolean valid = true; String email = _emailText.getText().toString(); String password = _passwordText.getText().toString(); if (email.isEmpty() || !Patterns.EMAIL_ADDRESS.matcher(email).matches()) { _emailText.setError("enter a valid email address"); valid = false; } else { _emailText.setError(null); } if (password.isEmpty() || password.length() < 6) { _passwordText.setError("the password length must be greater than six"); valid = false; } else { _passwordText.setError(null); } return valid; } }
3.Signup Activity/Page
(a). activity_signup.xml
<?xml version="1.0" encoding="utf-8"?> <ScrollView android_layout_width="fill_parent" android_layout_height="fill_parent" android_fitsSystemWindows="true" android_scrollbars="none" > <LinearLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_orientation="vertical" android_paddingLeft="24dp" android_paddingRight="24dp" android_paddingTop="56dp"> <TextView android_layout_width="match_parent" android_layout_height="72dp" android_layout_marginBottom="25dp" android_background="@color/primary" android_gravity="center" android_text="@string/app_name" android_textColor="@color/white" android_textSize="@dimen/login_text_size" /> <!-- Name Label --> <android.support.design.widget.TextInputLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_layout_marginBottom="8dp" android_layout_marginTop="8dp"> <EditText android_id="@+id/input_name" android_layout_width="match_parent" android_layout_height="wrap_content" android_hint="Name" android_inputType="textCapWords"/> </android.support.design.widget.TextInputLayout> <!-- Email Label --> <android.support.design.widget.TextInputLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_layout_marginBottom="8dp" android_layout_marginTop="8dp"> <EditText android_id="@+id/input_email" android_layout_width="match_parent" android_layout_height="wrap_content" android_hint="Email" android_inputType="textEmailAddress"/> </android.support.design.widget.TextInputLayout> <!-- Password Label --> <android.support.design.widget.TextInputLayout android_layout_width="match_parent" android_layout_height="wrap_content" android_layout_marginBottom="8dp" android_layout_marginTop="8dp"> <EditText android_id="@+id/input_password" android_layout_width="match_parent" android_layout_height="wrap_content" android_hint="Password" android_inputType="textPassword"/> </android.support.design.widget.TextInputLayout> <!-- Signup Button --> <android.support.v7.widget.AppCompatButton android_id="@+id/btn_signup" android_layout_width="fill_parent" android_layout_height="wrap_content" android_layout_marginBottom="24dp" android_layout_marginTop="24dp" android_padding="12dp" android_text="Create Account"/> <TextView android_id="@+id/link_login" android_layout_width="fill_parent" android_layout_height="wrap_content" android_layout_marginBottom="24dp" android_gravity="center" android_text="Already a member? Login" android_textSize="16dip"/> </LinearLayout> </ScrollView>
(b). SignupActivity.java
import android.app.ProgressDialog; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.widget.Button; import android.widget.EditText; import android.widget.Toast; import butterknife.BindView; import butterknife.ButterKnife; import butterknife.OnClick; import cn.aaronyi.ameneye.R; public class SignupActivity extends AppCompatActivity { @BindView(R.id.input_name) EditText _nameText; @BindView(R.id.input_email) EditText _emailText; @BindView(R.id.input_password) EditText _passwordText; @BindView(R.id.btn_signup) Button _signUpButton; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_signup); ButterKnife.bind(this); } @OnClick(R.id.btn_signup) public void signUp() { if (!validate()) { onSignupFailed(); return; } _signUpButton.setEnabled(false); final ProgressDialog progressDialog = new ProgressDialog(SignupActivity.this, R.style.AppTheme_Dark_Dialog); progressDialog.setIndeterminate(true); progressDialog.setMessage("Creating Account..."); progressDialog.show(); String name = _nameText.getText().toString(); String email = _emailText.getText().toString(); String password = _passwordText.getText().toString(); // TODO: Implement your own signup logic here. new android.os.Handler().postDelayed( new Runnable() { public void run() { // On complete call either onSignupSuccess or onSignupFailed // depending on success onSignupSuccess(); // onSignupFailed(); progressDialog.dismiss(); } }, 3000); } @OnClick(R.id.link_login) public void toLogin() { // Finish the registration screen and return to the Login activity finish(); } private void onSignupSuccess() { _signUpButton.setEnabled(true); setResult(RESULT_OK, null); finish(); } private void onSignupFailed() { Toast.makeText(getBaseContext(), "Login failed", Toast.LENGTH_LONG).show(); _signUpButton.setEnabled(true); } private boolean validate() { boolean valid = true; String name = _nameText.getText().toString(); String email = _emailText.getText().toString(); String password = _passwordText.getText().toString(); if (name.isEmpty() || name.length() < 3) { _nameText.setError("at least 3 characters"); valid = false; } else { _nameText.setError(null); } if (email.isEmpty() || !android.util.Patterns.EMAIL_ADDRESS.matcher(email).matches()) { _emailText.setError("enter a valid email address"); valid = false; } else { _emailText.setError(null); } if (password.isEmpty() || password.length() < 4 || password.length() > 10) { _passwordText.setError("between 4 and 10 alphanumeric characters"); valid = false; } else { _passwordText.setError(null); } return valid; } }