Objective-UI UIView及其子类

今天终于到学习UI的时候,也就是能够看到实质界面的时候.首先咱们仍是简单介绍一下iOS.

iOS是Apple公司的移动操做系统,主要用于iPhone,iPad,iPad Mini,iPod Touch等移动产品.借助iOS,咱们能够开发视频类,美图类,新闻类,音乐类,团购类,电商类,阅读类,出行类,生活服务类,游戏类等应用程序.除此以外,iOS还能够与外部设备通讯,开发出更多改变生活的产品,例如:只能家居(iOS App控制电视,空调等),健身产品(将人体的健康情况经过App直观的展示出来)等.

UI(User Interface):用户界面,用户能看到的各类各样的页面元素. iOS App = 各类各样的UI控件 + 业务逻辑和算法.想要开发出一款精美的应用程序,须要熟练掌握各类UI控件的用法.

iOS发展到如今,从最初的iOS2.0到如今,经历了一些变化,在UI外观上,iOS7发生了重大变革,以线条为主,倾向于扁平化,更着重与体现应用程序的内容. 在iOS7以前的UI外观是以虚拟化为主,注重立体,阴影的配搭,无形中下降了应用程序内容的地位.

那么如何将UI呈现出来呢????

iOS提供了这么多UI,如何去呈现这些UI, 有一个叫UIWindow的. window是窗口,每一个App都须要借助window将内容展示给用户看.在iOS中,使用UIWindow类来表示窗口,一般一个应用程序只建立一个UIWindow对象. window的主要做用是呈现内容给用户,咱们不会对window作太多操做.

如今咱们来看一下如何建立window,在建立window的时候,须要制定window的大小,一般window的大小(frame)与屏幕(UIScreen)大小一致,例如代码:

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

首先咱们先要建立一个空工程(Empty Application)建立步骤

1. 打开x-code 6 Create a new Xcode project—>iOS下的Application—>Empty Application。点击Next。


二、输⼊入Product Name ,点击Next。


三、选择项⺫⽬目保存路径,点击Create。 

如今工程建立好了,咱们在来看一下,在这个工程里须要添加的一些控件,咱们来一一的学习.今天主要学习UIView.

UIView(视图):表明屏幕上的一个矩形区域,iOS中用UIView来表示视图, UI的控件都属于View, iOS中全部能看到的内容都是View或其子类.咱们有了window,如今还须要在建立一个view.代码以下:

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

UIView *blueView = [[UIView alloc]initWithFrame:CGRectMake(100,100,120,100)];

2.对视图作一些设置(好比:背景颜色)

blueView.backgroundColor = [UIColor blueColor];

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

[self.window addSubview:blueView];

4.释放视图对象

[blueView release];

//属性解释

#pragma mark -- frame --

frame是view的重要属性,是咱们作视图布局的关键,它决定了视图的大小和位置.对于如何掌握view的大小和位置是一个很重要的前提, iOS提供了用于布局的平面坐标系,左上角为坐标系的原点.

水平向右:为x的正方向, 屏幕最左到最有可划分320等份. 这是iPhone4 4s 和 5系列的 iphone6是375等份 iPhone6Plus 414等份

垂直向下:为y的正方向, 屏幕最上到最下可划分480等份(3.5寸屏幕).575等份(4寸屏幕).  iPhone6(4.7寸屏幕)667等份, iPhone6Plus(5.5寸屏幕) 736等份

坐标系不是以像素做为划分依据,而是以"点"做为依据.

frame是一个结构体,包含2部分的内容: origin和size. 

origin也是一个结构体,包含2部分的内容: x和y.

struct CGPoint

{

　　CGFloat x;

　　CGFloat y;

};

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

typedef struct CGPoint CGPoint;

struct CGSize 

{

　　CGFloat width;

　　CGFloat height;

};

typedef struct CGSize CGSize ;

frame的origin和size是相对于父视图来讲的.

struct CGRect

{

　　CGPoint origin;

　　CGPoint size;

};

typedef struct CGRect CGRect;

CGRectMake()函数能够帮咱们快速构造一个CGRect变量

 

#pragma mark -- center --

center(中心点)也是view重要的属性,center是个结构体,包含2个部分:x和y. center与frame有着密切的关系.例如:

center.x = frame.origin.x + frame.size.width/2;

center.y = frame.origin.y + frame.size.height/2;

 

#pragma mark -- bounds --

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

 

frame, bounds, center三者之间有着微妙的联系, 看下图:

UIView的addSubview:方法能够添加子视图,对于同一个视图的全部子视图来说,后添加的子视图会把前面的子视图盖在下面.

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

UIView做为其余UI控件的BaseClass,提供了不少属性

以上是View的详解, 如今咱们来看一下放在view上的控件,今天咱们来看UILabel.

#pragma mark -- UILabel --

UILabel(标签): 是显示文本的控件,在App中UILabel是出现频率最高的控件, UILabel是UIView的子类,做为子类通常是为了扩充父类的功能,UILabel扩展了文字显示的功能,UILabel是能显示文字的视图. 文本就是文字(字符串),文本显示就是在视图上显示出来, 下面咱们来看一下如何使用UILabel.

1.开辟控件并初始化(若是本类有初始化方法,使用本身的,没有的话,就使用父类的).

UILabel *userNameLabel = [[UILabel alloc]initWithFrame:CGRectMake(30,100,100,30)];

2.设置文本控件相关的属性

userNameLabel.text = @"用户名";

3.添加到父视图上

[self.view addSubview:userNameLabel];

4.释放

[userNameLabel release];

UILabel还有一些属性,你们能够一一试试.

总结: App靠window类呈现内容,一个程序通常只建立一个window. App中能看到的元素,都是UIView及其子类.

UIView做为全部可视化控件的BaseClass,提供了许多属性和方法.显示效果控制(frame,alpha等),视图添加和移除(addSubview:等),视图层次调整(bringSubviewToFront:等)等.

UILabel属于具体的视图,有本身的侧重点.