当前位置:首页 > 操作系统 > Ios

iOS 9应用开发教程之显示编辑文本标签文本框

iOS 9应用开发教程之显示编辑文本标签文本框

ios9 显示、编辑文本

iOS ,经常会看到一些文本的显示。文字就是这些不会说话的设备的嘴巴。通过这些文字,可以很清楚的指定这些设备要表达的信息。本节将主要讲解在 iOS 中,用来显示和编辑文本的三个视图:标签、文本框和文本视图。

ios9只读文本 —— 标签

标签视图是一个只读的文本视图,它用于在应用程序中为用户显示少量的信息,如图 2.16 所示。在此图中文字的显示使用的就是标签视图。标签视图一般使用 UILabel 类实现。

技术分享

2.16   美容相机

【示例 2-6 】以下就是通过标签视图显示一首诗的效果。代码如下:

  • import UIKit

  • class ViewController: UIViewController {

  •     override func viewDidLoad() {

  •         super.viewDidLoad()

  •         // Do any additional setup after loading the view, typically from a nib.

  •         // 添加标签对象 mytitle

  •         let mytitle=UILabel(frame: CGRectMake(88, 100, 198, 58))

  •         mytitle.font=UIFont.boldSystemFontOfSize(44)                            // 设置字体 : 粗体

  •         mytitle.textAlignment=NSTextAlignment.Center                         // 设置对齐方式

  •         mytitle.text=" 送友人 "

  •         self.view.addSubview(mytitle)

  • // 添加标签对象 verse1

  •         let verse1=UILabel(frame: CGRectMake(44, 197, 303, 63))

  •         verse1.font=UIFont.systemFontOfSize(24)                                   // 设置字体

  •         verse1.textAlignment=NSTextAlignment.Center

  •         verse1.text=" 青山横北郭,白水绕东城。 "

  •         self.view.addSubview(verse1)

  • // 添加标签对象 verse2

  •         let verse2=UILabel(frame: CGRectMake(44, 268, 303, 63))

  •         verse2.font=UIFont.systemFontOfSize(24)

  •         verse2.textAlignment=NSTextAlignment.Center

  •         verse2.text=" 此地一为别,孤蓬万里征。 "

  •         self.view.addSubview(verse2)

  • // 添加标签对象 verse3

  •         let verse3=UILabel(frame: CGRectMake(44, 339, 303, 63))

  •         verse3.font=UIFont.systemFontOfSize(24)

  •         verse3.textAlignment=NSTextAlignment.Center

  •         verse3.text=" 浮云游子意,落日故人情。 "

  •         self.view.addSubview(verse3)

  • // 添加标签对象 verse4

  •         let verse4=UILabel(frame: CGRectMake(44, 410, 303, 63))

  •         verse4.font=UIFont.systemFontOfSize(24)

  •         verse4.textAlignment=NSTextAlignment.Center

  •         verse4.text=" 挥手自兹去,萧萧班马鸣。 "

  •         self.view.addSubview(verse4)

  •     }

  • ……

  • }

此时运行程序,会看到如图 2.17 所示的效果。

技术分享

2.17   运行效果

注意:标签视图默认是显示一行的,但是,也可以将标签的内容显示为多行。

【示例 2-7 】以下将为在标签中显示多行内容。代码如下:

  • import UIKit

  • class ViewController: UIViewController {

  •     override func viewDidLoad() {

  •         super.viewDidLoad()

  •         // Do any additional setup after loading the view, typically from a nib.

  •         let verse=UILabel(frame: CGRectMake(20, 191, 333, 196))

        verse.text="        像阳光一样的人,像阳光一样的事,像阳光一样的爱,像阳光一样的慈悲,世界上遍地都是。一声温暖的问候,一个甜甜的微笑,一句简单的祝福,一回小小的帮助,一次善意的举动,无不是我们生命的阳光。我们何不把它们收藏起来,让它照耀我们的人生路,温暖我们需要温暖的内心?心底的阳光多了,自己就是个太阳,还有什么风雨大到能够浇灭太阳? "

  •         self.view.addSubview(verse)

  •     }

  • ……

  • }

此时运行程序,会看到如图 2.18 所示的效果。在图中可以看到标签中只显示了一行文本内容,并没有将所有的内容显示出来。为了解决这一问题, iOS 提供了一个显示多行的属性 numberOfLines ,这样一来,标签中要显示的内容就可以以多行的形式全部显示出来。在此示例中,我们的标签内容需要 9 行才可以显示出来,所以在代码中添加以下内容:

  • verse.numberOfLines=9

此时运行程序,会看到如图 2.19 所示的效果。

技术分享

2.18   运行效果                           2.19   运行效果

单行读写文本 —— 文本框

文本框是一种常见的单行读写文本视图,简单的说就是输入控件,例如一种登录界面要求用户输入用户名和密码等,如图 2.1 所示。文本框一般使用 UITextField 实现。

【示例 2-8 】以下通过使用文本框实现 QQ 中添加账号的功能。具体操作步骤如下:

1 )创建一个 Single View Application 模板类型的项目,命名为 UITextField

2 )打开 Main.storyboard 文件,对主视图进行设计,效果如图 2.20 所示。

需要添加的视图以及对它们的设置如表 2-5 所示。 

2-5   对视图对象的设置

技术分享
技术分享

2.20   主视图的效果

3 )打开 ViewController.swift 文件,编写代码,此代码实现的功能是账号的添加。代码如下:

  • import UIKit

  • class ViewController: UIViewController {

  •     override func viewDidLoad() {

  •         super.viewDidLoad()

  •         // Do any additional setup after loading the view, typically from a nib.

  •         // 添加输入账号的文本框

  •         let accountnumber=UITextField(frame: CGRectMake(0, 116, 375, 50))

  •         accountnumber.borderStyle=UITextBorderStyle.RoundedRect       // 设置文本框的边框风格

  •         accountnumber.placeholder="QQ / 手机号 / 邮箱 "                             // 设置文本框的占位符

  •         self.view.addSubview(accountnumber)

  •         // 添加输入密码的文本框

  •         let password=UITextField(frame: CGRectMake(0, 165.5, 375, 50))

  •         password.borderStyle=UITextBorderStyle.RoundedRect

  •         password.placeholder=" 密码 "

  •         self.view.addSubview(password)

  •     }

  • ……

  • }

此时运行程序,会看到如图 2.21 所示的效果。当开发者轻拍文本框后,会自动弹出键盘,如图 2.22 所示。

技术分享

2.21   运行效果                                 2.22   运行效果

多行读写文本 —— 文本视图

文本视图也是输入控件,与文本框不同的是,文本视图可以让用户输入多行,如图 2.23 所示。在此图中字符串“说点什么吧”这一区域就是使用文本视图实现的,用户可以在此区域中写大量的文本内容。一般文本框视图使用 UITextView 实现。

技术分享

2.23   写日志

【示例 2-9 】以下将使用文本视图实现 QQ 中写说说并发表的功能。具体的操作步骤如下:

1 )创建一个 Single View Application 模板类型的项目,命名为 UITextView

2 )打开 Main.storyboard 文件,对主视图进行设计,效果如图 2.24 所示。

需要添加的视图以及对它们的设置如表 2-6 所示。

2-6   对视图对象的设置

技术分享

技术分享

2.24   主视图的效果

3 )打开 ViewController.swift 文件,编写代码,此代码实现的功能是写说说并发表的功能。代码如下:

  • import UIKit

  • class ViewController: UIViewController,UITextViewDelegate {

  •     let wtv=UITextView(frame: CGRectMake(0, 97, 375, 232))

  •     let rtv=UITextView(frame: CGRectMake(0, 372, 375, 232))

  •     let label=UILabel(frame: CGRectMake(3, 105, 123, 21))

  •     override func viewDidLoad() {

  •         super.viewDidLoad()

  •         // Do any additional setup after loading the view, typically from a nib.

  •         self.view.addSubview(wtv)                             // 添加文本视图

  •         label.text=" 说点什么吧 ..."                                 // 设置标签的文本内容

  •         label.enabled=false                                         // 禁用标签

  •         label.backgroundColor=UIColor.clearColor()

  •         wtv.delegate=self                                             // 设置文本视图的委托

  •         self.view.addSubview(label)

  •         self.view.addSubview(rtv)

  •         rtv.backgroundColor=UIColor.clearColor()

  •         rtv.editable=false                                                       // 禁用文本视图

  •         rtv.hidden=true                                                  // 隐藏文本视图

  • }

  • // 监听文字改变的消息

  • func textViewDidChange(textView: UITextView) {

  •     // 判断文本视图的内容是否为空

  •         if(wtv.text==""){

  •             label.text=" 说点什么吧 ..."

  •         }else{

  •             label.hidden=true

  •         }

  • }

  • // 隐藏键盘

  •     @IBAction func cancel(sender: AnyObject) {

  •          wtv.resignFirstResponder()

  • }

  • // 发表说说,隐藏键盘

  •     @IBAction func issue(sender: AnyObject) {

  •         rtv.hidden=false

  •         rtv.text=wtv.text                                                           // 设置文本视图的文本内容

  •         wtv.resignFirstResponder()

  •     }

  • ……

  • }

运行程序后,会看到如图 2.25 所示的效果。当开发者轻拍文本视图后,会自动弹出键盘,如图 2.26 所示。

技术分享

2.25   运行效果                                  2.26   运行效果

当开发者在文本视图中输入内容后,字符串“说点什么吧 ”就会自动消失,如图 2.27 所示。当轻拍发表按钮后,在文本视图中写入的内容就会显示在另一个文本视图中,并且键盘消失,如图 2.28 所示。

技术分享

2.27   运行效果                                   2.28   运行效果

本文选自: iOS 9应用开发基础教程大学霸内部资料,转载请注明出处,尊重技术尊重IT人!

?

版权声明:本文为博主原创文章,未经博主允许不得转载。

原文:http://blog.csdn.net/daxueba/article/details/47420991


【说明】本文章由站长整理发布,文章内容不代表本站观点,如文中有侵权行为,请与本站客服联系(QQ:254677821)!