iOS开发学习（一）着手创建自己的第一个App

        了解了iOS开发的基础知识，就要着手写一个小小的App了。这也是本文的目的。

        1.1创建新项目

        打开xcode，选择new 一个project，选择single view Application，创建一个project.

        

        1.2 添加用户界面元素.

        1）选择项目导航器中的 MainStoryboard.storyboard，将对象库中的用户界面 (UI) 元素拖移到画布上的视图中，来添加用户界面元素。UI 元素添加到视图后，可以适度移动它们的位置和调整大小。

        对象库出现在实用工具区域的底部。如果看不到对象库，您可以点按其按钮，即库选择栏中从左边起的第三个按钮。

        

        如果想添加什么界面元素可以用下面的搜索栏目直接搜索.我们下面添加几个界面元素到画布上.

        2）添加一个Image View，

        1.在object library中找到image view，并拖到视图中，image view会拉伸充满整个界面。

        

        

        image view上有8个点供开发者调整image view的大小，鼠标放在某个点就可以拖动其大小。如下：

        

        2.上传图片，让imageview 显示图片。选中一张图片，拖动到项目导航器中的supporting files中，如下图：

        

        按照图上中点击，选中Destination的checkbox，把图片复制到项目中，其他保留默认值即可。然后选择finish，这样一个图片就导入到项目中来了。

 

       3.让imageview 显示导入的图片.

        

        这样图片就可以显示在imageview中了，

        

        默认情况下，图片会拉伸到和imageview一致的大小，图片的显示方式是由imageview的mode属性设置的，mode属性位于Attributes inspector中的View栏。

        

        mode中值为scale to fill就是充满整个image view的意思。对于图片大小和显示方式的处理，iphone建议的是提供适当大小的图片（即图片的大小和最终要显示在iphone上的大小是一致的，不需要iphone的cpu进行更多的处理，这样有助于程序的快速运行和节约cpu的消耗），如果同一张图片有2种大小需要显示，那么你就传2张图片到程序了就可以了。

       选中图片，然后选中菜单栏中的Editor>Size to Fit Content，这样ImageView会自动调整到和图片原始尺寸一致.

       

       

       调整imageview 的位置，让它显示在最中央。

       3）添加2个Label和2个textfield

        

        1.添加过程很简单，和上文添加imageview类似，添加后的效果如下：

        

        Label和testfield的排列主要还是依靠蓝色的辅助线，挪动label和textfield的时候会有蓝色的辅助线辅助你实现对齐的功能。非常的简单。重命名label，并且调整textfield的大小。

        

        

        2个label的文字分别换成name和number，并向右对其（同时选中2个Label，选择菜单栏Editor>Align>Right Edges），2个textfield拉长到了合适的宽度。

 

        2.为textfield添加Placeholder文字

        Placeholder text是一种提示性的文字，默认显示在空的textfield中，当textfield获得焦点并输入内容后，Placeholder text会自动消失，当删除所有的内容，Placeholder text会再次出现。

        选中textfiled，在Attribute inspector中找到Placeholder，并输入“Type a Name”

        

        为两个textfile 添加之后，效果图如下：

        

        

       1.3添加代码 实现功能.

        如果这个时候我们直接运行程序，会发现当textfield获得焦点之后，会有一个虚拟键盘出现，我们可以选择要输入的字母。

        

        但是第二个textfield期望的是只能输入数字，所以我们需要更改下键盘的类型。选中第二个textfield在Attribute inspector中找到Keyboard，将其类型改成“Number Pad”        

 

        

       再次运行程序，点击第二个textfield就可以发现出现的数字键盘。

        

       如果运行起来可以发现我们输入结束后，如何隐藏键盘，当点击虚拟键盘的“return”按键时，它会调用一个Event，叫“Did End On Exit event”，我们可以关联一个Action到这个event，当触发这个event时，调用Action使键盘隐藏。

        1.4 先了解下Outlet  与action  ：   outlet(插座，出口),action(行为)

        刚开始接触iOS开发，这两个关键字让我有点犯迷糊了。在网上查了下资料，大致是这么个意思：

        

        我们在main.storyboard中以图形化的方式建立用户界面。然后通过创建Outlet和Action，将main.storyboard中放置的控件与代码之间建立连接。使用Outlet，以定义变量的方式将控件链接到代码，该变量代表控件。使用Action，以定义方法的方式将控件链接到代码，该方法在用户与控件进行交互时运行。

    

        outlet和action是连接使用者界面和程序代码的关键。outlet就像c语言中的指针,指向一个对象。或者说是一个对象的引用，例如一个Label，一个textfield，在C# Winform中，我们会为每一个控件设定一个name，那么在编程时，直接使用这个name就可以对该控件进行操作，但是在ios里面，情况变得有些复杂，控件没有name，就是说你拖一个控件过来，这个控件是没有自己的name的，那么要在code中操作这个控件该怎么办呢？定义一个Outlet，然后把这个Outlet指向该控件，在code中就用这个Outlet来操作这个控件。

         Action:Action就是定义一个事件，然后将控件和action事件联系起来。C#可以单独定义事件，然后将控件和事件使用“+=”操作符联系起来就可以，虽然ios里面没有这个语法，但是也是需要联系的，联系建立起来以后，控件就可以触发这个事件了。如何建立action。例子如下：

         1.添加事件首先需要创建一个action，然后建立联系，xcode会帮我们来完成这两步。

         1）选中project navigator的main.storyboard显示iPhone的界面。

         2）选中Xcode右上角的7个按钮从左到右的第二个Show Assistant editor（快捷键：option+command+enter，菜单栏View>Assistant Editor>Show Assistant editor）

         

         3）选中后的界面如下，会在ipone界面的右面出现 UIExample1ViewController.h，我们等会就需要将textfield拖动到这个文件里面，然后进行一些相应的设置，xcode会自动的帮我们建立控件和action的联系。

 

        

        接下来就是创建action了，鼠标按住第一个textfield不放开，然后按住键盘上的control键，然后拖动到右边的UIExample1ViewController.h在@interface和@end中间放开鼠标

         （像素略喳。。。）

        松开鼠标之后，会弹出下列对话框：

        

        connection选择action，然后name定义为nameFieldAction,类型为UITextField,说明是UITextField事件，然后点击connect，创建完成后的代码如下图所示：

        

        在UIExample1ViewController.m中会自动添加如下代码：

        

        到这里，一个action就建立并且关联起来了，你可以在代码中实现一些功能。

        这里是由xcode 自动帮我们建立action，我们也可以手动建立action。删除掉UIExample1ViewController.m和UIExample1ViewController.h的代码，我们下面来手动添加下action。

        在UIExample1ViewController.h中添加

- (IBAction)nameFieldDoneEditing:(id)sender;

              在UIExample1ViewController.m中添加

- (IBAction)nameFieldDoneEditing:(id)sender
{
    [sender resignFirstResponder];
}

           FirstResponder的意思是正在和用户交互的那个控件，textfield正在和用户交互，这时的它就是FirstResponder。 resignFirstResponder的意思是放弃第一响应者，即textfield不再和用户进行交互，那么此时的textfield也不会获得焦点，这样键盘就自然而然的消失了。   

     
        我们这里只是创建了一个action，如何与控件建立关联。

        选中第一个text field，打开connections inspector，下图中的第6个图标（最右边的一个图标），找到connections inspector中的“Did End On Exit”方法，鼠标移到它右边的小圆圈，此时小圆圈中出现一个加号。

        

        按住鼠标左键不放，拖动到File's Owner上放开鼠标，此时一个小窗口会弹出，会显示File's Owner所拥有的Action

        

        这里会显示出来File's Owner所拥有的Action，选中nameFieldDoneEditing，这样“Did End On Exit”就和nameFieldDoneEditing方法关联起来了。  这是建立action的第二种方法。

        2.添加outlet。与上面第一种方法类似。拖动过去，选择outlet

        

        outlet创建完毕后的UIExample1ViewController.h如下所示：

        

        写到这里我们可以执行一下，来看看效果了。command+R运行，操作的时候可以看到点击键盘上的return，则虚拟键盘则会隐藏起来。所以我们达成了我们的第一个任务。

        那么第2个数字虚拟键盘如何让它隐藏起来了。这个虚拟键盘没有return键。

        

        我们采用的一种方法是：当我们点击屏幕上任何空白的地方时（包括ImageView和Label这些非活动控件，即静态控件），使键盘消失，这个操作相对简单，且可行性较高。    

        实现原理：

        先看下图的objects

        

        这里可以看到整个控件布局的一个树形图，我们添加的所有控件都会放到一个根view上面的。这个View是不可见的，但是它充满了整个iphone屏幕，我们要做的就是写一个Action，希望能够使这个View所携带的一个event调用这个Action从而达到隐藏键盘的目的。但是这个根View的类型是UIView

        

        uiview中是没有event的，这样无法和action相关联起来。因此我们需要把根View的类型UIView改成UIControl，UIControl是UIView的子类，它包含所有UIView的特性，且里面有我们所需要的event，所以这样的改变是非常合理且可行的。

        

        objects中的类型也随之发生了变化，变成了control。

        

        2）创建一个Action：backgroundTap

        UIExample1ViewController.h:

- (IBAction)backgroundTap:(id)sender;

        UIExample1ViewController.m:

- (IBAction)backgroundTap:(id)sender{
    [NameField resignFirstResponder];//和上文中提到的作用类似
    [AgeField resignFirstResponder];
}

        3）关联action

        选中根Control，切换到connections inspector，因为我们希望的是点击任何地方，键盘都会隐藏，所以我们选中Touch Down event。按住鼠标左键拖到File's Owner，选择backgroundTap action，关联完毕。

        

        再次编译和运行，看数字键盘能否消失。ok，经测试，没有任何问题。

        今天就到此为止，一个最简单的app就创建出来了。明天继续研究iOS学习。