سلام به دوستان عزیز
تصمیم گرفتم ی تاپیک ایجاد کنم و توی این تاپک آموزش کار با تمامی ابزار ها و ویو های متریال دیزاین رو در اندروید استودیو قرار بدم
نکته مهم : منظور ما از متریال فقط ی تولبار متریال یا یه اسلاید منوی متریال نیست بلکه ده ها ابزار دیگه وجود داره که کمتر بهشون اهمیت داده میشه
=============================================================
ابزار اول : Material Floating Label واسه ادیت تکست
ی لیبل شناور و زیبا هست واسه استفاده ادیت تکست
ما واسه استفاده از این ابزار نیاز به support library داریم
خوب پس کامپایلش میکنیم از فایل گردل پروژمون
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:23.0.1'
compile 'com.android.support:design:23.0.1'
}
با اضافه کردن این کتابخونه ی لایوت جدید میتونیم ایجاد کنیم به اسم Text input layout
حالا تحت همین لایوت جدید ی ادیت تکست ایجاد میکنیم
کد xml لایوتمون :
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:orientation="vertical"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="60dp">
<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_name"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="@+id/input_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:hint="@string/hint_name" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_email"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="@+id/input_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:hint="@string/hint_email" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_password"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="@+id/input_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:hint="@string/hint_password" />
</android.support.design.widget.TextInputLayout>
<Button android:id="@+id/btn_signup"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/btn_sign_up"
android:background="@color/colorPrimary"
android:layout_marginTop="40dp"
android:textColor="@android:color/white"/>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
فایل strings.xml برناممون :
<resources>
<string name="app_name">Floating Labels</string>
<string name="action_settings">Settings</string>
<string name="hint_name">Full Name</string>
<string name="hint_email">Email</string>
<string name="hint_password">Password</string>
<string name="btn_sign_up">Sign Up</string>
<string name="err_msg_name">Enter your full name</string>
<string name="err_msg_email">Enter valid email address</string>
<string name="err_msg_password">Enter the password</string>
</resources>
خوب حالا میریم سراغ کدنویسی کلاس جاوامون :
ببینید ما میتونیم حالت های زیادی تعریف کنیم واسه این ابزارمون
به طور مثال تابع set.error ک میاد اشتباه بودن محتویات ادیت تکستو مشخص میکنه
import android.os.Bundle;
import android.support.design.widget.TextInputLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.text.Editable;
import android.text.TextUtils;
import android.text.TextWatcher;
import android.view.View;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
private EditText inputName, inputEmail, inputPassword;
private TextInputLayout inputLayoutName, inputLayoutEmail, inputLayoutPassword;
private Button btnSignUp;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
inputLayoutName = (TextInputLayout) findViewById(R.id.input_layout_name);
inputLayoutEmail = (TextInputLayout) findViewById(R.id.input_layout_email);
inputLayoutPassword = (TextInputLayout) findViewById(R.id.input_layout_password);
inputName = (EditText) findViewById(R.id.input_name);
inputEmail = (EditText) findViewById(R.id.input_email);
inputPassword = (EditText) findViewById(R.id.input_password);
btnSignUp = (Button) findViewById(R.id.btn_signup);
inputName.addTextChangedListener(new MyTextWatcher(inputName));
inputEmail.addTextChangedListener(new MyTextWatcher(inputEmail));
inputPassword.addTextChangedListener(new MyTextWatcher(inputPassword));
btnSignUp.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
submitForm();
}
});
}
/**
* Validating form
*/
private void submitForm() {
if (!validateName()) {
return;
}
if (!validateEmail()) {
return;
}
if (!validatePassword()) {
return;
}
Toast.makeText(getApplicationContext(), "Thank You!", Toast.LENGTH_SHORT).show();
}
private boolean validateName() {
if (inputName.getText().toString().trim().isEmpty()) {
inputLayoutName.setError(getString(R.string.err_msg_name));
requestFocus(inputName);
return false;
} else {
inputLayoutName.setErrorEnabled(false);
}
return true;
}
private boolean validateEmail() {
String email = inputEmail.getText().toString().trim();
if (email.isEmpty() || !isValidEmail(email)) {
inputLayoutEmail.setError(getString(R.string.err_msg_email));
requestFocus(inputEmail);
return false;
} else {
inputLayoutEmail.setErrorEnabled(false);
}
return true;
}
private boolean validatePassword() {
if (inputPassword.getText().toString().trim().isEmpty()) {
inputLayoutPassword.setError(getString(R.string.err_msg_password));
requestFocus(inputPassword);
return false;
} else {
inputLayoutPassword.setErrorEnabled(false);
}
return true;
}
private static boolean isValidEmail(String email) {
return !TextUtils.isEmpty(email) && android.util.Patterns.EMAIL_ADDRESS.matcher(email).matches();
}
private void requestFocus(View view) {
if (view.requestFocus()) {
getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_VISIBLE);
}
}
private class MyTextWatcher implements TextWatcher {
private View view;
private MyTextWatcher(View view) {
this.view = view;
}
public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
public void onTextChanged(CharSequence charSequence, int i, int i1, int i2) {
}
public void afterTextChanged(Editable editable) {
switch (view.getId()) {
case R.id.input_name:
validateName();
break;
case R.id.input_email:
validateEmail();
break;
case R.id.input_password:
validatePassword();
break;
}
}
}
}
خوب نتیجه این کارمون میشه این :
اینم کار با تابع set.error
منتظر کار با سایر ابزار های متریال باشید
با اجازه تاپیک مهم شد !!!!!!!!!
موفق باشید