前言
考核时间过了才发的哈
老规矩最后有源码
效果图
一.分析
1.组合多个控件完成此输入框静态效果
2.hint值上浮下潜动画
3.一些功能
二、步骤
1.自定义一个控件
public class MyEditVIew extends RelativeLayout {
public MyEditVIew(Context context) {
super(context,null);
}
public MyEditVIew(Context context, AttributeSet attrs) {
super(context, attrs,0);
}
public MyEditVIew(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
}
2.写一个相似布局(代码在最后)
//代码在最后源码部分
3.将布局打气到view中
LayoutInflater.from(context).inflate(R.layout.my_edit_view, this);
4.小提示文字上浮下潜动画
//小提示文字出现动画
private void minTextshow(TextView textView) {
AnimationSet animationSet = new AnimationSet(true);
Animation mHiddenAction = new TranslateAnimation(Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 1.0f, Animation.RELATIVE_TO_SELF,
0.0f);
Animation alphaAnimation = new AlphaAnimation(0, 1f);
animationSet.addAnimation(mHiddenAction);
animationSet.addAnimation(alphaAnimation);
animationSet.setDuration(300);
textview.startAnimation(animationSet);
}
//小提示文字隐藏动画
private void minTexthide(TextView textView) {
AnimationSet animationSet = new AnimationSet(true);
Animation mShowAction = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 1.0f);
mShowAction.setRepeatMode(Animation.REVERSE);
Animation alphaAnimation = new AlphaAnimation(1f, 0);
animationSet.addAnimation(mShowAction);
animationSet.addAnimation(alphaAnimation);
animationSet.setRepeatMode(Animation.REVERSE);
animationSet.setDuration(300);
textview.startAnimation(animationSet);
CountDownTimer countDownTimer = new CountDownTimer(300, 300) {
@Override
public void onTick(long millisUntilFinished) {
}
@Override
public void onFinish() {
textview.setText("");
}
}.start();
}
5.密码加密解密显示
主要代码
//设置文字非加密
HideReturnsTransformationMethod method = HideReturnsTransformationMethod.getInstance();
edittext.setTransformationMethod(method);
//设置文字加密
TransformationMethod method = PasswordTransformationMethod.getInstance();
edittext.setTransformationMethod(method);
6.其他一些小知识点
1.将光标移到最后
//将光标移到最后
edittext.setSelection(edittext.getText().toString().length());
2.将键盘中的回车和空格去除
public static void setEditTextInputSpace(EditText editText) {
InputFilter filter = new InputFilter() {
@Override
public CharSequence filter(CharSequence source, int start, int end, Spanned dest, int dstart, int dend) {
if (source.equals(" ") || source.toString().contentEquals("\n")) {
return "";
} else {
return null;
}
}
};
editText.setFilters(new InputFilter[]{
filter});
}
3.给自定义view对外提供一个获取值的方法
public String getText() {
return edittext.getText().toString();
}
7.源码
1.MyEditVIew.java
public class MyEditVIew extends RelativeLayout {
private TextView textview;
private EditText edittext;
private boolean mtextisshow; //文字是否显示判断
private boolean imgisshow; //图片是否显示判断
private String hintText;
private ImageView imageView;
private ImageView iV_clean;
public MyEditVIew(Context context) {
super(context,null);
}
public MyEditVIew(Context context, AttributeSet attrs) {
super(context, attrs,0);
init(context, attrs);
setEditTextInputSpace(edittext);
textAddChanged();
imageOnClick();
}
public MyEditVIew(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
//打气布局，获取自定义属性的值
private void init(Context context, AttributeSet attrs) {
LayoutInflater.from(context).inflate(R.layout.my_edit_view, this);
textview = findViewById(R.id.textview);
edittext = findViewById(R.id.edittext);
imageView = findViewById(R.id.imageView);
iV_clean=findViewById(R.id.iV_clean);
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.MyEditVIew);
hintText = ta.getString(R.styleable.MyEditVIew_myhintText);
}
//文字输入监听以及一些逻辑处理（未优化）
private void textAddChanged(){
edittext.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
}
@Override
public void afterTextChanged(Editable s) {
int textSum = s.toString().trim().length();
if (textSum == 0) {
if (mtextisshow == true) {
minTexthide(textview);
mtextisshow = false;
iV_clean.setVisibility(INVISIBLE);
edittext.setHint(hintText);
}
} else {
if (imgisshow) {
//设置文字非加密
HideReturnsTransformationMethod method = HideReturnsTransformationMethod.getInstance();
edittext.setTransformationMethod(method);
edittext.setSelection(edittext.getText().toString().length());
} else {
//设置文字加密
TransformationMethod method = PasswordTransformationMethod.getInstance();
edittext.setTransformationMethod(method);
//将光标移到最后
edittext.setSelection(edittext.getText().toString().length());
}
if (mtextisshow == false) {
textview.setText(hintText);
minTextshow(textview);
iV_clean.setVisibility(VISIBLE);
mtextisshow = true;
}
}
}
});
}
//两个图片的点击事件，加密，清除文字
private void imageOnClick(){
imageView.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (imgisshow) {
imageView.setImageResource(R.mipmap.password_show);
HideReturnsTransformationMethod method = HideReturnsTransformationMethod.getInstance();
edittext.setTransformationMethod(method);
edittext.setSelection(edittext.getText().toString().length());
imgisshow = false;
} else {
imageView.setImageResource(R.mipmap.pwd_invisible);
TransformationMethod method = PasswordTransformationMethod.getInstance();
edittext.setTransformationMethod(method);
edittext.setSelection(edittext.getText().toString().length());
imgisshow = true;
}
}
});
iV_clean.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
edittext.setText("");
}
});
}
//小提示文字出现动画
private void minTextshow(TextView textView) {
AnimationSet animationSet = new AnimationSet(true);
Animation mHiddenAction = new TranslateAnimation(Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 1.0f, Animation.RELATIVE_TO_SELF,
0.0f);
Animation alphaAnimation = new AlphaAnimation(0, 1f);
animationSet.addAnimation(mHiddenAction);
animationSet.addAnimation(alphaAnimation);
animationSet.setDuration(300);
textview.startAnimation(animationSet);
}
//小提示文字隐藏动画
private void minTexthide(TextView textView) {
AnimationSet animationSet = new AnimationSet(true);
Animation mShowAction = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 1.0f);
mShowAction.setRepeatMode(Animation.REVERSE);
Animation alphaAnimation = new AlphaAnimation(1f, 0);
animationSet.addAnimation(mShowAction);
animationSet.addAnimation(alphaAnimation);
animationSet.setRepeatMode(Animation.REVERSE);
animationSet.setDuration(300);
textview.startAnimation(animationSet);
CountDownTimer countDownTimer = new CountDownTimer(300, 300) {
@Override
public void onTick(long millisUntilFinished) {
}
@Override
public void onFinish() {
textview.setText("");
}
}.start();
}
//将键盘中的回车和空格去除
public static void setEditTextInputSpace(EditText editText) {
InputFilter filter = new InputFilter() {
@Override
public CharSequence filter(CharSequence source, int start, int end, Spanned dest, int dstart, int dend) {
if (source.equals(" ") || source.toString().contentEquals("\n")) {
return "";
} else {
return null;
}
}
};
editText.setFilters(new InputFilter[]{
filter});
}
//提供一个可获取的值
public String getText() {
return edittext.getText().toString();
}
}
2.my_edit_view.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="4dp"
android:paddingRight="4dp"
>
<TextView
android:id="@+id/textview"
android:textSize="12sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#b1b1b1"
android:layout_marginRight="16dp"
android:layout_marginLeft="16dp"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="@+id/edittext"
android:layout_weight="1"
android:layout_height="wrap_content"
android:background="@null"
android:hint="密码"
android:textSize="22sp"
android:layout_width="0dp"
android:layout_marginLeft="16dp"
android:layout_marginBottom="6dp"
android:lines="1"
/>
<ImageView
android:id="@+id/iV_clean"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/clean"
android:visibility="invisible"
android:layout_marginRight="4dp"/>
<ImageView
android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/pwd_invisible"
android:layout_marginRight="16dp"/>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#b1b1b1"
android:layout_marginRight="16dp"
android:layout_marginLeft="16dp"/>
</LinearLayout>
3.attrs文件
<declare-styleable name="MyEditVIew">
<attr name="myhintText" format="string"/>
</declare-styleable>
总结
希望对您有所帮助，欢迎各位大佬留言点评
