UI阶段第二天

一脸懵逼的我_。

UIView父子视图

还是通过代码来理解吧：

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
       
        //1.创建一个UIView对象
        let redView = UIView.init(frame: CGRectMake(100, 100, 200, 200))
        //2.设置背景颜色
        redView.backgroundColor = UIColor.redColor()
        
        //3.添加到界面上
        //self.view就是redView的父视图，redView就是self.view的子视图
        self.view.addSubview(redView)
        
        //4.设置tag值,默认都是0.设tag值的时候值必须要大于0
        //tag的作用是用来区分界面上不同的视图
        redView.tag = 100
        
        //MARK: - 父子视图的特点和方法
        //再创建一个黄色视图
        let yellowView = UIView.init(frame: CGRectMake(0, 0, 50, 50))
        yellowView.backgroundColor = UIColor.yellowColor()
        yellowView.tag = 101
        
        //1.一个视图只有一个父视图，可以有多个子视图
        //连续将同一个视图添加到两个视图上，最后一次添加有效
        redView.addSubview(yellowView)
        self.view.addSubview(yellowView)
        
        //2.获取一个视图的父视图
        let superView = redView.superview
        superView?.backgroundColor = UIColor.greenColor()
        
        //3.获取一个视图的所有的子视图
        let subViews = self.view.subviews
        //拿到所有的子视图中的红色视图和黄色视图
        //a.
        for item in subViews {
            
            //判断item是否是UILabel类型的。如果是就返回true,如果不是就返回false
            if item.isKindOfClass(UILabel.self) {
                print(item)
            }
        }
        //b.
        for item in subViews {
            
            if item.tag == 100 {
                print("红色视图")
                //将红色视图的背景颜色变成橙色
                item.backgroundColor = UIColor.orangeColor()
            }
            
            if item.tag == 101 {
                
                print("黄色视图\(item)")
            }
        }
        
        //4.通过tag值拿到指定的子视图
        let subView2 = self.view.viewWithTag(101)
        subView2?.frame.origin.y = 100
        
    }
}

视图的层次关系

代码示例：

mport UIKit

class ViewController: UIViewController {

    //MARK: - 生命周期方法
    override func viewDidLoad() {
        super.viewDidLoad()
        
        self.creatUI()
    }
    
    //MARK: - 创建界面
    func creatUI() {
        
        //结论:在一个视图上，添加多个子视图的时候，子视图之间如果有公共的部分。那么后添加的子视图会覆盖先添加的
        //1.一般情况下，如果想要将一个视图显示在最下面，就最先添加。想要显示在最上面就最后添加
        //创建视图
        let view1 = self.creatView(CGRectMake(50, 100, 100, 100), backColor: UIColor.yellowColor())
        let view2 = self.creatView(CGRectMake(100, 150, 100, 100), backColor: UIColor.redColor())
        let view3 = self.creatView(CGRectMake(150, 200, 100, 100), backColor: UIColor.greenColor())
        let view4 = self.creatView(CGRectMake(180, 130, 100, 100), backColor: UIColor.purpleColor())
        
        
        //2.将指定的视图放到最上层
        self.view.bringSubviewToFront(view2)
        
        //3.将指定的视图放到最下层
        self.view.sendSubviewToBack(view2)
        
        //4.将指定的视图插入到另一个视图的上面
        self.view.insertSubview(view2, aboveSubview: view3)
        
        //5.将指定的视图插入到另外一个视图的下面
        self.view.insertSubview(view2, belowSubview: view1)
    }
    
    //创建视图
    func creatView(frame:CGRect,backColor:UIColor)->UIView {
        //创建视图对象
        let subView = UIView.init(frame: frame)
        //设置背景颜色
        subView.backgroundColor = backColor
        //添加到界面上
        self.view.addSubview(subView)
        //将创建的视图返回
        return subView
    }

}

UIView动画

代码示例：

import UIKit

class ViewController: UIViewController {

    //MARK: - 属性
    let subView = UIView()
    let subView2: UIView? = nil
    
    //MARK: - 生命周期
    override func viewDidLoad() {
        super.viewDidLoad()
        
        //创建视图
        subView.frame = CGRectMake(0, 0, 100, 100)
        subView.center = self.view.center
        subView.backgroundColor = UIColor.greenColor()
        self.view.addSubview(subView)
        
        
        //切圆角
        self.layerAction()
        
        //使用动画
        self.UIViewAnimation4()
    }
    
    //MARK: - Layer属性
    func layerAction() {
        //layer属性是负责视图的形状(显示)
        
        //1.切圆角
        //当圆角的值为正方形的宽的一半，就可以切一个圆
        self.subView.layer.cornerRadius = 50
        
        //2.设置边框
        self.subView.layer.borderWidth = 3
        self.subView.layer.borderColor = UIColor.redColor().CGColor
        
        
    }
    
    
    
    //MARK: - 动画方法
    //UIView的动画使用来动画的改变视图的frame相关属性、背景颜色、透明度
    
    
    //方法4:
    func UIViewAnimation4() {
        
        //参数1:动画时间
        //参数2:延迟时间
        //参数3:弹簧的压力系数
        //参数4:弹簧初始的加速度
        //参数5:选项
        //参数6:设置动画结束时视图的状态
        //参数7:动画结束后要执行的闭包
        UIView.animateWithDuration(2, delay: 1, usingSpringWithDamping: 0.1, initialSpringVelocity: 0, options: [ .Repeat, .Autoreverse], animations: {
            
            //注意:对于有圆角的视图，改变大小而又不影响形状，只能通过形变去缩放。不能直接改变frame中的size
                self.subView.transform = CGAffineTransformMakeScale(0.5, 0.5)
            
            }, completion: nil)
    }
    
    
    
    //方法3：
    func UIViewAnimation3() {
        
        //参数1:动画时间
        //参数2:延迟时间
        //参数3:选项,Repeat->动画重复执行,Autoreverse->自动回到动画开始的状态
        //参数4:设置动画结束时视图状态的闭包
        //参数5:整个动画过程完成后需要执行的闭包
        UIView.animateWithDuration(2, delay: 1, options: [ .Repeat, .Autoreverse], animations: {
            
                self.subView.transform = CGAffineTransformMakeTranslation(0, -200)
            
            }, completion: nil)
    }
    
    
    //方法2：
    func UIViewAnimation2(){
        
        //参数3:整个动画完成后会自动调用这个闭包
        UIView.animateWithDuration(2, animations: { 
            
                self.subView.transform = CGAffineTransformMakeTranslation(0, -200)
            
            }) { (_) in
                
                //写动画结束后需要执行的代码
                UIView.animateWithDuration(2, animations: { 
                    self.subView.transform = CGAffineTransformMakeTranslation(0, 0)
                })
                
        }
        
    }
    
    //方法1：
    func UIViewAnimation1() {
        
        //功能:执行这个方法前视图的状态，动画的切换到闭包里面设置的最终状态
        //参数1:动画时间（单位:秒）
        //参数2:闭包，设置动画结束时视图的状态
        UIView.animateWithDuration(2) {
            
            //在这儿来设置视图动画结束时的状态
            //a.动画的改变视图的坐标
            self.subView.frame.origin.y = 50
            
            //b.动画的改变视图的大小
            //self.subView.frame.size = CGSizeMake(50, 50)
            self.subView.transform = CGAffineTransformMakeScale(0.5, 0.5)
            
            //c.动画的改变视图的背景颜色
            self.subView.backgroundColor = UIColor.redColor()
            
            //d.动画的改变视图的透明度(0~1)
            self.subView.alpha = 0.3
            
        }

    }
    
}

UILabel基础

代码示例：

import UIKit

class ViewController: UIViewController {

    //MARK: - 生命周期
    override func viewDidLoad() {
        super.viewDidLoad()
        
        self.creatLabel()
    }

    //MARK: - 创建Label
    func creatLabel() {
        
        //UILabel:UIView -> UIView的属性和方法，UILabel都拥有
        //=======从UIView继承下来的属性=======
        //1.创建UILabel对象
        let label = UILabel.init(frame: CGRectMake(100, 100, 200, 300))
        //2.添加到界面上
        self.view.addSubview(label)
        //3.设置背景颜色
        label.backgroundColor = UIColor.yellowColor()
        
        //========UILabel的专有属性=========
        //1.text属性
        //设置label上显示的文字
        label.text = "hello world 你好世界"
        //拿到label上当前显示的文字
        print(label.text)
        
        //2.设置字体（字体大小默认是:17）
        //使用系统字体，设置字体大小
        label.font = UIFont.systemFontOfSize(17)
        
        //使用系统字体，设置字体大小和粗细
        //参数1:字体大小
        //参数2:字体粗细(小于1)
        label.font = UIFont.systemFontOfSize(17, weight: 0.2)
        
        //使用系统黑体，设置字体大小
        label.font = UIFont.boldSystemFontOfSize(17)
        
        //使用系统斜体，设置字体大小
        label.font = UIFont.italicSystemFontOfSize(17)
        
        //获取系统所有字体的字体名
        //75
        print(UIFont.familyNames(),UIFont.familyNames().count)
        //参数1:字体名
        //参数2:字体大小
        label.font = UIFont.init(name: "FZJKai-Z03S", size: 17)
        
        //总结使用自己的字体的步骤：
        //1.将ttf文件拖到工程中
        //2.在info.plist文件中添加键值对"Fonts provided by application",将字体添加到系统字体库中
        //3.通过提供字体名的构造方法去创建字体（先要找到自己添加的字体的字体名）
        
        //3.设置文字颜色
        label.textColor = UIColor.redColor()
        
        //4.设置阴影颜色
        label.shadowColor = UIColor.blackColor()
        //5.设置阴影的偏移效果
        label.shadowOffset = CGSizeMake(-1, -1)
        
        //6.设置文字的对齐模式(默认是左对齐)
        //Center -> 居中
        //Right -> 右对齐
        //Left -> 左对齐
        label.textAlignment = .Left
        
        
        label.text = "default is NSLineBreakBy TruncatingTail used for single and multiple lines of text 这样就用代码实现了label的创建，其中initWithFrame设置了label的位置还有大小，奥斯卡的积分换空间和"
        
        //7.设置行数
        label.numberOfLines = 5
        //自动换行
        label.numberOfLines = 0
        
        //8.设置换行模式
        //ByWordWrapping -> 以单词为单位换行
        //ByCharWrapping -> 以字符为单位换行
        //...
        label.lineBreakMode = .ByCharWrapping
        
    }

}

根据文字设置label的大小

代码示例：

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    
        //需要显示在label上的文字
        let str = "收到回复asdfsajfdkl刷卡费上"
        
        //计算显示指定文字所需要的最小空间
        //1.将swift的字符串转换成OC的字符串
        let ocStr = str as NSString
        //2.计算字符串的大小
        //参数1:限制显示当前字符串的最大宽度和最大高度
        //参数2:设置渲染方式(UsesLineFragmentOrigin)
        //参数3:确定文字的字体(大小)
        //NSFontAttributeName ->字体对应的key值
        //NSForegroundColorAttributeName -> 文字颜色对应的key值
         let strSize = ocStr.boundingRectWithSize(CGSizeMake(100, 1000000000), options: .UsesLineFragmentOrigin, attributes: [NSFontAttributeName:UIFont.systemFontOfSize(17)], context: nil).size
        print(strSize)
        
        
        //3.创建label显示文字
        let label = UILabel.init(frame: CGRectMake(100, 100, strSize.width, strSize.height))
        label.backgroundColor = UIColor.yellowColor()
        self.view.addSubview(label)
        label.text = str
        //自动换行
        label.numberOfLines = 0
        
    }

}