神刀安全网

iOS开发学习之 UI基础(2) UIView

前言

UI(User Interface)作为最基本的要点,也是非常重要的一部分,UI界面的美观直接决定着着用户的体验,苹果官方给开发中提供了非常强大的搭建UI界面的框架UIKit,包含了丰富多彩的各种UI元素。那么如何搭建界面呢?在搭建界面之前先了解UIView。

一、UIView

1.1什么是UIView?
  • UIView称之为控件或视图
  • 界面中我们看到的东西都是一些对象组成的,界面中所有能看到的都是UIView

  • 常见的UIView控件有哪些?

    • UIButton、UILabel、UIImageView、UITableView、UICollectionView等
1.2什么是控件?
  • 在屏幕上的所有UI元素都可以叫控件,也可以叫视图,组件等
  • 文本(UILabel)、按钮(UIButton)等都是控件
    iOS开发学习之 UI基础(2) UIView
    网易新闻

1.3控件的共同属性有哪些?
  • 所有的控件都是直接或间接的继承自UIView类,都拥有共同的属性和方法
    • 尺寸 CGSize
    • 背景色 backgroundColor
    • 位置 CGPoint
    • ….
  • 苹果将控件的共同属性都抽取到父类UIView中
    • 所有的控件最终都继承自UIView
    • UIButton、UILabel都是继承自UIView(可以查看头文件)

二、父控件、子控件

2.1每一个控件其实都是一个容器
  • 可以将其他控件放到该控件的内部
  • 比较常见的还是将UIView作为容器
2.2可以将A控件放入B控件
  • A控件是B控件的子控件
  • B控件是A控件的父控件
2.3每一个控制器都有一个UIView
  • 控制器本身是不可见
  • 能够看到的是控制器的View
  • 每一个控制器中都一个UIVIew的属性
  • 控制器中管理的所有子控件都是该控件的子控件

三、UIView的常见属性和方法

3.1UIView的常见属性
  • 获得自己的父控件对象
    • @property(nonatomic,readonly) UIView *superview
  • 获得自己的所有子控件对象
    • @property(nonatomic,readonly,copy) NSArray *subviews;
  • 控件的ID(标识),父控件可以通过tag来找到对应的子控件
    • @property(nonatomic) NSInteger tag;
  • 控件的形变属性(可以设置旋转角度、比例缩放、平移等属性)
    • @property(nonatomic) CGAffineTransform transform;
3.2UIView的常见方法
  • 添加一个子控件view
    • -(void)addSubview:(UIView *)view;
  • 将自己从父控件中移除
    • -(void)removeFromSuperview;
  • 根据一个tag标识找出对应的控件(一般都是子控件)
    • -(UIView *)viewWithTag:(NSInteger)tag;

四、坐标系

4.1UIview坐标系的属性
  • 控件矩形框在父控件中的位置和尺寸(以父控件的左上角为坐标原点)
    • @property(nonatomic) CGRect frame;
  • 控件矩形框的位置和尺寸(以自己左上角为坐标原点,所以bounds的x、y一般为0)
    • @property(nonatomic) CGRect bounds;
  • 控件中点的位置(以父控件的左上角为坐标原点)
    • @property(nonatomic) CGPoint center;
注意:
  • 在UIKit中,坐标系的原点(0,0)在左上⾓角,x值向右正向延伸,y值向下正向延伸
iOS开发学习之 UI基础(2) UIView
Paste_Image.png

  • 1.新拖或新建一个View Controller的时候,会有一个默认的View
  • 2.frame指的是在父控件中的位置,左上角为(0.0),向右X增加,向下Y增加
  • 3.bound是以自己的左上角为(0.0)以自己为中心
  • 4.UIView相当于画板,我们可以向这个画板上添加我们需要的“图画”

五、代码

百度云:

链接: https://pan.baidu.com/s/1nuQlJvz 密码: bpgd

转载本站任何文章请注明:转载至神刀安全网,谢谢神刀安全网 » iOS开发学习之 UI基础(2) UIView

分享到:更多 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址