EditText & 简单登录界面制作
基本认识
Button是TextView的一个子类,EditView同样也是TextView的子类
其中,EditView是一个可输入内容的组件
参考属性文档:包含EditText控件的常用属性
常用基本属性介绍:
属性 | 含义 |
---|---|
textAllCaps |
设置字体大小写,android:textAllCaps="false"表示字体显示和输入的内容一致 |
hint |
设置文本框初始显示的用来提示用户输入的属性,在用户点击输入框开始输入时就会消失 |
inputType |
指定输入法类型 |
具体操作
<Button
android:id="@+id/btn_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="EditView"
android:background="@drawable/bg_btn2"
android:layout_marginTop="10dp"
android:textAllCaps="false"/>
设置监听事件:点击EditText
按钮时,跳转到新的页面(创建EditTextActivity页面(跳转到该页面)–> 设置监听事件)
package com.example.test_all_demo;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity extends AppCompatActivity {
private Button mBtnEditText;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//监听事件---实现跳转
mBtnEditText = findViewById(R.id.btn_edittext);
mBtnEditText.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
//跳转到EditView界面
Intent intent = new Intent(MainActivity.this, EditTextActivity.class);
startActivity(intent);
}
});
}
}
首先我们要在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="5dp"/>
</shape>
创建文件夹以后,进入到activity_edit_text.xml
文件下,设计UI界面;
<?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"
android:padding="15dp">
<EditText
android:id="@+id/et_1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textColor="#FFAD33"
android:textSize="16sp"
android:hint="用户名"
android:background="@drawable/bg_username"
android:maxLines="1"
android:layout_marginTop="50dp"/>
<EditText
android:id="@+id/et_2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textColor="#FFAD33"
android:textSize="16sp"
android:hint="密码"
android:background="@drawable/bg_username"
android:layout_below="@id/et_1"
android:inputType="textPassword"
android:layout_marginTop="15dp"/>
<!-- 设置登陆按钮-->
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="登陆"
android:textColor="#FFFFFF"
android:textSize="20sp"
android:background="@drawable/bg_btn4"
android:layout_below="@id/et_2"
android:layout_marginTop="20dp"/>
</RelativeLayout>
运行结果:
接下来设置用户名栏和密码栏icon图片:
设置icon头像只需要在选择合适的icon的图片大小,并在activity_edit_text.xml
文件中在对应的<EditText>
增加两行代码即可;
<EditText
android:id="@+id/et_1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textColor="#FFAD33"
android:textSize="16sp"
android:hint="用户名"
android:maxLines="1"
android:layout_marginTop="50dp"
android:drawableLeft="@drawable/icon_account"/>
<!--android:drawableLeft="@drawable/icon_account"新增代码,icon-account是图片的名称,存放在drawable文件夹下即可-->
<EditText
android:id="@+id/et_2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textColor="#FFAD33"
android:textSize="16sp"
android:hint="密码"
android:layout_below="@id/et_1"
android:inputType="textPassword"
android:layout_marginTop="15dp"
android:drawableLeft="@drawable/icon_password"/>
最后,设置监听事件;
监听事件介绍与设置
在一开始,当我们点击EditText按钮时,就会跳转到登录界面,这就是监听事件的实现;接下来我们简单介绍如何设置监听事件;
设置监听事件有三个基本要求:
一、声明空间
二、找到空间(老版本需要强制类型转换)
三、设置空间属性
当我们点击登录按钮后,一般会显示登录成功或者失败;为了演示方便,这里我们默认登录成功,并在对应的文件夹下即EditTextActivity.java
文件进行编码;
-
声明空间
private Button mBtnButton
-
找到空间
mBtnLogin = findViewById(R.id.btn_login);
-
设置空间属性
mBtnLogin.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Toast.makeText(EditTextActivity.this,"登陆成功!",Toast.LENGTH_SHORT).show(); } });
源代码
package com.example.test_all_demo;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
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 view) {
Toast.makeText(EditTextActivity.this,"登陆成功!",Toast.LENGTH_SHORT).show();
}
});
}
}
最终效果演示:文章来源:https://www.toymoban.com/news/detail-724816.html
文章来源地址https://www.toymoban.com/news/detail-724816.html
到了这里,关于Android 实现用户登陆界面的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!