Android开发之EditText控件(实现用户登录界面)

基本框架

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <EditText
        android:layout_width="200dp"
        android:layout_height="100dp"/>

</LinearLayout>

基本属性

EditText也继承自TextView类,所以TextView有的EditText也有。

hint

输入提示,在用户未输入时显示的文本。

textColosrHint

提示文字的颜色,一般会设置成比用户输入颜色稍淡。

inputType

输入类型,控制只能输入数字或者将输入加密不显示。

drawable系列

包含左右,在输入框的指定方位添加图片。

drawablePadding

设置图片与输入内容的间距。

padding系列

包含上下左右,设置内容与边框的间距。

background

设置背景色。

设置一个简单输入框

在基本框架的基础上,添加hinttextColor属性,将提示设置为“请输入用户名”,并把文本颜色设置成略透明的灰色,下面是两个资源代码,分别写在colors.xmlstrings.xml

<color name="gray">#AA95A1AA</color>
<string name="hint">请输入用户名</string>

activity_main中调用他们:

<EditText
        android:hint="@string/hint"
        android:textColorHint="@color/gray"
        android:layout_width="200dp"
        android:layout_height="100dp"/>

运行之后就有了一个简单的输入框:
在这里插入图片描述

加入输入类型

输入类型非常多,我们可以在AS给的提示里看个大概,对哪个感兴趣就可以试一试。
在这里插入图片描述
比如选择phone或者number,弹出来的输入法就只有数字,通过键盘也只能输入数字:
在这里插入图片描述
我们还可以加个输入框用来输入密码,将输入类型选为textPassword或者numberPassword,就可以做出加密效果:

<EditText
        android:hint="@string/password_hint"
        android:textColorHint="@color/gray"
        android:inputType="textPassword"
        android:layout_width="200dp"
        android:layout_height="100dp"/>

在这里插入图片描述
还有非常多的其他输入模式,有时间和兴趣可以一一探索。

加入图片

先在drawable文件夹中加入图片资源,过程同这篇文章的图片变换部分。我加入了一个账户图标与一个锁图标:
在这里插入图片描述
要在输入框左侧加入图片,设置drawableLeft属性为对应图片,如

android:drawableLeft="@drawable/ic_baseline_account_box_24"

这下看起来就更专业了:
在这里插入图片描述
drawableRight同理。

此外,如果对文字和图标的间距不满意,可以通过drawablePadding设置,比如android:drawablePadding="10dp"看起来就会更顺眼一点:
在这里插入图片描述

边框距离调整

除了调整图片与文本间的距离,还可以调整内容与边框的距离。padding就是与四周边框的距离,加上上下左右等限制后就可以设置对应边框间距,比如设定android:paddingLeft="10dp"后,就可以看到整个内容都向右移动了:
在这里插入图片描述

设置背景

如果不想要输入框下面的线,可以将背景设为纯色,如
在这里插入图片描述
如果有专门的UI设计,还可以加入别的图片等等。

获取输入内容

要实现登录界面,一般是输入完用户名密码后点击登录,所以我们还需要加一个按钮,并且能获取到用户输入的内容。

先加个按钮,再给两个输入框和按钮都加上id方便获取

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <EditText
        android:id="@+id/account"
        android:hint="@string/name_hint"
        android:textColorHint="@color/gray"
        android:drawableLeft="@drawable/ic_baseline_account_box_24"
        android:drawablePadding="10dp"
        android:paddingLeft="10dp"
        android:background="@color/white"
        android:inputType="phone"
        android:layout_width="200dp"
        android:layout_height="100dp"/>
    <EditText
        android:id="@+id/password"
        android:hint="@string/password_hint"
        android:textColorHint="@color/gray"
        android:drawableLeft="@drawable/ic_baseline_lock_24"
        android:drawablePadding="10dp"
        android:paddingLeft="10dp"
        android:inputType="textPassword"
        android:layout_width="200dp"
        android:layout_height="100dp"/>
    <Button
        android:id="@+id/loginButton"
        android:text="@string/log_in"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</LinearLayout>

然后,在Java代码中获取这三个控件,同时新建一个按钮的点击响应,用getText函数获取输入内容并用toString函数转化为字符串,在调试信息里打印出来:

package com.example.myedittext;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;

public class MainActivity extends AppCompatActivity {

    private EditText account,password;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button loginButton=findViewById(R.id.loginButton);
        account=findViewById(R.id.account);
        password=findViewById(R.id.password);

        loginButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String accountText = account.getText().toString();
                String passwordText = password.getText().toString();
                Log.e("ShadyPi", "输入账户"+accountText);
                Log.e("ShadyPi", "输入密码"+passwordText);
            }
        });
    }
}

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

ShadyPi

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值