UI --UIView 及其子类

一 > UIView

1> iOS 概述:

iOS 是 Apple 公司的移动操作系统,主要用于iPhone, iPad, iPad Mini , iPod Touch 等移动产品.
借助iOS 我们可以开发视频类 , 美图类 , 音乐类 , 团购类 ,电商类 ,出行类, 生活类 ,生活服务类 , 游戏类 ...应用程序
除此之外,ios还可以与外部设备通信,开发出更多改变生活的产品,比如:智能家居( ios App 控制电视,空调.. ) , 健身产品 ( 将人体的健康状况通过App 直观的展现出来.... )

2> UI 概述:

UI ( User Interfance ) : 用户界面,用户能看到的各种各样的页面元素 .
iOS App = 各种各样的UI控件 + 业务逻辑和算法 .
熟练掌握UI控件 .

3> UIWindow

window 是窗口,每个app 都需要借助window 将内容展现给用户看.
在 iOS 中,使用UIWindow 类来表示窗口,通常一个应用程序只创建一个UIWindow 对象
window 的主要作用是呈现内容给用户,我们不会对window 做太多操作 .

————>如何创建window呢??

在创建window的时候,需要指定window的大小
通常window的大小( frame ) 与屏幕( UIScreen ) 大小一致 .—>screen [skriːn] 屏幕
示例代码如下:
self.window =[ [UIWindow alloc ] initWith Frame: [[UIScreen mainScreen] bounds] ] ;

练习 1 > 建立一个Empty Application 项目,并将window的背景颜色改为红色.

————>创建项目流程 :

1> command +shift +N ——>iOS 下的Application ——>Empty Application .点击Next .
2> 输入Product Name .点击Next .
3>选择项目保存路径 ,点击Create. create [kriː'eɪt] 创建

//1>创建一个window窗口( 开辟空间) ,并将其初始化( 也就是初始化它的一个范围) ,给定window屏幕的大小与我们的main screen 一样大 ,做都 bounds

self.window =[ [UIWindow alloc ] initWithFrame:[ [ UIScreen mainScreen ] bounds ] ] ;

//2>给window窗口背景添加颜色——>调用它的颜色类的颜色方法

self.window.backgroundColor = [UIColor redColor ];

//3>使我们创建的window窗口可见( 显示到 window上)

[self.window makeKeyAndVisible ] ;

4>UIView :

view (视图) :代表屏幕上的一个矩形区域,ios中用UIView 来表示视图.
PPT里看到的各种UI控件都属于view
不同的控件代表不同种类的view
iOS中所有能看到的内容都是view 或其子类

———> 创建视图的步骤如下:

1>开辟空间并初始化视图 ( 初始化时,给出视图位置和大小)

// UIView *view = [ [ UIView alloc ]initWithFrame:CGRect ( 100, 100,120,100 ) ] ;

2>对视图做一些设置 ( 比如:背景颜色 )

// view.backgroundColor = [ UIColor blueColor] ;

3>将视图添加到window上进行显示

// [self.window addSubview : view] ;

4>释放视图对象

/// [ view release ] ;

a>frame : 框架 ( 形容一个view 的范围 )

frame 是view的重要属性 ,是我们做图布局的关键,它决定了视图的大小和位置 .
根据ios坐标系来掌控view的大小和位置 .

——>iOS 提供了用于布局的平面坐标系.

左上角为坐标系的原点 ,
水平向右 :为x的正方向, 屏幕最左到最右可划分320 等份
垂直向下:为Y的正方向 ,屏幕最上到最下可划分480等份 ( 3.5 inch 屏幕 )
坐标系不是以像素作为划分依据的,而是以”点" 作为依据

——>frame 是一个结构体,包含2部分内容:origin ['ɔridʒin, 'ɔ:-] ( 起源 ,开端 ) 和 size ;

——>origin 也是一个结构体,包含2部分内容 : X ,Y .

——>size 也是一个结构体 ,包含2部分内容 : width 和 height .

——>frame 的origin 和size 是相对于父视图来说的.

——>CGRectMake( ) 函数可以帮我们快速构造一个CGRect 变量

b> center

center ( 中心点 ) 也是view 重要的属性
center 是一个结构体 ,包含2个部分 : X,Y.
center 与 frame 有着密切的联系
center.x = frame.origin.x + frame.size.with/2 ;
center.y = frame.origin.y +frame.size.height/2 ;
//改变greenview的center值,那么greenview位置也会跟着改变//
    [greenView setCenter:CGPointMake(100, 100)];
    //或者
    //greenView.center = CGPointMake(100, 100)//

c> bounds : 边界

bounds (边界) 也是view 的重要属性 ,用于定义自己的边界,它同frame一样是一个CGRect 结构体变量
当一个view 设置 bounds 时,会把自己当成一个容器,定义自己的边界大小以及左上角的初始坐标.例如:view.bounds = CGRectMake( 0,0,100,100 ) ;
当子视图添加到此视图时,会根据bounds 指定的原点( 0,0 ) 计算frame,而非左上角

———> *总结: setBounds 属性 ,父视图不会变化,子视图会随着变化;bounds 是相对于自身来说的 ,它的X,Y 永远不会发生变化 ,但是它的宽高改变之后,宽高就会发生改变....Frame是相对于父视图来说的,改变任何的长度(X,Y,宽,高)就会变化;

/2>设置redView的bounds 属性,将bounds.origin改为(0 ,30) 查看结果

redView.bounds =CGRectMake(0,30, 130,130);//redView视图没变化,而它的子视图会随着redView的 (origin.X,origin.y)而变化 ,但是子视图的 Y 会减30
//3>2>设置redView的bounds 属性,将bounds.origin改为(10 ,30) 查看结果

redView.bounds = CGRectMake(10, 30, 130, 130);//redView视图没变化,而它的子视图会随着redView的 (origin.X,origin.y)而变化 ,但是子视图的 X 会减10, Y 会减30

———>frame center bounds 之间的关系见下图 ...

4>添加视图

UIView 的 addSubview : 方法可以添加子视图,对于同一个视图的所有子视图来讲,后添加的子视图会把已加的子视图盖在下面
UIView 提供了其他添加视图的方法.

5>管理视图层次

UIView 除了提供添加视图的方法 ,还提供了管理视图层次的方法

6>视图重要属性

UIView 作为其他UI控件的BaseClass( 基类 ) ,提供了很多属性

hidden : [‘hɪdn] 隐藏一般不用隐藏,一旦隐藏,那么它的子视图也跟着隐藏了;

alpha [‘ælfə] 控制视图的不透明度默认为1( 不亮 ) 设置范围( 0~1.0 ) 越小越透名; 控制视图的透明度,默认是1.0 ,其值范围在(0~1.0)之间;设置透明度会将其子视图也会带着一起设置

superview : 获取本视图的父视图需要打印它的信息才能看到

subviews : 获取本视图的所有子视图需要打印它的信息才能看到

tag : 给视图添加标记被加完标记的视图可以使用view.With.Tag: 方法取出一般是从100 开始通常用于循环.. 见下面代码

[self.window viewWithTag:101].backgroundColor = [UIColor yellowColor];

二 > UILabel

UILabel (标签 ) : 是显示文本的控件,在App 中 UILabel 是出现频率最高的控件
UILabel 是 UIView 子类 ,作为子类一般是为了扩充父类的功能,UILabel 扩展了文字显示的功能 ( UIView 不能显示文字 , ) UILabel 是能显示文字的视图.

1> 文本显示

文本: 就是我们的文字 (字符串)
文本显示 : 在视图上显示文字
文本显示都有哪些方面?—> 文本内容,文本字体

2> 如何创建使用UILabel

1> 开辟空间并初始化 ( 如果本类有初始化方法 , 使用自己的,否则使用父类的 )

// self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];

    self.window.backgroundColor = [UIColor whiteColor];

    [self.window makeKeyAndVisible];

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(100, 100, 150, 50)];

2>设置文本控制相关的属性

// label.backgroundColor = [UIColor blueColor];

3>添加到父视图上,用于显示

// [self.window addSubview:label];

4>释放

// [label release] ;

3> UILabel 的作用 : 主要作用是显示一段文本,因此提供了很多与显示文本相关的API

总结 :

UIView 是所有可视化控件的基类
UILabel 是具有特定外观,特定功能的视图 (能显示文字 )
UILabel 侧重于文本的呈现
APP 靠window 来呈现内容,一个呈现一般只创建一个window
APP 中能看的到的元素,都是UIView 及其子类
UIView 作为所有可视化控件的baseclass ,提供了许多属性和方法,能显示效果控制 (frame .alpha .. )视图添加和移除 (addSubview: .. ) ,视图层次调整 ( bringSubviewToFront: … ) .
UILabel 属于具体的视图,有自己的侧重点

巴特西

UI --UIView 及其子类

最新文章

热门文章