前言
使用安卓objectAnimator實(shí)現(xiàn)登錄頁面editText標(biāo)題上下浮動(dòng)的動(dòng)畫
效果
在這里插入圖片描述
代碼
MainActivity.java監(jiān)聽動(dòng)畫關(guān)鍵的代碼
//編輯框點(diǎn)擊時(shí)的動(dòng)畫
@Override
public void onFocusChange(View v, boolean hasFocus) {
if(hasFocus){
//獲得焦點(diǎn)
if(v.getId()==R.id.editText_login_user_name){
if(editText_login_user_name.getText().length()==0){
//動(dòng)畫用的是px單位 需自己定義工具轉(zhuǎn)換
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_user_name, "translationY", ViewUtil.dip2px(this,25), 0);
objectAnimator.setDuration(400);
objectAnimator.start();
}
//編輯框下的橫線的動(dòng)畫
textView_line_1.setBackgroundColor(getResources().getColor(R.color.colorBlue));
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_line_1, "scaleX", 0, 1);
objectAnimator.setDuration(400);
objectAnimator.start();
}
if(v.getId()==R.id.editText_login_password){
if(editText_login_password.getText().length()==0){
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_password, "translationY", ViewUtil.dip2px(this,25), 0);
objectAnimator.setDuration(400);
objectAnimator.start();
}
textView_line_2.setBackgroundColor(getResources().getColor(R.color.colorBlue));
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_line_2, "scaleX", 0, 1);
objectAnimator.setDuration(400);
objectAnimator.start();
}
}else{
//取消焦點(diǎn)
textView_line_2.setBackgroundColor(getResources().getColor(R.color.grey));
textView_line_1.setBackgroundColor(getResources().getColor(R.color.grey));
if(v.getId()==R.id.editText_login_user_name&&editText_login_user_name.getText().length()==0){
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_user_name, "translationY", 0, ViewUtil.dip2px(this,25));
objectAnimator.setDuration(400);
objectAnimator.start();
}
if(v.getId()==R.id.editText_login_password&&editText_login_password.getText().length()==0){
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_password, "translationY", 0, ViewUtil.dip2px(this,25));
objectAnimator.setDuration(400);
objectAnimator.start();
}
}
}
MainActivity.java
public class MainActivity extends AppCompatActivity implements View.OnClickListener,View.OnFocusChangeListener {
private TextView textView_login_user_name; // 聲明一個(gè)文本視圖對(duì)象
private TextView textView_login_password; // 聲明一個(gè)文本視圖對(duì)象
private TextView textView_line_1; // 聲明一個(gè)文本視圖對(duì)象
private TextView textView_line_2; // 聲明一個(gè)文本視圖對(duì)象
private EditText editText_login_user_name; // 聲明一個(gè)編輯框?qū)ο? private EditText editText_login_password; // 聲明一個(gè)編輯框?qū)ο? private Button btn_forget; // 聲明一個(gè)按鈕控件對(duì)象
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
textView_login_user_name = findViewById(R.id.textView_login_user_name);
textView_login_password = findViewById(R.id.textView_login_password);
textView_line_1 = findViewById(R.id.textView_line_1);
textView_line_2 = findViewById(R.id.textView_line_2);
editText_login_user_name = findViewById(R.id.editText_login_user_name);
editText_login_password = findViewById(R.id.editText_login_password);
btn_forget = findViewById(R.id.button_forget_password);
// 給editText_login_user_name添加文本變更監(jiān)聽器
editText_login_user_name.addTextChangedListener(new HideTextWatcher(editText_login_user_name, 11));
// 給editText_login_password添加文本變更監(jiān)聽器
editText_login_password.addTextChangedListener(new HideTextWatcher(editText_login_password, 6));
btn_forget.setOnClickListener(this);
findViewById(R.id.button_login).setOnClickListener(this);
//動(dòng)畫綁定
editText_login_user_name.setOnFocusChangeListener(this);
editText_login_password.setOnFocusChangeListener(this);
}
//編輯框點(diǎn)擊時(shí)的動(dòng)畫
@Override
public void onFocusChange(View v, boolean hasFocus) {
if(hasFocus){
//獲得焦點(diǎn)
if(v.getId()==R.id.editText_login_user_name){
if(editText_login_user_name.getText().length()==0){
//動(dòng)畫用的是px單位 需自己定義工具轉(zhuǎn)換
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_user_name, "translationY", ViewUtil.dip2px(this,25), 0);
objectAnimator.setDuration(400);
objectAnimator.start();
}
//編輯框下的橫線的動(dòng)畫
textView_line_1.setBackgroundColor(getResources().getColor(R.color.colorBlue));
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_line_1, "scaleX", 0, 1);
objectAnimator.setDuration(400);
objectAnimator.start();
}
if(v.getId()==R.id.editText_login_password){
if(editText_login_password.getText().length()==0){
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_password, "translationY", ViewUtil.dip2px(this,25), 0);
objectAnimator.setDuration(400);
objectAnimator.start();
}
textView_line_2.setBackgroundColor(getResources().getColor(R.color.colorBlue));
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_line_2, "scaleX", 0, 1);
objectAnimator.setDuration(400);
objectAnimator.start();
}
}else{
//取消焦點(diǎn)
textView_line_2.setBackgroundColor(getResources().getColor(R.color.grey));
textView_line_1.setBackgroundColor(getResources().getColor(R.color.grey));
if(v.getId()==R.id.editText_login_user_name&&editText_login_user_name.getText().length()==0){
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_user_name, "translationY", 0, ViewUtil.dip2px(this,25));
objectAnimator.setDuration(400);
objectAnimator.start();
}
if(v.getId()==R.id.editText_login_password&&editText_login_password.getText().length()==0){
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(textView_login_password, "translationY", 0, ViewUtil.dip2px(this,25));
objectAnimator.setDuration(400);
objectAnimator.start();
}
}
}
}
activity_main.xml
<androidx.constraintlayout.widget.ConstraintLayout 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:id="@+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textView_login_wellcome"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:padding="10dp"
android:text="歡迎登錄"
android:textAlignment="viewStart"
android:textColor="@color/black"
android:textSize="30sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/constraintLayout2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="24dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView_login_wellcome">
<TextView
android:id="@+id/textView_login_user_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="-20dp"
android:background="@null"
android:text="用戶名"
android:textSize="20sp"
android:translationY="25dp"
app:layout_constraintBottom_toTopOf="@+id/editText_login_user_name"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@+id/editText_login_user_name"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="@+id/editText_login_user_name"
android:layout_width="0dp"
android:layout_height="25dp"
android:layout_marginTop="2dp"
android:background="@android:color/transparent"
android:ems="10"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView_login_user_name" />
<TextView
android:id="@+id/textView_line_1"
android:layout_width="0dp"
android:layout_height="2px"
android:layout_marginTop="2dp"
android:layout_marginBottom="8dp"
android:background="@color/grey"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText_login_user_name" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/constraintLayout3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/constraintLayout2">
<TextView
android:id="@+id/textView_login_password"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="100dp"
android:text="密碼"
android:textSize="20sp"
android:translationY="25dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="@+id/editText_login_password"
android:layout_width="0dp"
android:layout_height="25dp"
android:layout_marginTop="2dp"
android:background="@android:color/transparent"
android:ems="10"
android:inputType="textPassword"
app:layout_constraintEnd_toStartOf="@+id/button_forget_password"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView_login_password" />
<Button
android:id="@+id/button_forget_password"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginBottom="8dp"
android:background="@null"
android:text="忘記密碼"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/editText_login_password"
app:layout_constraintTop_toBottomOf="@+id/textView_login_password" />
<TextView
android:id="@+id/textView_line_2"
android:layout_width="0dp"
android:layout_height="2px"
android:layout_marginTop="2dp"
android:layout_marginBottom="8dp"
android:background="@color/grey"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/button_forget_password"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText_login_password" />
</androidx.constraintlayout.widget.ConstraintLayout>
<Button
android:id="@+id/button_login"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:background="@drawable/button_style"
android:text="登錄"
android:textColor="@color/white"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/constraintLayout3" />
</androidx.constraintlayout.widget.ConstraintLayout>
其他樣式布局文件未給出有需要聯(lián)系作者
