第二章 UI组件
2-4 EditText
上一节的button是TextView的子类,这个EditText也是TextView的子类
TextView和button一些常用的属性,EditText也同样适用
- 常用属性
- 监听事件
- 制作登录界面
Button中的英文字母会自动大写,textAllCaps="false"
能取消这个默认,加了这句话显示如预览的红框,不加显示如预览的蓝框
新建EditTextActivity,步骤跟之前的一样,不赘述
ps:如果像上面这样,明明已经有activity_edit_text.xml这个文件了,还是报错说没找到,就把软件关了再开就行
检查:
已自动声明
activity_edit_text.xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="@+id/et_1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textSize="16sp"
android:textColor="#FFAD33"
android:hint="用户名"/>
<EditText
android:id="@+id/et_2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textSize="16sp"
android:textColor="#FFAD33"
android:inputType="textPassword"
android:hint="密码"
android:layout_below="@+id/et_1"
android:layout_marginTop="15dp"/>
<EditText
android:id="@+id/et_3"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textSize="16sp"
android:textColor="#FFAD33"
android:inputType="number"
android:hint="手机号"
android:layout_below="@+id/et_2"
android:layout_marginTop="15dp"/>
</RelativeLayout>
运行:
ps:手机号那里设置了输入类型为数字,所以键盘按其他的是不会显示的,密码那里设置了输入类型为密码,所以显示的是暗文
下面调整一下输入框:
在drawable那里新建bg_username.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke
android:width="1dp"
android:color="#999999"/>
<corners
android:radius="10dp"/>
</shape>
然后每个EditText都加上下面红框的这几句:
预览如下:
然后在输入框前加个小图标:
在res下新建一个文件夹叫:drawable-xxhdpi
把图片放到这里面(图片可以去 阿里图标库 下载(https://www.iconfont.cn/))
在两个EditText里加上红框内容:(手机号那个删掉了)
下面设置一个登录按钮:
bg_btn4是上一节设置的按钮按压效果的文件,代码可以去上一篇找
ps:button里面的字默认是居中的,不用另外设置
下面给这个按钮设置一个点击事件:
EditTextActivity.java:
package com.example.helloworld;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
public class EditTextActivity extends AppCompatActivity {
private Button mBtnLogin;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_edit_text);
mBtnLogin = findViewById(R.id.btn_login);
mBtnLogin.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(EditTextActivity.this,"登录成功!",Toast.LENGTH_SHORT).show();
}
});
}
}
下面给输入内容设置监听事件,监听输入的变化:
以给用户名设置为例:
运行后,在用户名输入框输入,在软件logcat可以看到记录:
相关完整代码:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="vertical">
<Button
android:id="@+id/btn_textview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TextView"
android:textAllCaps="false"/>
<Button
android:id="@+id/btn_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
/>
<Button
android:id="@+id/btn_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="EditText"
android:textAllCaps="false"/>
</LinearLayout>
MainActivity.java
package com.example.helloworld;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
public class MainActivity extends AppCompatActivity {
private Button mBtnTextView; //声明一个Button类型的变量,变量名为mBtnTextView
// 如果有报错,在出错地方按Alt+Enter键,会自动导入包
private Button mBtnButton;
private Button mBtnEditText;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mBtnTextView = findViewById(R.id.btn_textview); //找activity_main文件中设置的id
mBtnTextView.setOnClickListener(new View.OnClickListener(){ //创建点击事件
@Override
public void onClick(View v) {
//跳转到TextView演示
Intent intent = new Intent(MainActivity.this,TextViewActivity.class);
startActivity(intent);
}
});
mBtnButton = findViewById(R.id.btn_button); //找activity_main文件中设置的id
mBtnButton.setOnClickListener(new View.OnClickListener(){ //创建点击事件
@Override
public void onClick(View v) {
//跳转到Button演示
Intent intent = new Intent(MainActivity.this,ButtonActivity.class);
startActivity(intent);
}
});
mBtnEditText = findViewById(R.id.btn_edittext);
mBtnEditText.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//跳转到EditText演示
Intent intent = new Intent(MainActivity.this,EditTextActivity.class);
startActivity(intent);
}
});
}
}
EditTextActivity.java
package com.example.helloworld;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
public class EditTextActivity extends AppCompatActivity {
private Button mBtnLogin;
private EditText mEtUserName;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_edit_text);
mBtnLogin = findViewById(R.id.btn_login);
mBtnLogin.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(EditTextActivity.this,"登录成功!",Toast.LENGTH_SHORT).show();
}
});
mEtUserName = findViewById(R.id.et_1);
mEtUserName.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) {
Log.d("edittext",s.toString());
}
@Override
public void afterTextChanged(Editable s) {
}
});
}
}
activity_edit_text.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="@+id/et_1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textSize="16sp"
android:textColor="#FFAD33"
android:hint="用户名"
android:background="@drawable/bg_username"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:drawablePadding="5dp"
android:maxLines="1"
android:drawableLeft="@drawable/icon_user"
android:layout_marginTop="50dp"/>
<EditText
android:id="@+id/et_2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textSize="16sp"
android:textColor="#FFAD33"
android:inputType="textPassword"
android:hint="密码"
android:layout_below="@+id/et_1"
android:layout_marginTop="15dp"
android:background="@drawable/bg_username"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:drawablePadding="5dp"
android:maxLines="1"
android:drawableLeft="@drawable/icon_password"/>
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="@+id/et_2"
android:layout_marginTop="40dp"
android:text="登录"
android:textColor="#fff"
android:textSize="20sp"
android:background="@drawable/bg_btn4"/>
</RelativeLayout>