【Swift4】(8) 简单使用Storyboard | 上手练习一个小app

【Swift4】(8) 简单使用Storyboard | 上手练习一个小app | 跑个流程

2022-05-29 322

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 【Swift4】(8) 简单使用Storyboard | 上手练习一个小app | 跑个流程

开始

create xcode project
Main.storyboard 类似一个电影中的故事板(以图片呈现情节)，在Xcode中是一个UI设计的主画面，APP的外观

右下角，show the Object Library 供设计使用的小元件
将小元件拖到Storyboard上，点选该元件，右侧’Show the Attributes inspector’会出现该元件的属性设置

ViewControllerller.swift 编码工作
点选项目根目录，显示项目信息，基础设置
playground
storyboard 如何在不同分辨率大小的屏幕上，设计的元件能达到理想的效果、自适应？

固定元件到屏幕边缘的x,y位置—>点选元件+‘control’键，拉至屏幕，弹出选框，选择"xxx Space To Safe Area"

图片.png

ViewController

MVC

图片.png

创建一个textInput ,类别为UITextField。

图片.png

IBOutlet : Swift的源代码创建的变数，这个变数是连接着某个UI元件
IBAction : 函数，当某个UI有Event事件发生时，会执行这个函数。

这样就会建立起UIView和Controller之间的联系。

下面这个例子，将输入的小写，转换为大写。

图片.png

MyViewController.swift

//核心代码
@IBOutlet weak var textInput: UITextField!
@IBOutlet weak var label: UILabel!
@IBAction func onUpdateLabelPressed(_ sender: Any) {    
    label.text = textInput.text?.uppercased()
}

实例

产生一个随机数

图片.png

//核心代码
@IBOutlet weak var textInput: UITextField!
@IBOutlet weak var label: UILabel!
@IBAction func onUpdateLabelPressed(_ sender: Any) {
        label.text = textInput.text?.uppercased()
}