UI基础 - UIView

■ 简言

1. UIView 表示屏幕上的一块矩形区域，它在 App 中占有绝对重要的地位，iOS 中几乎所有可视化控件都是它的子类

2. 它的作用主要负责渲染区域的内容，并且响应该区域内发生的触摸事件

■ 使用方式 

1. 每个视图都可以添加子视图，遵循后来居上原则

    // aView 和 bView 平级
    UIView *aView = [[UIView alloc] initWithFrame:CGRectMake(50, 70, 150, 150)];
    aView.backgroundColor = [UIColor orangeColor];
    [self.view addSubview:aView];
    
    UIView *bView = [[UIView alloc] initWithFrame:CGRectMake(30, 100, 180, 300)];
    bView.backgroundColor = [UIColor redColor];
    [self.view addSubview:bView];
    
    // bView 添加子视图 cView
    UIView *cView = [[UIView alloc]initWithFrame:CGRectMake(20, 20, 100, 100)];
    cView.backgroundColor = [UIColor purpleColor];
    [bView addSubview:cView];
    // bView 添加子视图 dView
    UIView *dView = [[UIView alloc]initWithFrame:CGRectMake(20, 150, 100, 100)];
    dView.backgroundColor = [UIColor blueColor];
    [bView addSubview:dView];

运行效果

2. 每个视图都可以添加一个或多个子视图，但子视图只有一个父视图

// aView 和 bView 平级
UIView *aView = [[UIView alloc] initWithFrame:CGRectMake(50, 50, 150, 150)];
aView.backgroundColor = [UIColor orangeColor];
[self.view addSubview:aView];

UIView *bView = [[UIView alloc] initWithFrame:CGRectMake(150, 300, 150, 150)];
bView.backgroundColor = [UIColor greenColor];
[self.view addSubview:bView];

// 将 cView 依次添加进 aView 和 bView
UIView *cView = [[UIView alloc]initWithFrame:CGRectMake(20, 20, 50, 50)];
cView.backgroundColor = [UIColor purpleColor];
[aView addSubview:cView];
[bView addSubview:cView];// cView 最终展示在 bView 上面

运行效果

3. 常用的 API

//-------------------------------创建视图
// AView 和 BView 平级
// AView 的子视图是 AView1、AView2
// BView 的子视图是 BView1

UIView *AView = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 150, 200)];
AView.backgroundColor = [UIColor yellowColor];
AView.tag = 100;// tag 值：建议 100+ 起设，因为系统也有默认的返回值，一般设置在 100 下
[self.view addSubview:AView];// 注：addSubview 会引起对象引用计数加 1

UIView *BView = [[UIView alloc] initWithFrame:CGRectMake(100, 150, 200, 200)];
BView.backgroundColor = [UIColor greenColor]; // 背景色
BView.tag = 101;
[self.view addSubview:BView];
    
UIView *AView1 = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 50, 80)];
AView1.backgroundColor = [UIColor magentaColor];
AView1.tag = 102;
[AView addSubview:AView1];

UIView *AView2 = [[UIView alloc] initWithFrame:CGRectMake(50, 80, 50, 40)];
AView2.backgroundColor = [UIColor blackColor];
AView2.tag = 104;
[AView addSubview:AView2];

UIView *BView1 = [[UIView alloc] initWithFrame:CGRectMake(50, 40, 60, 90)];
BView1.backgroundColor = [UIColor redColor];
BView1.tag = 103;
[BView addSubview:BView1];

//--------------------------------常用 API
// 获取父视图
UIView *getSuperView = AView1.superview;
// 获取所有子视图
NSArray *getSubViewArray = [self.view subviews];

// 把子视图放在与其同级视图的最上面
[self.view bringSubviewToFront:AView]; // AView  会压在 BView  上面
[AView bringSubviewToFront:AView1];    // AView1 会压在 AView2 上面

// 把子视图放在与其同级视图的最下面
[AView sendSubviewToBack:AView1];    // AView1 会在 AView2 下面
[self.view sendSubviewToBack:AView]; // AView  会在 BView  下面

// 移除视图：BView 上的所有子视图会被一并移除
// [BView removeFromSuperview];

// 通过 tag 值查找指定视图：通常都是通过父视图去找，也可以通过根视图去找（不建议使用后者）
UIView *getView1 = [BView viewWithTag:103];// 父视图查找
UIView *getView2 = [[UIApplication sharedApplication].keyWindow viewWithTag:103];
// 根视图查找：iOS 13.0 中已弃用 keyWindow

// 插入
UIView *AView3 = [[UIView alloc] initWithFrame:CGRectMake(50, 50, 200, 50)];
AView3.backgroundColor = [UIColor blueColor];
[AView insertSubview:AView3 atIndex:1]; // 位于 AView1 和 AView2 之间

// 通过下标交换两个视图的上下层关系
[AView exchangeSubviewAtIndex:0 withSubviewAtIndex:1];// 由下向上依次是 AView3、AView1、AView2
// 将 AView1 放到 AView2 的上层
[AView insertSubview:AView1 aboveSubview:AView2];// 由下向上依次是 AView3、AView2、AView1
// 将 AView1 放到 AView3 的下层
[AView insertSubview:AView1 belowSubview:AView3];// 由下向上依次是 AView1、AView3、AView2

// CGRectInset：基于父视图边框向 x 内缩、向 y 外放 10 个物理点
UIView *AView4 = [[UIView alloc] initWithFrame:CGRectInset(AView.bounds, 10, -10)];
AView4.backgroundColor = [UIColor cyanColor];
[AView addSubview:AView4];

运行效果