##day one 学到UI章节,不再是之前自己创建类了,而是调用别人创建好的的类来完成一些事。 基本的套路就是由UIview这个类创建一个对象,然后添加到界面上,弄点颜色,最后在用一些方法调整一下该图形的位置和修改大小,这里重点讲解了一些方法: 1.frame改变坐标和大小(redView.frame = CGRectMake(0,0,0,0)) 2.center中心点的位置(redView.center = CGPointMake(0,0)) 3.bounds坐标和大小
4.transform 这是旋转变形 redView.transform = CGAffineTransformMakeRotation(CGFloat(M_PI/4)) 这是缩小放大 redView.transform = CGAffineTransformMakeScale(0.5,0.5) 这是平移 redView.transform = CGAffineTransformMakeTransLation(0,300) 可以产生几种形变 这里是三种形变 redView.transform = CGAffineTransformRotate(CGAffineTransformMakeScale(0.5, 0.5), CGFloat(M_PI/8)) redView.transform = CGAffineTransformTranslate(redView.transform, 0, 300) 这里是两种形变 let transLation = CGAffineTransformMakeTranslation(100, 0) redView.transform = CGAffineTransformScale(transLation, 0.5, 2) 这是第二种方法两种形变合并 let rotate = CGAffineTransformMakeRotation(0.2) let transLation1 = CGAffineTransformMakeTranslation(100, 100) redView.transform = CGAffineTransformConcat(rotate, transLation1) 利用红绿蓝三基色产生随机色 redView.backgroundColor = UIColor(red: 48/255.0, green: 128/255.0, blue: 49/255.0, alpha: 1) 创建灰色 redView.backgroundColor = UIColor(white: 0.4, alpha: 1)
##day two 根据tag值来区别或者拿一些特定的视图 这里是把UIview里面的所有属性给予给sub,而sub是有一个tag的数组,这样通过对数组的遍历然后视图不同的tag来获取对应不同的视图。
let sub = self.view.subviews //4.设置tag值,默认值为0,设置tag值的时候不是0 //用来区分不同的界面上不同的视图 redView.tag = 100 //拿到所有的子视图中的红色视图和黄色视图// for item in sub{ // //判断item是否是UIView类型// if item.isKindOfClass(UIView.self){ // print(item)// }// } //b. for item in sub{ if item.tag == 100{ print("红色视图") //将红色视图的背景颜色变成橙色 item.backgroundColor = UIColor.orangeColor() } else if item.tag == 101{ print("黄色视图") } }复制代码
一个视图只有一个父类,那么怎么获取负累捏,这里有个简单的办法
let superView = redView.superview superView?.backgroundColor = UIColor.blueColor()复制代码
视图之间的上下关系
//2.将指定的视图放到最上层 self.view.bringSubviewToFront(view2) //3.将指定的视图放到最下层 self.view.sendSubviewToBack(view1) //4.将指定的视图插入到另一个视图的上面 //前面的是指定的视图 后面的是另外一个视图 self.view.insertSubview(view2, aboveSubview: view3) //5.将指定的视图插入到另一个视图的下面 self.view.insertSubview(view2, belowSubview: view1)复制代码
4中动画效果UIView.animateWithDuration 还有个layer切圆角
//layer属性是负责视图的形状(显示) //切圆角 //当圆角的值为正方形边长的一半 就可以切成圆 self.subView.layer.cornerRadius = 50 //设置边框 self.subView.layer.borderWidth = 25 self.subView.layer.borderColor = UIColor.redColor().CGColor复制代码
label上的文字和它的关系
let ocStr = str as NSString //计算字符串的大小 //参数1:限制显示当前字符串的最大宽度和最大高度 //参数2:设置渲染方式 //参数3:确定文字的字体大小 //NSFontAttributeName -> 字体对应的key值 //NSForegroundColorAttributeName -> 文字颜色对应的key值 let strSize = ocStr.boundingRectWithSize(CGSizeMake(200, 10000000000), options: .UsesLineFragmentOrigin, attributes: [NSFontAttributeName:UIFont.systemFontOfSize(17)], context: nil).size 复制代码
这里主要讲了label的属性
//1.创建UILabel的对象 let label = UILabel(frame: CGRectMake(100,100,200,50)) //2.添加到界面上 self.view.addSubview(label) //3.设置背景颜色 label.backgroundColor = UIColor.yellowColor() //=========UILabel的专有属性============ //1.text属性 //设置LAbel上显示的文字 label.text = "赵坤鹏" //拿到label上显示的文字 print(label.text) //** //设置字体 //使用系统字体,设置字体大小默认是:17 label.font = UIFont.systemFontOfSize(40) //weight设置字体的粗细(0~1) label.font = UIFont.systemFontOfSize(17, weight: 0.5) //使用系统黑体,设置字体大小 label.font = UIFont.boldSystemFontOfSize(17) //使用系统斜体,设置字体大小 label.font = UIFont.italicSystemFontOfSize(17) //获取系统所有字体的字体名 print(UIFont.familyNames()) //**参数1;字体名 //参数2:字体大小 label.font = UIFont(name: "HYZhuanShuF", size: 40) //总结使用自己的字体的步骤: //1.将ttf文件拖到工程中 //2.在info。plist文件中添加键值对“Fonts provided by application”,将字体添加到系统字体库中 //3.通过提供字体名的构造方法来创建字体(先要找到自己添加的字体名) // //设置文字颜色 label.textColor = UIColor.redColor() //设置阴影颜色 label.shadowColor = UIColor.grayColor() //设置阴影的偏移效果 label.shadowOffset = CGSizeMake(-2, -1) //默认是左对齐 //设置文字的居中模式 -center //Right - 右对齐 // label.textAlignment = .Center //设置行数 label.numberOfLines = 5 //自动换行 label.numberOfLines = 0 //换行模式(以单词换行) label.lineBreakMode = .ByWordWrapping复制代码
##day three 主要讲的是两种图片创建方式 1.前者是创建小图 频繁使用的为最佳 但是要程序结束后才会销毁
2.后者是创建大图 不频繁使用的为最佳 不再使用的时候就销毁 节约内存的目的
//UIImageView:UIView //==========UIView的属性和方法========== //1.创建UIImageView对象 let imageView = UIImageView.init(frame: CGRectMake(0, 100, 300, 300)) //2.添加到界面上 self.view.addSubview(imageView) //3.设置背景颜色 imageView.backgroundColor = UIColor.yellowColor() //=========UImageView专有属性========= //1.image属性 //a.通过图片名去创建一个图片对象(注意:如果图片的格式是png,那么图片名的后缀可以省略。但是其他格式的图片的图片名的后缀不能省略) imageView.image = UIImage.init(named: "back2.jpg") //b.通过图片路径去创建一个图片对象 //将文件(除了swift文件)放到工程中,实质是放到了当前应用程序的包文件中 //(想要拿到工程中的图片路径先要获取包文件;) //拿到包中的指定的文件的路径 let imagePath = NSBundle.mainBundle().pathForResource("back2", ofType: "jpg") imageView.image = UIImage.init(contentsOfFile: imagePath!) //c.比较通过图片名和通过图片地址创建图片对象的两种方法: //(1).通过图片名创建的图片对象在程序结束后才会被销毁,只会创建一次;通过图片地址创建图片对象是当前图片对象不再使用的时候就销毁 //(2)使用图片名创建图片的情况:创建小图标的时候;在工程中会重复使用的图片 //(3)使用图片地址创建图片对象的情况:不会频繁的在多个界面出现的大图 //2.内容模式 imageView.contentMode = .ScaleToFill复制代码
##这里主要讲了利用定时器和图片组一起组合而成的运动项目 难点就是注意调用定时器方法的时候有参数注意:一个参数一个: 将图片弄到数组里面 便利组合 然后放在animationImages里面,从而实现动画效果
class ViewController: UIViewController { //MARK: - 属性 var imageView = UIImageView() //MARK: - 生命周期 override func viewDidLoad() { super.viewDidLoad() self.creatImageView() //创建一个定时器,并且自动开启 //参数1:定时时间 //参数2:调用方法的对象 //参数3:存储定时时间到了以后需要调用的方法(可以不带参也可以带参,但是如果带参只能带一个参,并且参数类型是NSTimer类型) //参数4:给当前的NSTimer的userInfo属性赋的值(一般写nil) //参数5:是否重复 //功能:每隔0.1秒,self去调用一次timerAction方法 NSTimer.scheduledTimerWithTimeInterval(0.1, target: self, selector: "timerAction:", userInfo: "aaa", repeats: true) } //定时器方法 //参数:当前定时器 func timerAction(timer:NSTimer) { print(timer.userInfo) self.imageView.frame.origin.x += 3 //判断小鸟是否飞到了屏幕边缘 if self.imageView.frame.origin.x >= self.view.bounds.width - self.imageView.bounds.width { //暂停定时器 timer.fireDate = NSDate.distantFuture() //让定时器继续 //timer.fireDate = NSDate.distantPast() } } //创建imageView func creatImageView() { //1.创建一个UIImageView对象 //通过图片去创建一个imageView;UIImageView的大小是图片的大小,坐标是(0,0) imageView = UIImageView.init(image: UIImage.init(named: "DOVE 1.png")) //2.显示在界面上 self.view.addSubview(imageView) //3.使用UIImageView播放帧动画 //a.设置帧动画数组 //创建一个空的图片数组 var imageArray = [UIImage]() //通过for循环创建18张图片 for item in 1...18 { //拼接图片名 let imageName = "DOVE \(item).png" //创建对应的图片 let image = UIImage.init(named: imageName) //将图片存到数组中 imageArray.append(image!) } imageView.animationImages = imageArray //b.设置动画时间,单位秒 imageView.animationDuration = 1 //c.设置动画的重复次数(默认是0->无限循环) imageView.animationRepeatCount = 0 //d.开始动画 imageView.startAnimating() } }复制代码
这里主要讲了利用UIButton来实现一些功能 给按钮弄上图片的方法和文字当时最重要的是点击按钮事件 同时跳转到按钮上的方法 实现一些事情
//MARK: - 图片文字按钮 func imageTitleBtn() { //a.同时设置title和image属性,显示是图片在左,文字在右 //b.同时设置title和groundImage,显示是图片在下层,文字在上层 //1.创建一个按钮对象 let btn1 = UIButton.init(frame: CGRectMake(100, 300, 100, 50)) self.view.addSubview(btn1) //2.设置title btn1.setTitle("标题", forState: .Normal) btn1.setTitleColor(UIColor.whiteColor(), forState: .Normal) //3.设置图片 //btn1.setImage(UIImage.init(named: "luffy1"), forState: .Normal) btn1.setBackgroundImage(UIImage.init(named: "luffy2"), forState: .Normal) //4.添加事件 btn1.addTarget(self, action: "btnAction:", forControlEvents: .TouchUpInside) } //MARK: - 图片按钮 func imageButton() { //1.创建一个按钮对象 let imageBtn = UIButton.init(frame: CGRectMake(100, 200, 80, 80)) //2.添加到界面上 self.view.addSubview(imageBtn) //3.设置图片 //参数1:图片 //参数2:状态(正常、高亮、选中、不可用) imageBtn.setImage(UIImage.init(named: "luffy1"), forState: .Normal) //4.添加按钮点击事件 imageBtn.addTarget(self, action: "btnAction:", forControlEvents: .TouchUpInside) } //MARK: - 文字按钮 func titleButton() { //UIButton:UIControl:UIView //UIButton上有一个titleLabel专门负责按钮上文字的显示;有一个imageView专门负责按钮上图片的显示 //=========UIView的属性和方法======== //1.创建UIButton对象 let titleBtn = UIButton.init(frame: CGRectMake(100, 100, 100, 50)) //2.添加到界面上 self.view.addSubview(titleBtn) //3.设置背景颜色 titleBtn.backgroundColor = UIColor.redColor() //=========UIButton专有的属性和方法====== //1.设置按钮上显示的文字(给不同的状态设置不一样的文字) //参数1:想要在按钮上显示的文字 //参数2:状态 //Normal -> 正常状态(按钮正常显示,没有被点击或者按下的时候) //Highlighted ->高亮(按钮被按下,没有弹起来的时候的状态) //Selected -> 选中状态 //Disabled -> 不可用状态(按钮不能被点击) titleBtn.setTitle("正常", forState: .Normal) titleBtn.setTitle("高亮", forState: .Highlighted) titleBtn.setTitle("选中", forState: .Selected) titleBtn.setTitle("不可用", forState: .Disabled) //2.设置当前按钮是否选中(默认是false->非选中) titleBtn.selected = false //3.设置当前按钮是否可用(默认是true->可用) titleBtn.enabled = true //4.设置文字颜色(给不同的状态设置不一样的颜色) titleBtn.setTitleColor(UIColor.yellowColor(), forState: .Normal) titleBtn.setTitleColor(UIColor.lightGrayColor(), forState: .Disabled) //注意:按钮上的文字和文字颜色,必须通过对应的set方法去根据状态去设置。其他和文字相关的属性可以通过拿到titleLabel去设置 //5.设置按钮上的文字字体 titleBtn.titleLabel?.font = UIFont.systemFontOfSize(12) //6.设置按钮上的文字的对齐方式 titleBtn.titleLabel?.textAlignment = .Right //!!!7.给按钮添加事件 //参数1:调用方法的对象 //参数2:指定事件发生后参数1要去调用的方法(这个方法可以不带参,如果带参只能带一个,并且参数的类型是UIButton类型),实参就是当前添加事件的按钮本身 //参数3:事件 //TouchDown -> 按下事件 //功能:当按钮被按下的时候,self会去调用btnAction方法 //TouchUpInside ->按下弹起事件 //功能:当按钮被按下弹起来的时候,self会去调用btnAction方法 titleBtn.addTarget(self, action: "btnAction:", forControlEvents: .TouchUpInside) } //MARK: - 按钮点击 func btnAction(btn:UIButton) { //CGFloat(arc4random()%256)/255 //设置按钮的背景颜色是随机色 btn.backgroundColor = UIColor.init(red: CGFloat(arc4random()%256)/255, green: CGFloat(arc4random()%256)/255, blue: CGFloat(arc4random()%256)/255, alpha: 1) }}复制代码
由于按钮是由图片和文字组合而成的,这里是制作按钮按照一定比例组合而成
//图片高度是整个按钮高度的4/5;文字高度是整个按钮高度的1/5 //功能:设置button上的imageView的坐标和大小 //参数1:当前按钮的范围(只需要大小) //返回值:重新设置的图片的坐标和大小 override func imageRectForContentRect(contentRect: CGRect) -> CGRect { let x:CGFloat = 0 let y:CGFloat = 0 let w:CGFloat = contentRect.size.width let h:CGFloat = contentRect.size.height * 4 / 5 return CGRectMake(x, y, w, h) } //功能:设置button上的titleLabel的坐标和大小 //参数1:当前按钮的范围(只需要大小) //返回值:重新设置的文字的坐标和大小 override func titleRectForContentRect(contentRect: CGRect) -> CGRect { let x:CGFloat = 0 let y:CGFloat = contentRect.size.height * 4 / 5 let w = contentRect.size.width let h = contentRect.size.height / 5 return CGRectMake(x, y, w, h) //1.创建按钮对象 let btn = YTButton(frame: CGRectMake(100,100,200,220)) //2.设置文字 btn.setTitle("点我试试", forState: .Normal) btn.setTitleColor(UIColor.redColor(), forState: .Normal) btn.titleLabel?.textAlignment = .Center //3.设置图片 btn.setImage(UIImage.init(named: "luffy4"), forState: .Normal) //4.添加到界面上 self.view.addSubview(btn) //5.添加按钮点击事件 btn.addTarget(self, action: "btnAction", forControlEvents: .TouchDown) } //MARK: - 按钮点击事件 func btnAction() { print("我就点啦!你想怎么的?") } }复制代码
##day four ##这里主要介绍一下文本框的使用 1.文本框的创建(颜色 大小 加入到界面上)
let textField = UITextField(frame: CGRectMake(100,100,200,50))self.view.addSubview(textField)textField.backgroundColor = UIColor.redColor()复制代码
2.文本框的一些具体内容 文字的颜色,字体的大小
textField.textColor = UIColor.brownColor()textField.font = UIFont.systemFontOfSize(14)复制代码
3.这里还有几个实用的方法 4.对齐方式(左对齐 右对齐 居中 注意 这里是枚举)和占位文字(就是框框里面有几个可以提醒的文字)
textField.placeholder = "请输入账号"textField.textAlignment = .Center复制代码
5.文本框的表面样式设计(注意是枚举)和右边叉叉清理按钮(可以全部一次性清理完),左右视图
textField.borderStyle = .RoundedRecttextField.clearButtonMode = .Alwayslet imageView = UIImageView(frame: CGRectMake(0,0,40,40))imageView.image = UIImage(named: "QFImage_2016-08-24_16.45.52")textField.leftView = imageView//设置左视图的显示模式(确定什么时候显示,默认从不显示)textField.leftViewMode = .Alwayslet rightLabel = UILabel(frame: CGRectMake(0,0,40,40))rightLabel.text = "你好"textField.rightView = rightLabeltextField.rightViewMode = .Always复制代码
6.设置代理 6个方法
textField.delegate = self //在textField将要开始编辑的时候会自动调用 //参数:当前协议定义的委托 //返回值:设置当前的textField是否可以进行编辑(默认是true) //1. func textFieldShouldBeginEditing(textField: UITextField) -> Bool{ print("将要开始编辑") return true } //2. //当文本输入框已经开始编辑的时候会自动调用这个方法 func textFieldDidBeginEditing(textField: UITextField) { print(textField.text) print("已经开始编辑") } //3.当文本输入框将要结束编辑的时候会自动调用这个方法 //返回:设置当前的textField是否可以结束编辑(默认是true) func textFieldShouldEndEditing(textField: UITextField) -> Bool { //要求文本输入框的文字长度要大于等于8的时候才能结束编辑 //对将要输入的密码进入限定达到某个要求才能离开============= if textField.text?.characters.count >= 8{ return true } return false } //4.当文本输入框已经结束编辑的时候会自动调用这个方法(光标消失的时候) // // // func textFieldDidEndEditing(textField: UITextField) { } //5.当点击textField弹出来的键盘上的按钮的时候会自动调用这个方法 //参数1:委托 //参数2;当前输入字符所在的位置 //参数3;当前输入的字符串(在键盘上按的键的值) //返回值:是否可以改变textField的text属性();false ->键盘上的按键无效 //(用来设置密码验证很好) func textField(textField: UITextField, shouldChangeCharactersInRange range: NSRange, replacementString string: String) -> Bool { print(range) print(string) if string == "0"{ print("进入秘密页面") } return true } //6.当按键盘的返回按钮的时候,会自动调用 func textFieldShouldReturn(textField: UITextField) -> Bool { print("fan") //收起键盘(结束编辑) //1.放弃第一响应者 textField.resignFirstResponder() //2.直接结束指定的textField编辑 textField.endEditing(true) //3.让self.view上的所有的子视图都结束编辑 self.view.endEditing(true) return true } 复制代码
##day five
1.UISwitch 开关
//1.创建开关对象 //UISwitch:UIControl:UIView let sw = UISwitch(frame:CGRectMake(100,100,100,50)) self.view.addSubview(sw) //核心属性:开关状态(默认是:关) //设置开关的状态 sw.on = true//false ->关 sw.setOn(false, animated: true) //拿到当前的状态 print(sw.on) //核心方法 //参数1:调用方法的对象 //参数2;指定的事件发生后参数1要去调用的方法对应的selector //参数3:事件 //功能:当开关的值发生改变的时候,self会去调用用switchAction方法 sw.addTarget(self, action: "switchAction:", forControlEvents: .ValueChanged) //设置开关开的颜色(默认是绿色) sw.onTintColor = UIColor.redColor() //s设置开关关的边框的颜色 sw.tintColor = UIColor.purpleColor() //设置开关上滑块的颜色 sw.thumbTintColor = UIColor.yellowColor()复制代码
2.UISlider 滑条
//创建滑条对象 let slider = UISlider(frame: CGRectMake(100,160,200,20)) self.view.addSubview(slider) //核心属性:值(滑块的位置对应的值) //value;滑块当前的位置对应的值 默认是0~1 slider.value = 50 //最小值和最大值 slider.minimumValue = 0 slider.maximumValue = 100 //核心方法 slider.addTarget(self, action: "sliderAction:", forControlEvents: .ValueChanged) //颜色属性 slider.thumbTintColor = UIColor.yellowColor() //添加图片属性// slider.maximumValueImage = UIImage(named: "屏幕快照 2016-08-26 上午9.02.04") slider.setThumbImage(UIImage(named: "luffy1"), forState: .Normal) //是否连续改变// slider.setThumbImage(UIImage(named: "luffy2"), forState: .Highlighted) slider.continuous = false复制代码
3.UIStepper 步进器
//1.创建步进器对象 let stepper = UIStepper(frame: CGRectMake(100,200,100,50)) self.view.addSubview(stepper) //核心属性:值 //当前值 stepper.value = 1 print(stepper.value) //最大值 stepper.maximumValue = 10 //最小值 stepper.minimumValue = 0 //步进(每按一下加或者减,增加/减少的值) stepper.stepValue = 1//步进值必须大于0 //核心方法 stepper.addTarget(self, action: "stepperAction:", forControlEvents: .ValueChanged) //设置值是否连续改变(按住不放的时候) stepper.continuous = false //是否重复 false -> 按住不放的时候不计数;true->按住不放的时候计数(默认) stepper.autorepeat = false //设置填充颜色 stepper.tintColor = UIColor.redColor()复制代码
4.进度条
//1.创建进度条对象 let progress = UIProgressView(frame: CGRectMake(100,300,200,20)) self.view.addSubview(progress) //核心属性 //设置当前进度 progress.progress = 0.5 progress.setProgress(0.6, animated: true) progress.progressImage = UIImage(named: "luff1") progress.progressTintColor = UIColor.redColor() progress.tag = 100 复制代码
5.活动指示器
//1.创建对象 let activity = UIActivityIndicatorView(frame: CGRectMake(100,360,50,50)) self.view.addSubview(activity) //3.想要让活动指示器显示,必须让它开始动画 activity.startAnimating() //4.停止动画 ->活动指示器酒会消失// activity.stopAnimating()// activity.activityIndicatorViewStyle = .WhiteLarge 复制代码
6.多段选择器
//1.创建多段选择器对象 //参数1:分段选择器上的内容对应的数组 let segement = UISegmentedControl(items: ["海贼王","火影忍者","死神"]) segement.frame = CGRectMake(100, 400, 200, 50) self.view.addSubview(segement) //核心属性 //每个分段上的内容 //每个分段上的内容 ->通过创建分段选择器的时候去设置 //当前选中的分段的下标(从0开始) segement.selectedSegmentIndex = 1 segement.addTarget(self, action: "segementAction:", forControlEvents: .ValueChanged) //拿到分段选择器的分段数 print(segement.numberOfSegments) segement.tintColor = UIColor.whiteColor()复制代码
让进度条跟着画条动
func sliderAction(slider:UISlider){ print(slider.value) let progress = self.view.viewWithTag(100) as! UIProgressView let t = slider.value/(slider.maximumValue - slider.minimumValue) progress.setProgress(t, animated: true) }复制代码
7.UIAlertController 警报框
//1.表单视图 //参数1:标题 //参数2; //参数3:ActionSheet->表单,Alert ->警告框 // // let laterController = UIAlertController(title: "标题", message: nil, preferredStyle: .Alert) //2.添加到界面 //参数1:需要显示的视图控制器 //参数2:风格 //参数3:当前选项对应的按钮呗点击后会执行的代码对应的闭包 self.presentViewController(laterController, animated: true, completion: nil) //Destructive风格 let okAction = UIAlertAction(title: "确定", style: .Destructive, handler: nil) //Cancel的风格 let noAction = UIAlertAction(title: "取消", style: .Cancel, handler: nil) laterController.addAction(okAction) laterController.addAction(noAction)复制代码
8.UITextView 文本框
var textView = UITextView() // - textView override func viewDidLoad() { super.viewDidLoad() //1.创建textView对象 // UITextView:UIScrollView:UiView textView = UITextView(frame: CGRectMake(100, 100, 200, 70)) self.view.addSubview(textView) textView.backgroundColor = UIColor.redColor() //text属性 textView.text = "dfdffddfd" //5.设置是否可以选中 textView.selectable = true //6.是否可以选中删除所有 textView.clearsOnInsertion = true //其他的属性和方法参考UITextField } override func touchesBegan(touches: Set, withEvent event: UIEvent?) { //获取选中的范围 let range = textView.selectedRange print(range) }复制代码