iOS部分-UI基础控件 - 01天 入门 第01课 计算机的界面搭建

在这里提示一下大家，如果没有学习过OC语言里面的内容的话。首先去了解，或者去学习一下。因为做iOS开发，离不开OC语言。

好，今天开始学习我们的iOS开发中的基本控件。首先来讲一个加法计算器是如何构造出来的。

下面的知识点会涉及到

1.如何新建项目 

2.如何运行项目 

3.storyboard的讲解(故事面板) 

4.storyboard怎么添加多个界面 

5.修改控件的基本属性 

6.搭建加法计算器界面 

7.UIView 

8.UIViewController(视图控制器)

好，先来讲解第1点

1.如何新建项目 

新建一个项目
New project—>Application
Single View Application 单视图应用（绝大多数应用都使用这个模版）



然后直接输入Product Name



创建完之后。要存放项目的路径，记住下面的勾选。好处后面才知道(翻译是:我的Mac上创建git存储库)



2.如何运行项目 

通过左上角的三角



出来的是一个模拟器



它使用的是计算器内存（相对手机而言，可能会高一点）
如果出来比较大 可以通过缩放比例来缩小



然后这是一个设置屏幕尺寸



3.storyboard的讲解(故事面板)

看到代码里面有一个Main.storyboard 点击进去看一下。是一个界面



这就是我们的storyboard界面

然后我们可以看到右下角有很多东西，这些都是控件。我们手机上面的都是这些东西



我们可以通过左下角来切换显示的样式



然后我们拖几个控件上去。运行。可以看到就是我们程序的这个界面。
storyboard通过什么来验证是当前的界面
我们可以看到界面 左边有一个箭头，



说明，当前程序运行的时候就是当前这个界面。



4.storyboard怎么添加多个界面
4.1添加界面到布局
可以往屏幕上拖一个叫ViewController的东西。



拖进来，布局上面多了一个视图
可以通过双击布局区来缩放布局区的大小

4.2 缩放布局的情况下，不能拖东西
我们可以往屏幕上面拖东西来验证一下区分其他界面。
如果当前布局是缩放的。那么我们不可以直接往屏幕上拖东西。



需要缩回到原来的布局才能拖控件。



可以看到。我们程序一启动要启动那个视图。取决于我们这个箭头。

5.修改控件的基本属性

比如我们怎么修改一个label控件的属性,通过右上角中的

按钮（属性检查器）来修改。

6.搭建加法计算器界面
 6.1. 修改label内容的时候。2种情况
 6.1.1 可以通过双击label控件修改label里面的内容。然后通过回车（系统会帮我们缩放到合适的大小）(自动变化宽度)
效果如下



 6.1.2 直接通过属性面板修改(没有自动变化宽度)
 效果如下



搭建完毕



6.2 测试界面
发现Xcode6之后，键盘没有弹出。可以通过模拟器设置
点击模拟器的菜单栏 Hardware  ----->   Keyboard   取消Connect Hardware Keyboard，就OK啦 
6.2.1界面优化 textField键盘格式
然后界面需要优化的是，点击textField 应该是只能输入数字。我们可以通过

属性检查器来修改。
keyboard Type  : Number Pad (不能输入小数)、Decimal Pad (有小数)



需要注意的细节，上传app的时候。如果你在这里是给用户输入数字的时候。而你给它设置为字符的键盘。那么很可能被拒绝的。

6.3 对整个项目疑惑的地方 
整个文件里面，让我们感觉最奇怪的是Main.Storyboard    M 
M是什么来的
首先，我们先通过Scorce Control—>Commit



然后在下面输入一句 
完成加法计算器的界面布局。



然后可以看到 项目里面中的Main.Storyboard 中的 M不见了
等到后面再讲为什么。

7.UIView

可以看得到，摸得到得东西，都可以理解为视图
作用:布局界面的
所有的空间，都继承自UIView,位置、宽度、高度....

控件的多个移动
需要按住cmd键
或者通过左边的界面点击开始的控件，然后点击shift键到结束的控件。

8.UIViewController(视图控制器)
每一个界面的代码写在每一个UIViewController里面
查看当前界面，是由哪个ViewController控制的。 

首先要点击界面中的ViewController 



再点击右边的

这个按钮（标示的）
可以看到这里 class是ViewController



项目里面的文件，也有ViewController ，这是相对应的。我们可以通过一个箭头

跳到当前的ViewController的源代码文件里面去。
然后程序的代码要写到ViewController.h 、ViewController.m里面

8.1 ViewController中的方法
   viewDIdLoad 方法

/* 视图加载完成会被执行 */
- (void)viewDidLoad {

    [super viewDidLoad];

    // Do any additional setup after loading the view, typically from a nib.

    NSLog(@"========");
}