最终的效果:

<1>第一个场景:

1.本地化 界面简体中文化

Supporting Files - info.plist

Localization native development region  本地的编程的地区

选择China,这样的话,用到系统的UI组件,就会变成中文的样式。

2.文本框占位符

属性:Placeholder

另外需要积累的是:Clear Button

Appears while editing :当你输入的时候会出现这个(清除)按钮

3.自动布局

添加文本框顶部,左侧和右侧间距约束

距离左边的:

距离顶部的:

距离右边的:

距离底部的:

<2>第二个场景:

1.从控件库中添加Table View Controller之后,因为要打开app第一个界面就是度假清单的列表,所以要:

选择这个is initial view controller(初始场景控制器),然后就会出现剪头的位置在Table View Controller之前:

这样调换场景秩序完成。

<其实也可以直接拖拽那个剪头到你想要作为开头场景的视图控制器之前,可以试试看>

2.静态数据

设置表格视图属性内容-静态单元格样式-基本(带标签)

Dynamic Prototypes(动态)就是在程序代码中 设置表格有哪些内容。Static Cells静态。

然后选中Table View Cell然后在属性中找到stye改成Basic基本样式:

然后双击界面显示的title,可以输入文字,比如“北京”,然后如果要复制列表,就按着option,然后选择一个列表框,拖拽复制一个列表。

<3>场景间的转场-过渡(segue)

然后双击导航条,可以输入文字:

找到这个Bar Button item组件,略看英文就知道,这个组件可以添加到导航条上使用:
然后拖拽到导航条上:

然后选择style,选中add,item就会显示 + 的符号:

先来运行一下看看:

同样的为第一次做的界面视图(通过设置场景秩序已经不是第一个开启的界面了:)增加一个导航条:

然后是为按钮添加事件:

(deprecated是废弃的意思,这里两个废弃的是之前ios7的功能)

在这里我们选择show,因为show是堆栈,可以返回的,为了显示出返回按钮,要把,第二个显示的新增度假地视图的上面的两个按钮删除,然后选中这个第一个度假地列表的视图上的导航条,然后在右边属性的back button后面添加:退出 (或者返回两字),也就是说这里的back button的作用对象是选中的导航条,而不是在选中的导航条上添加back button作用的按钮组件。

然后运行,点击+之后就会出现(这里我后面改成"返回"了):

然后,我们把第二个视图按钮添加回到导航条上,编辑和添加作用的两个按钮,然后重新为第一个导航条上的添加按钮重新设置事件:

选中:persent modally,然后注意剪头上的图标变化成简单的正方体了:

然后运行操作的时候,就会发现第二个视图是从下往上出现的。好了,视图转场我们先到这里。

<4>定制视图控制器

添加一个类来自定义定制视图控制器:

将第二个视图(新增度假地)绑定到这个自定义的类:

然后同样的为第一个表格控制器绑定一个类:

<5>反向过渡

在VacationListTableViewController.swift添加一个反向事件:

注意:上面注释的地方就有一样的部分,如果不记得具体怎么写,可以参考或者拷贝。

然后回到viewcontroller:

然后就可以绑定到前面写的方法了。

同样的,为右边add按钮也添加绑定到那个方法:

这样做的目的就是实现:当我们按取消就退出这个页面到前面一个页面,或者按add按钮也能退出到前面一个页面。从而实现了取消当前新增业务或者完成当前新增业务的同时都能回到前面一个页面的逻辑。

这样就完成了一个反向过渡。

<6>完整界面

将第一个列表界面的table view选中,然后将之间静态模式改为动态模式,这样就可以通过代码来操作列表。

<7>实现(implement)使用设计模式

目标-操作(windows里叫 事件-驱动)

接下来我们设计MVC中的C,也就是数据存储结构的设计。

 
 
 
 
 
 
 

 import Foundation

 class Vacation {
//两个属性
var place = ""
var visited = false
}
 
 
 import UIKit

 class VacationListTableViewController: UITableViewController {

     //度假地数组
var vacationList = [Vacation]() func loadInitData(){
addVacetion("南昌")
addVacetion("鹰潭")
addVacetion("婺源")
addVacetion("上饶")
addVacetion("赣州")
}
func addVacetion(place:String){
let vac = Vacation()
vac.place = place
vacationList.append(vac)
} override func viewDidLoad() {
super.viewDidLoad() //6.载入的时候能够引用自身的组件
self.navigationItem.leftBarButtonItem = self.editButtonItem() //1.思考一下,应用程序的流程中的最开始,一运行是不是就要加载要显示的数据,这个数据来源可以是网络,也可以是本地磁盘,也可以是自定义数据的类中(model)
loadInitData() // Uncomment the following line to preserve selection between presentations
// self.clearsSelectionOnViewWillAppear = false // Uncomment the following line to display an Edit button in the navigation bar for this view controller.
// self.navigationItem.rightBarButtonItem = self.editButtonItem()
}
//7.设置表格编辑时的动画
override func setEditing(editing: Bool, animated: Bool) {
super.setEditing(editing, animated: true)
tableView.setEditing(editing, animated: true)
}
//8.
override func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
if editingStyle == UITableViewCellEditingStyle.Delete{
//删除度假数组所在行
vacationList.removeAtIndex(indexPath.row)
//删除单元格所在行
tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: UITableViewRowAnimation.Top)
}
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
} // MARK: - Table view data source
//******************************表格的部分数**********************************************//
override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
// #warning Potentially incomplete method implementation.
// Return the number of sections.
//2.返回表格的数量,这里表格有一个部分,我就return 1
return
}
//******************************表格的部分数**********************************************//
override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
// #warning Incomplete method implementation.
// Return the number of rows in the section.3.返回的是表格的行数,这里就是我们使用的数组的长度
return vacationList.count
} override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCellWithIdentifier("PCell", forIndexPath: indexPath) as! UITableViewCell//4.这里加载的是单元格的样式,这里呢我们就用已有的单元格的样式
let v = vacationList[indexPath.row]
// Configure the cell...
cell.textLabel?.text = v.place if v.visited {
cell.accessoryType = UITableViewCellAccessoryType.Checkmark//☑️
}else{
cell.accessoryType = UITableViewCellAccessoryType.None
} return cell
}
//添加的方法
override func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
//5.这里的方法就是按下单元格的一行,就会执行的方法
// let v1 = vacationList[indexPath.row]
// v1.visited = !v1.visited
setVisited(indexPath.row) //这里要显示勾选和未勾选的状态
tableView.deselectRowAtIndexPath(indexPath, animated: false)
tableView.reloadData()//重新加载数据
}
func setVisited(n:Int){
let v = vacationList[n]
v.visited = !v.visited
println(v.place+"\(v.visited)")
}
/*
// Override to support conditional editing of the table view.
override func tableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath) -> Bool {
// Return NO if you do not want the specified item to be editable.
return true
}
*/ /*
// Override to support editing the table view.
override func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
if editingStyle == .Delete {
// Delete the row from the data source
tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Fade)
} else if editingStyle == .Insert {
// Create a new instance of the appropriate class, insert it into the array, and add a new row to the table view
}
}
*/ /*
// Override to support rearranging the table view.
override func tableView(tableView: UITableView, moveRowAtIndexPath fromIndexPath: NSIndexPath, toIndexPath: NSIndexPath) { }
*/ /*
// Override to support conditional rearranging of the table view.
override func tableView(tableView: UITableView, canMoveRowAtIndexPath indexPath: NSIndexPath) -> Bool {
// Return NO if you do not want the item to be re-orderable.
return true
}
*/ /*
// MARK: - Navigation // In a storyboard-based application, you will often want to do a little preparation before navigation
override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
// Get the new view controller using [segue destinationViewController].
// Pass the selected object to the new view controller.
}
*/
@IBAction func unwindToList(segue: UIStoryboardSegue){
//这个方法就是视图退回到这个方法所属的视图的时候,就会执行的方法
//然后我们通过这个方法获取退回视图的前一个视图的内容
let source = segue.sourceViewController as! AddVacationViewController
let v1 = source.vacation
println(v1.place)
if v1.place != "" {
vacationList.append(v1)
}
println(vacationList)
//然后要刷新表格,但是表格会自动刷新
// loadInitData()
tableView.reloadData()
} }
 import UIKit

 class AddVacationViewController: UIViewController {
@IBOutlet weak var textField: UITextField! @IBOutlet weak var doneButton: UIBarButtonItem!
//1.初始化
var vacation = Vacation() override func viewDidLoad() {
super.viewDidLoad() // Do any additional setup after loading the view.
} override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
} // MARK: - Navigation // In a storyboard-based application, you will often want to do a little preparation before navigation
override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
// Get the new view controller using segue.destinationViewController.
// Pass the selected object to the new view controller.过渡前的准备
if sender as! NSObject == doneButton{
if (!textField.text.isEmpty) { vacation.place = textField.text
println(vacation.place)
}
}
}
}
 
 
 
 
 

小波说雨燕 第三季 构建 swift UI 之 度假清单 学习笔记的更多相关文章

  1. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(六)Picker View视图 学习笔记

    想对PickerView进行操作,只能在代码中操作. 下面 ,再添加三个label组件,然后将所有组件配置到代码中(看代码),然后要实现对PickerView的操作,就要实现它的DataSource协 ...

  2. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(五)Image View视图 学习笔记

    留下两个问题:1.后面涉及到的异常不知道原因.2.动态图片到了程序里面就不动了.       然后:   上面是有问题的,下面是没有问题的了.    代码(另外简单写的代码,纠正了那个错误): imp ...

  3. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(四)Alert View视图 学习笔记

    当我们的应用电量不足的时候,就需要警告提示,那么我们可以用Alert View视图 实现:    

  4. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(三)Activity Indicators视图 学习笔记

    当我们应用程序执行一个比较耗时的操作,我们需要给用户一个提示,那么这个提示比较好的方式方法呢就是  进度条  或者  一个齿轮转.我们就需要Activity Indicators组件 Indicato ...

  5. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(二)ActionSheet视图 学习笔记

    action动作 sheet表 其实就是一种菜单 参数:1代理:谁去代理它2取消按钮标题3这个按钮标题会自动变成红色4添加设置其他按钮(不想加,设置为nil)   然后我们为这些按钮添加点击事件:   ...

  6. 小波说雨燕 第三季 构建 swift UI 之 UI组件集-视图集(一)视图共性 学习笔记

    如果想进行自定义的配置,可以继承基类UIView. 地图app中需要多点触动Multiple Touch, opaque不透明的 hidden隐藏的 比如下载的进度条,如果下载完毕,可以通过设置这个属 ...

  7. DirectX 9 UI三种设计学习笔记:文章4章Introducing DirectInput+文章5章Wrapping Direct3D

           本文从哈利_创.转载请注明出处.有问题欢迎联系本人!        邮箱:2024958085@qq.com 上一期的地址: DX 9 UI设计学习笔记之二 第4章 Introducin ...

  8. BZOJ 2038: [2009国家集训队]小Z的袜子(hose)【莫队算法裸题&&学习笔记】

    2038: [2009国家集训队]小Z的袜子(hose) Time Limit: 20 Sec  Memory Limit: 259 MBSubmit: 9894  Solved: 4561[Subm ...

  9. 从零开始构建并编写神经网络---Keras【学习笔记】[1/2]

    Keras简介:   Keras是由纯python编写的基于theano/tensorflow的深度学习框架.   Keras是一个高层神经网络API,支持快速实验,能够把你的idea迅速转换为结果, ...

随机推荐

  1. R Language

    向量定义:x1 = c(1,2,3); x2 = c(1:100) 类型显示:mode(x1) 向量长度:length(x2) 向量元素显示:x1[c(1,2,3)] 多维向量:multi-dimen ...

  2. Kafka集群部署

    一. 关于kafka Kafka是一种高吞吐量的分布式发布订阅消息系统,它可以处理消费者规模的网站中的所有动作流数据. 这种动作(网页浏览,搜索和其他用户的行动)是在现代网络上的许多社会功能的一个关键 ...

  3. NPTL 线程同步方式

    NPTL提供了互斥体 pthread_mutex_t 类型进行线程同步,防止由于多线程并发对全局变量造成的不正确操作.使用 pthread_mutext_t 对数据进行保护已经可以实现基本的数据同步, ...

  4. EPANET中读取INPUT文件的函数文件——INPUT3.C

    /* ********************************************************************** INPUT3.C -- Input data par ...

  5. spring AspectJ的Execution表达式

    Aspectj切入点语法定义 在使用spring框架配置AOP的时候,不管是通过XML配置文件还是注解的方式都需要定义pointcut"切入点" 例如定义切入点表达式  execu ...

  6. javascript中&&和||的区别

    javascript中&&和||的区别 &&和||操作符两边不是布尔类型时,系统会转换成布尔类型值再计算(空字符串.null.0都会被转成false),结果本身不变. ...

  7. .Net魔法堂:史上最全的ActiveX开发教程——开发篇

    一.前言 在设计某移动内部自动化运维平台时,经综合考虑终端机性能和功能需求等因素后,决定采用B/S模式,并且浏览器通过ActiveX组件实现与服务器Agent作P2P的通讯.好处,整个平台以网页形式存 ...

  8. 四、Handler(WSGIHandler)

    1.1       类视图关系 Handler主要负责处理HTTP请求,并生成相应的相应,process_request,process_response是两个最主要的成员.下图是WSGIHandle ...

  9. SeaJS 模块化加载框架使用

    SeaJS 是一个遵循 CMD 规范的模块化加载框架 CommonJS,CMD,AMD等规范后文会提到,这里主要先了解如何在代码中使用. 如果你有使用过nodejs ,那么理解起来就容易多了. 我们通 ...

  10. Diy页面服务端渲染解决方案

    1. 问题由来 在移动互联网电商领域,运营每天需要搭建多个促销页面来吸引用户去点击去购买,一开始程序员临时写个新页面去实现,可这些页面可以用几次就不用了,每次创建新页面去实现费时费力,而且,电商的运营 ...