Swift(十九)UITextField

更新:2018.05.24

整理了一下demo:SwiftDemo


一般在APP中,遇到的登录注册之类的输入框,基本都是使用的控件UITextFieldUITextField足够强大和灵活,它拥有提示语、密码输入、清除功能以及键盘样式设置,更方便开发与使用。

  • UITextFiled是一个可编辑的文本区域,它可以收集通过键盘输入或剪切板黏贴的数据。
  • UITextFieldUIControl的子类,所以它也拥有Target-Action的机制,但它也提供了代理模式,这两种模式都可以检测到文本输入的整个过程。
  • UITextField的键盘(keyboard)是可以配置的,支持多种输入形式,如普通文本键盘、邮箱键盘、数字键盘等。

1. 创建UITextField

        // 创建UITextField
        let textField = UITextField(frame: rect)
        // 背景颜色
        textField.backgroundColor = UIColor.white
        // 边框样式
        textField.borderStyle = UITextBorderStyle.roundedRect
        // 提示语
        textField.placeholder = "请输入您的邮箱地址"
        // 自动更正功能
        textField.autocorrectionType = UITextAutocorrectionType.no
        // 完成按钮样式
        textField.returnKeyType = UIReturnKeyType.done
        // 清除按钮显示状态
        textField.clearButtonMode = UITextFieldViewMode.whileEditing
        // 键盘样式
        textField.keyboardType = UIKeyboardType.emailAddress
        // 键盘外观
        textField.keyboardAppearance = UIKeyboardAppearance.alert
        // 安全文本输入,(输入密码)
        textField.isSecureTextEntry = false
        
        view.addSubview(textField)
  • 首先我们创建了一个UITextField,设置背景颜色为白色,borderStyle的作用是设置边框样式,由枚举UITextBorderStyle控制:
UITextBorderStyle属性 描述
none 无边框
line 直角矩形边界线
bezel 有阴影的边框
roundedRect 圆角矩形边框
  • placeHolder是提示文本,一般在输入框没有任何输入的时候显示
  • autocorrectionType的作用是设置时候开启文字自动修复功能,这个貌似只对英文有效,有兴趣的可以试一下,由UITextAutocorrectionType控制,有三个值:default、yes、no
  • returnType属性用来控制键盘返回键的样式(只能控制样式,不能修改方法,修改方法可以去代理中设置),通过枚举UIReturnKeyType控制:
UIReturnKeyType属性 描述
default 默认,标有Return
go 标有Go的按钮
google 标有Google的按钮
next 标有Next的按钮,中文键盘是'下一步'
route 标有Route的按钮
search 标有Search的按钮,中文键盘是'搜索'
send 标有Send的按钮,中文键盘是'发送'
yahoo 标有Yahoo!的按钮
done 标有Done的按钮,中文键盘是‘完成’
emergencyCall 紧急呼叫按钮
continue 标有Continue的按钮,中文键盘是‘继续’
  • clearButtonMode的作用是控制右侧清除按钮什么时候显示,由枚举** UITextFieldViewMode**控制:
UITextFieldViewMode属性 描述
never 从不出现
whileEditing 开始编辑时出现
unlessEditing 除了编辑外都出现
always 一直出现
  • keyboardType属性的作用是控制键盘的显示样式,由枚举UIKeyboardType控制:
UIKeyboardType属性 描述
default 默认键盘:支持所有字符
asciiCapable 支持ASCII的默认键盘
numbersAndPunctuation 标准电话键盘,支持+*#等符号
URL URL键盘,有.com按钮;只支持URL字符
numberPad 数字键盘
phonePad 电话键盘
namePhonePad 电话键盘,也支持输入人名字
emailAddress 用于输入电子邮件地址的键盘
asciiCapableNumberPad 支持ASCII的数字键盘
decimalPad 带‘.’的数字键盘
twitter 功能齐全键盘,类似asciiCapable
webSearch 带有面向url的附加的默认键盘类型
  • keyboardAppearance,定义的是键盘的样式,由枚举UIKeyboardAppearance控制:
UIKeyboardAppearance属性 描述
default 白色,这个字段是为了兼容以前的版本
dark 黑色
light 白色
alert 黑色,这个字段是为了兼容以前的版本
  • isSecureTextEntry属性设置为true时,输入的内容将会变成黑色原点,一般在输入密码时使用。

2.UITextField的浮动视图(Overlay view)

UITextField本身还可以使用Overlay View去扩展自身。


例如微信中的添加银行卡页面,输入框右面的两个按钮,就是将按钮放在UITextField的rightView中。这样就能将UITextField和UIButton很好的结合在一起。

        textField.leftViewMode = .always
        textField.rightViewMode = .always
        
        let leftButton = UIButton(type: .infoDark)
        leftButton.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
        textField.leftView = leftButton
        
        let rightButton = UIButton(type: .contactAdd)
        rightButton.frame = CGRect(x: 0, y: 0, width: 30, height: 30)
        textField.rightView = rightButton


a. 这里设置了 leftViewrightView 都是一直显示的,可根据实际情况自己设置
b. 可以看出定义了两个按钮,分别等于 leftViewrightView
c. 可以试一下修改两个Butotn的位置是没有用的。

3. UITextFieldDelegate

  1. 首先要添加协议头


  2. 然后
textField.delegate = self
  1. 最后 实现代理方法
    func textFieldShouldBeginEditing(_ textField: UITextField) -> Bool {
        print("将要开始编辑")
        return true
    }
    
    func textFieldDidBeginEditing(_ textField: UITextField) {
        print("已经开始编辑")
    }
    
    func textFieldShouldEndEditing(_ textField: UITextField) -> Bool {
        print("将要结束编辑")
        return true
    }
    
    func textFieldDidEndEditing(_ textField: UITextField) {
        print("已经结束编辑")
    }
    
    func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
        print("文本输入内容将要发生变化(每次输入都会调用)")
        return true
    }
    
    func textFieldShouldClear(_ textField: UITextField) -> Bool {
        print("将要清除输入内容,返回值是是否要清除掉内容")
        return true
    }
    
    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        print("将要按下Return按钮,返回值是是否结束输入(是否失去焦点)")
        return true
    }


a. print的内容就是代理方法的作用,这里就不一一解释了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,425评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,058评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,186评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,848评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,249评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,554评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,830评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,536评论 0 197
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,239评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,505评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,004评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,346评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,999评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,060评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,821评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,574评论 2 271
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,480评论 2 267

推荐阅读更多精彩内容