UI第一天
UIWindow
window:窗口,一个应用想要展示在屏幕上,至少要有一个window.一个手机应用程序一般只有一个window
应用程序中的所有的界面全部是展示在window上的
启动Window的步骤
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
//1.创建UIWindow对象
//frame是UIView中的属性,确定视图显示在屏幕上的位置和大小
//UIScreen.mainScreen() 拿到手机屏幕
self.window = UIWindow.init(frame: UIScreen.mainScreen().bounds)
//2.设置根视图控制器
self.window?.rootViewController = UIViewController()
//3.设置背景颜色
self.window?.backgroundColor = UIColor.yellowColor()
return true
}
UIView
这个是在视图控制器里面创建的
UIView:是iOS中所有视图(控件)直接/间接的父类;所以UIView的属性和方法,对于其他类型的视图都有效
视图:在屏幕上能看见的所有的东西都属于视图
let redView = UIView.init()
//想要将视图展示在屏幕上的两个必要条件:
//a.必须设置坐标和大小(默认坐标是(0,0),大小(0,0))
//b.将视图添加到已经展示在屏幕上的视图上
//2.设置frame属性(由坐标(x,y)和大小(width,height)两个部分组成)
redView.frame = CGRect(x: 10, y: 10, width: 100, height: 100)
//iOS中所有的结构体都有一个对应的Make方法用来快速的创建一个结构体变量
redView.frame = CGRectMake(10, 10, 100, 100)
//3.将视图添加到界面上
self.view.addSubview(redView)
//4.设置背景颜色
//视图的背景颜色默认是透明色
//颜色的创建方式:
//b.通过三原色来创建颜色
//CGFloat就是UI中的浮点型
//参数1,2,3: 红、绿、蓝的值(0~1) 0/255 ~ 255/255
//参数4: 透明度(0~1)
redView.backgroundColor = UIColor.init(red: 30/255.0, green: 133/255.0, blue: 26/255.0, alpha: 1)
//c.创建灰色
redView.backgroundColor = UIColor.init(white: 0.7, alpha: 1)
//a.通过类型方法创建指定颜色
redView.backgroundColor = UIColor.redColor()
frame的相关属性
a.view的坐标和大小
三种初始化方式
redView.frame = CGRectMake(100, 100, 100, 100)
redView.frame = CGRect(x: 10, y: 10, width: 100, height: 100)
let redView = UIView.init(frame: CGRectMake(35, 35, 50, 50))
b.view的中心点
center是通过frame的坐标和大小来确定的
可以通过改变center的值去改变frame的值
redView.center = CGPointMake(200, 200)
c.bounds(坐标和大小)
如果改变bounds的大小,frame的大小和坐标都改变,center不变
如果改变bounds的坐标,不影响当前视图的位置。但是影响添加到当前视图上的子视图的坐标,不建议修改bounds
d.transform形变
当前视图发生形变,那么添加到当前视图上的所有的视图会跟着一起形变
1.缩放(Scale)
参数1:x方向上的缩放比例
参数2:y方向上的缩放比例
redView.transform = CGAffineTransformMakeScale(0.8, 2.5)
2.旋转(Rotation)
参数:旋转角度(圆周率对应的角度值)
redView.transform = CGAffineTransformMakeRotation(CGFloat(M_PI_4 / 2))
3.平移(Traslation)
参数1:在x方向上平移的距离,负值->向左移,正值->向右移
参数2:在y方向上平移的距离,负值->向上移,正值->向下移
redView.transform = CGAffineTransformMakeTranslation(0, 300)
4.多个形变的组合
//在另外一个形变的前提下旋转
//参数1:另外一个形变
//参数2:旋转角度
redView.transform = CGAffineTransformRotate(CGAffineTransformMakeScale(0.5, 0.5), CGFloat(M_PI_4 / 2))
//在另外一个形变的前提下平移(TRanslate)
redView.transform = CGAffineTransformTranslate(redView.transform, 0, 300)
//在另外一个形变的前提下缩放(Scale)
//创建一个平移的形变
let transLation = CGAffineTransformMakeTranslation(100, 0)
redView.transform = CGAffineTransformScale(transLation, 0.5, 2)
//组合两个形变
//旋转形变
let rotate = CGAffineTransformMakeRotation(0.2)
//平移形变
let transLation1 = CGAffineTransformMakeTranslation(100, 100)
//将旋转形变和平移形变组合(Concat)
redView.transform = CGAffineTransformConcat(rotate, transLation1)