[SceneKit專題]23-跨平臺遊戲(macOS,tvOS,watchOS)

說明

本系列文章是對<3D Apple Games by Tutorials>一書的學習記錄和體會

此書對應的代碼地址

SceneKit系列文章目錄

更多iOS相關知識查看github上WeekWeekUpProject

之前面的遊戲爲例,將其改成跨平臺版本:

• macOS遊戲Geometry Fighter

• tvOS遊戲Breaker

• watchOS遊戲Geometry Fighter

16-macOS遊戲Geometry Fighter

建立項目

打開Xcode建立新項目,選擇macOS平臺,選擇Game類型,點擊Next繼續.

輸入遊戲名SceneKitGame,選擇Swift語言,SceneKit遊戲技術,取消Unit和UI Tests,點擊Finish.

生成的項目相似於iOS項目,但不徹底相同:

• GameView.swift:繼承於SCNView,能夠響應鼠標鍵盤事件但不能觸摸.
• GameViewController.swift:繼承於NSViewController.
• MainMenu.xib:控制器的xib.

選擇My Mac,運行一下游戲:

轉換SceneKit遊戲

能夠在projects/ starter/GeometryFighter/ 中打到原iOS版的項目.

打開iOS版項目,點擊GeometryFighter,添加新的target:

選擇Add Target...

選擇macOS平臺,而後選擇Game

輸入項目名GeometryFighterMac,選擇SceneKit,取消Unit Tests和UI Tests,點擊Finish:

選擇GeometryFighterMac > My Mac做爲Active Scheme.

運行後,看到的仍是默認的飛機場景,那是由於還須要其餘步驟.

多個target內容共享

能夠在iOS和macOS之間共享原來的代碼和資源.建立一個Shared分組

將下列文件和文件夾移動到Shared下面:

按住Shift鍵,選中GeometryFighter/ Shared/Particles下面的所有文件,打開右側的屬性檢查器,勾選Target Membership下面的GeometryFighterMac;這樣就能在iOS target和macOS target之間共享了.

Shared下面的其餘幾個也是相似操做.

爲了解決跨平臺帶來的問題,還須要添加下列代碼:

#if os(iOS)
import UIKit
#endif
#if os(macOS)
import Cocoa
#endif
複製代碼

固然了,咱們不須要每一個文件都去添加,只須要將已建立好的resources/ GameUtils/ 文件導入進來就能夠了.首先,刪除一些舊文件,選中GameHelper.swift和UIColor+Extensions.swift. 右鍵--刪除--Move to Trash. 將resources/ GameUtils/ 下面的全部文件拖放到Shared/ GameUtils/ 文件夾下

清理

還須要清理一下項目.選中GameView.swift, GameViewController.swift和art.scnassets.右鍵刪除--Move to Trash.

而後從示例代碼中本章節的resources/GameViewController文件夾下拖放GameView.swift和GameViewController.swift到項目中,選中Copy items if needed和GeometryFighterMac,點擊Finish完成.

還要作的是恢復新的GameViewController與MainMenu.xib之間的聯繫.

鼠標輸入

選中MainMenu.xib,從右側對象庫中拖放一個Click Gesture Recognizer到Game View中.

添加鏈接函數:

如今還差最後一步,添加AppIcon,你能夠從本章節的resources/AppIcon/文件夾中找到,拖放到Assets.xcassets中的AppIcon下:

運行一下程序:

本項目的最終完成版代碼能夠在對應章節的projects/ final/GeometryFighter/ 下找到.

17-tvOS遊戲Breaker

建立項目

建立項目

在Active Scheme中選擇SceneKitGame > tvOS Simulator > Apple TV 1080p:

運行一下,能夠看到默認的飛機模型.可是真實的Apple TV是要用遙控器操做的,怎麼用呢?在模擬器的Hardware > Show Apple TV Remote中,就能夠調出遙控器了:

移植到tvOS

在代碼中找到本章節的projects/ starter/Breaker/ 文件夾接着處理.

和前面相似,選中Breaker,添加新的target,在彈出窗中選擇tvOS和Game.

targets間內容共享

添加一個Shared分組,並將原來的文件拖放進來:

逐一選中文件夾下的全部文件,添加Target Membership:

還須要清理一下代碼. 選中BreakerTV/art.scnassets和BreakerTV/GameViewController.swift,刪除--Move To Trash:

添加專用代碼

打開GameViewController.swift,在setupNodes()末尾添加代碼:

#if os(tvOS)
  scnView.pointOfView = horizontalCameraNode
#endif
複製代碼

還有shouldAutorotate, prefersStatusBarHidden和viewWillTransition()也不須要了:

#if os(iOS)
override var shouldAutorotate: Bool {
... }
override var prefersStatusBarHidden: Bool {
... }
override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
... }
#endif
複製代碼

遙控觸摸事件

和iOS的觸摸事件不一樣,遙控上更接近MacBook的觸摸板的邏輯,touchesBegin()的初始位置老是(x:960, y: 540),即1080p顯示器的中心,touchesMoved()時的位置則是相對於初始點的位置.

另外還有一個問題:tvOS遙控器的觸摸板太靈敏了,輕微移動就是很長距離.咱們須要在GameViewController中找到下面的代碼:

paddleNode.position.x = paddleX +
  (Float(location.x - touchX) * 0.1)
複製代碼

將其更改成:

#if os(iOS)
  paddleNode.position.x = paddleX +
    (Float(location.x - touchX) * 0.1)
#elseif os(tvOS)
  paddleNode.position.x = paddleX +
    (Float(location.x - touchX) * 0.01)
#endif
複製代碼

圖標

圖標資源在本章節對應的resources文件夾下.

打開BreakerTV/Assets.xcassets,選中App Icon & Top Shelf Image,將圖片拖放進去:

運行一下,看到圖標出如今Apple TV首頁上了:

點擊進入遊戲,開始玩吧:

18-watchOS遊戲Geometry Fighter

在Xcode中,並無專門的watchOS版遊戲的模板,咱們須要作的是建立一個iOS的遊戲,再給它添加watchOS的支持.

添加watchOS支持

咱們直接在原iOS項目基礎上添加watchOS的target:

在Active Scheme中選擇GeometryFighterWatch > iPhone 6s Plus + Apple Watch - 42mm

運行一下,看看效果:

targets間內容共享

建立Shared文件夾,移動須要的文件

而後依次選中各個文件夾下面的全部文件,添加Target Membership:

添加界面控制器

首先清理項目,選中InterfaceController.swift和art.scnassets.右鍵--刪除--Move to Trash.

如今須要添加新的InterfaceController.swift.在本章節對應代碼的resources/source文件夾下,拖放到Xcode中.

而後創建鏈接:

添加觸摸輸入

選中Interface.storyboard,拖放一個Tap Gesture Recognizer過來.

創建手勢的鏈接:

如今已經基本完成了.

圖標

所需圖片資源在本章節對應的resource/AppIcon文件夾下.

選中Assets.xcassets下面的AppIcon,將圖片拖放到其中:

運行一下,能夠愉快地玩耍了!

項目的最終完成版本章節對應的projects/ final/GeometryFighter/ 文件夾下.