详解 EditText 输入框

0 讲作业

我昨天漏讲了加网络权限(视频里的没问题),唉,人真是老了。你想呀,一个「小淘宝」肯定是要网络权限的呀,现在我们就把昨天图文教程缺的补上,给「小淘宝」添加网络权限。打开 「AndroidManifest.xml 」,加入「uses-permission」节点:

动图演示:

至于把「小淘宝」改成「QQ空间」,就是把网址改成 QQ 空间的网址「https://i.qq.com」即可。

TIPS:WebView 只可以打开以「http://」或「https://」开头的网址,比如「www.baidu.com」必须写成「https://www.baidu.com」。

动图演示:

1 EditText 输入框

1x1 XML 属性

Edit 是编辑的意思,Text 是文本的意思。这玩意看起来很眼熟有没有,呃....好像并没有。EditText 是 TextView 的子类,用于输入和修改文本的一个控件。定义 EditText 时,必须指定TextView_inputType属性。例如,对于纯文本输入将inputType设置为“text”,以下是典型布局代码:

inputType 输入类型

这里有个新面孔,就是上面提到的「inputType」属性。「input」是输入的意思,「Type」是类型的意思,合起来字面意思就是输入类型。来看个例子:

输入密码时输入框是看不到文字的,只有一堆点点;再譬如某些情况下只能输入数字,这都是「inputType」的功劳。「inputType」可配置显示的键盘类型,可接受的字符类型以及编辑文本的外观。例如,如果您想请求用户输入密码,则可以将inputType设置为「textPassword」,这样输入的字符就显示为小点点。说白了,你没啥特殊要求 「inputType」的值就写「text」,要是输入普通的密码就写「textPassword」,要是输入只有数字的密码就写「numericPassword」。

Google 的 API 上要求是必须定义「inputType」,但是实际开发时不定义也不会有问题,就相当于「text」。但还是建议按照 API 文档上说的定义一下比较好。

imeOptions 输入法编辑器选项

还有一个值得关注的属性:在浏览器地址栏输入文本时,输入法右下角是搜索:

在发微信时,输入法右下角是回车:

输入法右下角的样式就是「imeOptions」属性控制的。「ime」英文全称「Input Method Editors」,「Input Method」是输入法的意思,「Editors」是编辑器的意思,「Options」是选项的意思,「imeOptions」合起来就是「输入法编辑器选项」的意思。这个属性的值与键盘右下角的字的对应关系是:

我们新建一个项目叫 「EdItTextTest」 包名写 「edittext.test」,其余默认,添加三个带有不同属性的 EditText ,要注意的是用 AndroidStudio 的朋友需要先在布局里嵌套一个 ,详情见演示:

TIPS: 使用android:imeOptions属性的时候,一定要对EditText设置 android:inputType 或者 设置 android:singleline=”true”。

运行后就这效果:

演示视频,这次我特意把文字调大了:

1x2 Java 代码

只有布局那就是个空壳,这里介绍几种常见的 EditText 的用法。还是在案例中学习,我们这次设计一个程序,界面上有一个输入框「EditText」,一个文本「TextView」,最后实现在输入框「EditText」输入文字,同步显示在文本里。那么来想一想布局,就上面放一个 TextView 下面放一个 EditText:

这里定义了一个 TextView ,文字大小为 「50sp」 ,文字为「在下方输入文字,这里将会显示相同的内容」,id为「textview」,都是我们比较熟悉的属性。接着又定义了一个 EditText ,文字为「请输入文字,上方将会出现相同的文字」,id 为「edittext」。然后想一想要实现什么样的逻辑,首先因为我们的 EditText 里有文字,还不少,用户想输入自己的还得一个个把我们写的删掉,所以我们需要在点击 EditText 时就清空里面的文字,另外由于上面的 TextView 应该是和下面的 EditText 里的文字同步的,所以 TextView 里的文字也要一并清空。然后需要在 EditText 里的文字改变时获取套里面输入的内容,然后把文字显示到 TextView 上。这时我们需要一个新的监听器「TextWatcher」,「Text」是文字的意思,「watcher」是观察者的意思,合起来就是「文字观察者」,很形象是不是?对于 EditText ,他的语法如下:

看起来有点小复杂,我们先要调用 EditText 对象的 「addTextChangedListener」方法,这里需要传入一个「TextWatcher」对象。然后我们在「TextWatcher」里重写「beforeTextChanged」,「onTextChanged」,「afterTextChanged」三个方法,然后在里面分别实现我们需要的逻辑。我们这里需要在文字改变时也改变 TextView 里的文字。系统会在文字改变时调用「onTextChanged」方法,并且传入参数,其中改变的文字就藏在第一个 「CharSequence」 对象里,我们调用「CharSequence」的「toString」方法就可以获取到改变后的文字。然后调用 TextView 的 「setText」方法,把文字显示到 TextView 上。依照这个思路,修改 MainActivity.java :

老例子,双开发工具演示视频:

3 总结

今天我们又学会了一个新的重要的控件——EditText ,收获满满,作业又来了,设计一个程序,做一个简易的计算器,实现两数相加,提示:两个输入框,一个按钮,一个文本。好啦,祝每个人都能实现梦想。

欢迎关注我的公众号,

每日一文,轻轻松松带你入门 Android 开发

  • 发表于:
  • 原文链接:http://kuaibao.qq.com/s/20180510G0CFP200?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

同媒体快讯

扫码关注云+社区

领取腾讯云代金券