iOS Sprite Kit教程之编敲代码以及Xcode的介绍

iOS Sprite Kit教程之编敲代码以及Xcode的介绍

Xcode界面介绍

一个Xcode项目由非常多的文件组成,比如代码文件、资源文件等。Xcode会帮助开发人员对这些文件进行管理。所以,Xcode的界面也比較复杂,如图1.40所看到的。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

图1.40  Xcode的界面

在图1.40中能够看到Xcode的界面大致能够分为4大部分。

  • q  编号为1的部分是导航窗体。
  • q  编号为2的部分是代码编辑区域。
  • q  编号为3的部分是工具窗体。
  • q  编号为4的部分是显示程序调试信息的窗体。

本小节将对几个重要的区域进行解说。

1.导航窗体

导航窗体的作用是显示整个项目的树状结构。

开发人员能够依据自己的喜好对其进行大小调整,以及显示和隐藏(View|Navigators|Show/HideNavigator来实现显示和隐藏,或通过使用Hide
or show the Navigatorbutton来实现显示和隐藏)。

导航窗体能够显示8类不同的信息,所以又有了8个导航器。这8个导航器分别为:项目导航器、符号导航器、搜索导航器、问题导航器、測试导航器、调试导航器、断点导航器和日志导航器。能够通过导航窗体顶部的8个图标来进行导航之间的切换。

2.工具窗体

工具窗体能够对项目的一些设置信息进行编辑,开发人员也是能够进行随时显示和隐藏的(View|Utilities|Show/HideUtilities来实现显示和隐藏。或通过使用Hide
or show the Utilitiesbutton来实现显示和隐藏)。

工具窗体能够分为上下两个部分。上半部分显示的内容取决于开发人员在编辑器上正在编辑的文件类型,当中文件类型有3种例如以下:

  • q  当编辑器编辑的是代码文件时,工具窗体上半部分显示的内容为:文件查看器和高速帮助中的一个的内容。要想实现两个内容的切换,能够通过使用此窗体上半部分在顶部显示的图标来进行切换。
  • q  当编辑器编辑的是界面文件时,工具窗体上半部分显示的内容为:文件查看器、高速帮助、标识查看器、属性查看器、尺寸查看器和连接查看器中的一个的内容。要想实现6个内容的切换,能够通过使用此窗体上半部分在顶部显示的图标来进行切换。
  • q  当编辑器编辑的是场景文件是时。工具窗体的上半部分显示的内容为:文件查看器、高速帮助、以及节点查看器中的一个内容。

下半个工具窗体显示的内容是文件模板库、代码片断库、对象库和媒体库的当中一个内容。要想实现这4个内容的切换。能够通过使用此窗体下半部分在顶部显示的图标来进行切换。

3.编辑窗体

编辑窗体能够用来编写代码或编辑场景。

在顶端,有左右箭头和整个项目的层次显示。

4.目标窗体

目标窗体中包括了项目的程序和配置。这些配置指定了怎样构建程序代码。如图1.41所看到的。

在目标窗体的顶部,能够选择General、Capabilities、Info、Build
Settings、Build Phases、Build Rules中的内容。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

图1.41  目标窗体

Xcode中执行程序

了解了Xcode的界面构成后。我们来看Xcode是怎样进行程序执行的。执行程序仅仅须要单击执行button。如图1.42所看到的,程序会自己主动进行执行了。在执行程序前首先对程序进行编译。假设程序正确,会出现一个Build
Succeeded字符串。如图1.43所看到的。假设程序出现错误,那么就会出现一个Build Failed字符串,如图1.44所看到的。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

1.42  执行程序

图1.43  程序正确      
           图1.44  程序错误

在程序编译后。会自己主动对程序进行连接、执行,执行效果如图1.45~1.47所看到的。

图1.45  执行效果   
      图1.46  执行效果            图1.47  执行效果

注意:图1.45是应用程序的一个启动界面是系统自带的。开发人员真正要使用到的界面是1.46所看到的的界面。启动界面也是能够删除的。假设开发人员不想在程序执行时有启动界面,能够打开Info.plist文件,在此文件里找到Launch
screen interface file base name,将其value后面的内容删除。如图1.48所看到的。

图1.48  设置启动界面

iOS模拟器介绍

图1.45或者1.46所示类似于手机的模型就是iOS模拟器。iOS模拟器是在没有iPhone或iPad设备时,对程序进行检測的设备。iOS模拟器能够模仿真实的iPhone或iPad等设备的各种功能。本小节将解说一些有关模拟器的操作。

1.模拟器与真机的差别

iOS模拟器能够模仿真实的iPhone或iPad等设备的功能各种功能。如表1-4所看到的。

表1-4  iOS模拟器

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

iOS模拟器仅仅能实现表1-4中的这些功能,其他的功能是实现不了的,如打电话、发送SMS信息、获取位置数据、照照相、麦克风等。

2.退出程序

假设想要将图1.47所看到的的应用程序退出(为用户完毕某种特定功能所设计的程序被称为应用程序)。该怎么办呢?这时就须要选择菜单条中的Hardware|Home命令。退出应用程序后的效果,如图1.49所看到的。

图1.49  退出应用程序         图1.50  加入图像1

3.设置应用程序的图标

在图1.49中能够看到显示在iOS模拟器上的应用程序的图标为网状白色图像,它是iOS模拟器上的应用程序的默认图标。一般开发人员不会使用此图标的。而是使用自己定制的图标。

下面就是改动默认图标为自己定义图标的详细操作步骤。

(1右击Supporting Files目录,弹出快捷菜单,如图1.50所看到的。

(2选择Add Files to "Hello World"…命令,弹出选择文件对话框,如图1.51所看到的。

图1.51  加入图像2         图1.52  设置图标

(3选择须要加入的图像,单击Addbutton,实现图像的加入。

加入后的图像就会显示在Supporting
Files目录中。

(4单击打开Supporting Files目录中的Info.plist文件,在当中加入一项Icon
files,在其下拉菜单的Value中输入加入到Supporting Files目录中的图片,如图1.52所看到的。

此时执行程序。会看到如图1.53所看到的的效果。

图1.53  执行效果          图1.54  设置语言  图1.55  设置语言

4.设置语言

普通情况下iOS模拟器默认使用的English(英语)。

对于英文不好的开发人员来说,英文就像天书,怎么看也看不懂。

这时。就须要将iOS模拟器的语言进行设置。

要设置语言。须要切换到模拟器的主界面。向左拖动,找到Settings应用程序。

找到后既能够对iOS模拟器的语言进行设置了。下面将iOS模拟器的语言变为中文,详细操作过程例如以下:

(1切换到主界面,找到Settings应用程序,如图1.54所看到的。

(2选择Settings应用程序图标,进入Settings界面中。如图1.55所看到的。

(3选择General选项,进入General界面,如图1.56所看到的。

(4选择Language&Region选项。进入Language&Region界面中,如图1.57所看到的。

图1.56  设置语言  
                         图1.57  设置语言

(5选择iPhone Language选项。进入iPhone
Language界面,如图1.58所看到的。

(6选择“中文简体”选项。轻拍Donebutton,弹出动作表单。如图1.59所看到的。

图1.58  设置语言                图1.59  设置语言

(7选择Change to Chinese,Simplified选项,进入正在设置语言的界面,如图1.60所看到的。当语言设置好后,iOS模拟器将会退出到主界面,此时主界面的应用程序的标题名就变为了中文。如图1.61所看到的。

图1.60  设置语言                           图1.61  设置语言

5.旋转

真机能够进行旋转。模拟器相同也能够进行旋转。要实现iOS模拟器的旋转仅仅须要同一时候按住“Command+方向键”就能够了。下面是使用“Command+->”实现的iOS模拟器实现的向右旋转。如图1.62所看到的。

图1.62  旋转模拟器

假设想要让模拟器在一执行程序就进行旋转。即设备水平向左放置或者水平向右放置该怎么实现呢?这里有两种办法:第一种是在创建项目的General中进行设置;另外一种是使用代码进行设置。

1.General中的设置

在创建的项目中,打开目标窗体(单击项目名称。能够打开)。找到General选项。单击该选项,在General面板中找到Device
Orientation选项。Device Orientation后面有4个单选框,开发人员能够通过对这四个单选框的选择实现模拟器的旋转,如图1.63所看到的。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

图1.63  设置模拟器的旋转      图1.64  执行效果

图1.63是将Hello World应用程序中的模拟器进行了水平放置。

此时执行程序。会看到如图1.64所看到的的效果。

2.使用代码

代码来实现设备方向的改变。首先须要使用到supportedInterfaceOrientations()方法来实现设备方向的设置。其语法形式例如以下:

  • func supportedInterfaceOrientations() -> Int

当中,设备的方向包含7个,如表1-5所看到的。

表1-5  旋转方法

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

设置好设备的方向后,须要使用到shouldAutorotate()方法来让设备进行改变,其语法形式例如以下:

  • func shouldAutorotate() -> Bool

下面将使用代码,让Hello World应用程序中的模拟器进行水平放置。

打开GameViewController.swift文件,在此文件里编写代码,代码例如以下:

  • override func shouldAutorotate() -> Bool {
  • return true
  • }
  • override func supportedInterfaceOrientations() -> Int {
  • return Int(UIInterfaceOrientationMask.Landscape.rawValue)                            //让设备水平放置
  • }

此时执行程序,能够看到横屏显示的模拟器。

6.删除应用程序

假设在iOS模拟器中出现了非常多的应用程序,就能够将不再使用的应用程序进行删除。

这样一来能够为设备节省内存空间,也能够使用户或者开发人员便于管理自己的应用程序。

下面主要实现Hello
World应用程序的删除。

(1长按要删除的Hello World应用程序。直到全部的应用程序都開始抖动,并在每个应用程序的左上角出现一个“x”,它是一个删除标记。如图1.65所看到的。

(2单击Hello World程序左上角出现的删除标记,会弹出一个删除“Hello
World”对话框。选择当中的“删除”button。如图1.66所看到的。

这时Hello World应用程序就在iOS模拟器上删除了。

?

图1.65  删除应用程序1                         图1.66  删除应用程序2

场景编辑器

在图1.46和图1.47中所示模拟器中显示的内容都为场景,对于场景的设计有专门的场景编辑器。本小节将解说场景编辑器的组成、以及怎样设计。

1.场景编辑器的组成

单击项目中的GameScene.sks就能够打开场景编辑器。

场景编辑器分为了4部分,如图1.67所看到的。

图1.67  场景编辑器构成

当中。这四部分的说明例如以下:

  • q  编号为1的部分为导航窗体。
  • q  编号为2的部分为场景:在能够在当中放置一些节点。
  • q  编号为3的部分为工具窗格的检查器:用于编辑当前选择的对象的属性。
  • q  编号为4的部分为工具窗格的库:假设选择的是Objects,里边存放了节点以及其他。

2.设置场景

下面将在场景中显示一个标签,详细的操作过程例如以下:

(1单击工具窗体的库,在当中找到Show the Object Library。在Show
the Object Library中找到Label标签对象将其拖动到场景中,如图1.68所看到的。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

图1.68  设计场景

此时执行程序。会看到如图1.69所看到的的效果。

图1.69  执行效果

假设想要让新加入的标签对象有一个独特的风格。须要使用Show the SKNode inspector面板。如图1.70所看到的。

图1.70  设置标签

在图1.70中,我们将标签的Text设置为了Sprite
Kit,将标签的Color设置为了黑色。此时执行程序,会看到如图1.71所以的效果。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" >

图1.71  执行效果

Xcode编写代码

代码就是用来实现某一特定的功能而用计算机语言编写的命令序列的集合。如今就来通过代码实现标签的显示。详细的操作过程例如以下:

(1打开Hello World项目的GameScene.swift文件,将不使用的代码删除,此时剩余代码例如以下:

  • import SpriteKit
  • class GameScene: SKScene {
  • override func didMoveToView(view: SKView) {
  • }
  • }

(2在GameScene.swift文件里编写代码。此代码实现的功能是在场景中显示一个标签内容为"Never
betray Hello World"的标签对象。代码例如以下:

  • import SpriteKit
  • class GameScene: SKScene {
  • override func didMoveToView(view: SKView) {
  •   let label = SKLabelNode(fontNamed:"Chalkduster")                                    //实例化对象
  • label.text = "Never betray Hello World"                                                            //设置显示的内容
  • label.fontSize = 65                                                                                                   //设置文本大小
  • label.fontColor=SKColor.blueColor()                                                                 //设置颜色
  • label.position = CGPoint(x:CGRectGetMidX(self.frame),
    y:CGRectGetMidY(self.frame))
  • self.addChild(label)
  • }
  • }

此时执行程序。会看到如图1.72所看到的的效果。

图1.72  执行效果

本文选自:iOS游戏框架Sprite
Kit基础教程——Swift版大学霸内部资料,转载请注明出处,尊重技术尊重IT人。

时间: 2024-08-01 22:46:30

iOS Sprite Kit教程之编敲代码以及Xcode的介绍的相关文章

iOS Sprite Kit教程之场景的切换

iOS Sprite Kit教程之场景的切换 Sprite Kit中切换场景 每一个场景都不是单独存在的.玩家可以从一个场景中切换到另外一个场景中.本小节,我们来讲解场景切换.在每一个游戏中都会使用到场景与场景的切换功能,例如,在街机原始人游戏中,选择关卡这一场景中,可以看到有4关,这四关分别代表了4个场景,如图2.20所示. 图2.20  街机原始的关卡选择 当玩家选择第一关时,就会由选择关卡的场景跳转到第一关的场景中,如图2.21所示. 图2.21  第一关的场景 当玩家选择第二关时,就会由

iOS Sprite Kit教程之真机测试以及场景的添加与展示

iOS Sprite Kit教程之真机测试以及场景的添加与展示 IOS实现真机测试 在进行真机测试之前,首先需要确保设备已经连在了Mac(或者Mac虚拟机)上,在第1.9.1小节开始,设备就一直连接在Mac(或者Mac虚拟机)上,并且此设备就是注册过的.打开创建的项目,在运行按钮一栏中,将程序运行的设备设置为真机的名称.它会自动加载到"选择程序运行的设备"这一项中,如图1.102所示.单击运行按钮,就可以看到应用程序在真机上运行了. 图1.102  设置设备 Sprite Kit的场景

iOS Sprite Kit教程之使用帮助文档以及调试程序

iOS Sprite Kit教程之使用帮助文档以及调试程序 IOS中使用帮助文档 在编写代码的时候,可能会遇到很多的方法.如果开发者对这些方法的功能,以及参数不是很了解,就可以使用帮助文档.那么帮助文本该如何打开以及如何查找相关的内容呢?以下将为你解决这些问题. 1.打开帮助文档 要使用帮助文本,必须要对其进行打开.选择Help|Documentation and API Reference命令,如图1.73所示,就可以打开了,打开后的帮助文档如图1.74所示.   图1.73  打开帮助文档

iOS Sprite Kit教程之编写程序以及Xcode的介绍

iOS Sprite Kit教程之编写程序以及Xcode的介绍 Xcode界面介绍 一个Xcode项目由很多的文件组成,例如代码文件.资源文件等.Xcode会帮助开发者对这些文件进行管理.所以,Xcode的界面也比较复杂,如图1.40所示. 图1.40  Xcode的界面 在图1.40中可以看到Xcode的界面大致可以分为4大部分. q  编号为1的部分是导航窗口. q  编号为2的部分是代码编辑区域. q  编号为3的部分是工具窗口. q  编号为4的部分是显示程序调试信息的窗口. 本小节将对

iOS Sprite Kit教程之场景的设置

iOS Sprite Kit教程之场景的设置 Sprite Kit中设置场景 在图2.8所示的效果中,可以看到新增的场景是没有任何内容的,本节将讲解对场景的三个设置,即颜色的设置.显示模式的设置以及测试信息的设置. Sprite Kit中设置场景的背影颜色 backgroundColor属性可以用来对场景的背影颜色进行设置,其语法形式如下: var backgroundColor: CGColor! UIColor类给开发者提供了一些便利的方法快速制作常见的颜色的名称,而不是使用确定的RGB值.

iOS Sprite Kit教程之滚动场景

iOS Sprite Kit教程之滚动场景 滚动场景 在很多的游戏中,场景都不是静止的,而是滚动的,如在植物大战僵尸的游戏中,它的场景如图2.26所示. 图2.26  植物大战僵尸 在图2.26中,用黑色框框住的部分是在屏幕上显示的,即玩家是可以看到的.右边的这些内容玩家就看不到了,为了让玩家可以熟悉场景中的内容,此游戏在开始时,首先对屏幕中的场景进行滚动.本节将为开发者实现场景滚动的功能. Sprite Kit中让场景进行滚动 以下是如何让一个场景进行滚动的具体实现方法. 1.创建项目以及添加

iOS Sprite Kit教程之申请和下载证书

iOS Sprite Kit教程之申请和下载证书 模拟器虽然可以实现真机上的一些功能,但是它是有局限的.例如,在模拟器上没有重力感应.相机机等.如果想要进行此方面的游戏的开发,进行程序测试时,模拟器显示就不是首选了,需要使用真机进行测试.本节将讲解真机进行测试前的准备工作.和如何进行真机测试. ios中申请和下载证书 申请和下载证书的具体步骤如下: 1.创建App ID 在申请和下载证书之前,首先要创建一个App ID.App ID是一系列字符,用于唯一标识iOS设备中的应用程序.创建App I

iOS Sprite Kit教程之xcode安装以及苹果帐号绑定

iOS Sprite Kit教程之xcode安装以及苹果帐号绑定 其他的站点上下载安装Xcode 有时候,应用商店下载较慢,所以用户也能够选择从其它站点下载Xcode安装文件.以下解说这样的Xcode的安装步骤: (1)双击下载的Xcode软件,弹出正在打开此软件的对话框,如图1.26所看到的. (2)打开该软件后,就会弹出Xcode对话框,如图1.27所看到的. 图1.26  操作步骤1                                     图1.27  操作步骤2 (3)将

iOS Sprite Kit最新特性Physics Field虚拟物理场Swift測试

在WWDC2014上,Sprite Kit又有了非常多新的提升! 当中一个非常有意思的东西就是Physics Field!也就是物理场! 这意味着我们在Sprite kit上编写虚拟物理场的游戏将变得非常easy! 这里我依据WWDC2014上What's new in Sprite kit的官方视频上的DEMO, 用Swift语言自己做了一个Demo. 截图例如以下: 先放上GitHub链接: https://github.com/songrotek/PhysicsFieldsWorld.gi