swift?實戰項目之 2048游戲

之前看過網上很多寫小項目的文章，但大多是舊版或者不全的，這里推出swift5 ?項目之2048給大家分享

?

【2020年更新，建議直接看源碼：源碼地址】

?

本文將要使用的思路和上面2020更新的源碼思路不一樣，本文的思路清晰但是代碼復雜。

1.首先新建一個項目，自動生成我們的viewController，添加如下代碼，構造最簡單的起始頁面：

class ViewController:UIViewController {

?

? ? override func viewDidLoad() {

? ? ? ? super.viewDidLoad()

?

? ? ? ?view.backgroundColor = UIColor.black

? ? ? ? let?wid =view.bounds.width

? ? ? ? let?hei =view.bounds.height

?

// 想點button跳轉入游戲界面，因此??

? ? ? ? let?startButton1 =UIButton(frame:CGRect(x:0, y:hei/3, width: wid, height:20))

? ? ? ? startButton1.setTitleColor(UIColor.red, for: .normal)

? ? ? ? startButton1.setTitle("2048",for: .normal)

//文字居中

? ? ? ?startButton1.contentHorizontalAlignment = .center

?

? ? ? ? startButton1.addTarget(self,action:#selector(start1),for: .touchUpInside)

? ?

? ? ? ? view.addSubview(startButton1)?

? ? }

// 點擊事件：需要新建一個swift文件：GamePanel.swift ，繼承UIViewController。點擊按鈕后就進這個ViewController界面。

??func?start1(){

? ? ? ??self.present(?GamePanel(), ?animated:?false, completion:?nil)

? ? }

?

?

GamePanel.swift：??

import Foundation

import UIKit

?

class GamePanel:UIViewController{

?

? ? let?dimension:Int =4 ? //?四行四列，等項目做完，試試自定義行列數。

? ? let?boardwidth:CGFloat! ? ?// ?游戲區域寬度

? ? let scorewidth:CGFloat=50 ? ?//?記分板垂直方向的寬度

? ? let thinPadding:CGFloat=5 ??// 最小滑塊的間距

? ? var unit:CGFloat! ? // ?最小滑塊的邊長

? ? var x:CGFloat! ? ?// ?包容小方塊的大正方形的位置 x，y，也就是游戲區域

? ? var y:CGFloat!

?

說到這，我們有大正方形，有最小滑塊，有記分板，那就得先新建三個類：

?

1、新建： GameView.swift，是大正方形，里面包著16個小正方形?

然后：?

? ? var game:GameView!

2、新建： ScoreView.swift，是記分板，顯示分數?

然后：

? ? var scoreBoard:ScoreView!

?3、一會再說，大正方形還沒寫呢，何談小塊？

?

構造方法

?

?init(?) {

? ? ???boardwidth?= 400 // 設成多寬隨意

? ? ???super.init(nibName:?nil, bundle:?nil）? ?// 這句沒意思 可照抄

? ? }

?

? ? override func?viewDidLoad() {

? ? ?? super.viewDidLoad()

準備好游戲區域大正方形的位置 x，y，為了居中，下面是簡單的計算

? ? ?? x = (view.bounds.width-boardwidth)/2

?? ? ? y = (view.bounds.height-boardwidth+scorewidth)/2

? ? ?? self.view.backgroundColor =UIColor(red:0.95, green:0.83, blue:1, alpha:1)

? ??

? ? 展示大正方形和積分板的倆方法：? ?? ?

?? ? ? showGridView()

?? ? ? showScoreBoard()

?

? ? }

??

? ? requiredinit?(coderaDecoder:NSCoder) {

?? ? ? fatalError("init(coder:) has not beenimplemented")

? ? }

?

GamePanel是負責控制游戲的（Controller），其他view要單設類重寫

?

這兩個方法可以在寫完那兩個類的構造方法再來寫，現在先寫個方法頭扔這就行

1 展示大正方形：

?

? ? func showGridView(){? ?

?

??? ? unit = (boardwidth-thinPadding*CGFloat(dimension+1))/CGFloat(dimension)

?

???game =GameView(unit:unit,dime:dimension,x:x,y:y,thin:thinPadding) ?//一會寫

?

? ? ?view.addSubview(game)

? ? }

?

2 展示記分板，

?

? ? func showScoreBoard(){

?

? ? ?? scoreBoard =ScoreView(unit:unit,y:y,screenX:view.bounds.width) //一會寫

?? ? ? scoreBoard.score =0

?

? ? ?? view.addSubview(scoreBoard)

? ? }

}

?

大方塊GameView.swift:

?

import Foundation

import UIKit

class GameView:UIView {

?

? ? var dimension:Int!

? ? var unitwidth:CGFloat!

? ? var thinPadding:CGFloat!

?

? ? var x:CGFloat!

? ? var y:CGFloat! ? ?// 這幾個屬性看之前注釋 一樣的意思

?

構造方法?

?

? ? init(unit:CGFloat,dime:Int,x:CGFloat,y:CGFloat,thin:CGFloat){

? ? ?? self.x= x

? ? ?? self.y= y

? ? ?? self.thinPadding= thin

? ? ?? self.dimension= dime

? ? ?? self.unitwidth= unit

?

? ? ? ?let wid = thinPadding!*CGFloat(dime+1)+unit*CGFloat(dime)

?

? ? 確定frame位置： ? ?

???? super.init(frame:CGRect(x:x, y: y, width: wid, height: wid))

?

? ? 調用下面的方法初始化小單元方格 ： ? ? ?

???? setGrid()

?

?}

?

? ? required init?(coderaDecoder: NSCoder) {

?? ? ? fatalError("init(coder:) has not beenimplemented")

?}

?

?? //初始化空的小單元們 ?PS。這只是初始化單元的位置，不是最小塊。

? ? func setGrid(){

?

?? ? ? layer.cornerRadius =10

? ?clipsToBounds?=?true

? ? ?? backgroundColor =UIColor(red:?0.73, green:?1, blue:?0.85, alpha:?1)

?

? ? ??

兩個for循環初始化位置：

?

? ?var?tempy:CGFloat=?0

?

? ? ?? for _?in??0..<dimension{

?

? ? ?? ? ? var tempx:CGFloat =0

?

? ? ?? ? ? for?_?in?0..<dimension{

?

? ? ?? ? ? ? ? let viewUnit=UIView(frame:CGRect(x:thinPadding+tempx, y:thinPadding+tempy, width:unitwidth,height: unitwidth))

?

? ? ?? ? ? ? ? viewUnit.layer.cornerRadius =8

?

? ? ? ?viewUnit.clipsToBounds =true

? ? ?? ? ? ? ? viewUnit.backgroundColor=UIColor(red:?0.9, green:?1, blue:?0.97, alpha:?1)

?

? ? ?? ? ? ? ? addSubview(viewUnit)

?

? ? ?? ? ? ? ? tempx += unitwidth+thinPadding

?

? ? ?? ? ? }

?

? ? ?? ? ? tempy += unitwidth+thinPadding

?

? ? ?? }

? ? }

?

下面是記分板類ScoreView.swift ?繼承 UILabel 。你也可以繼承UIView。我為了省事就這樣了。。

import Foundation

import UIKit

class ScoreView:UILabel{

?

屬性觀察者 傳score值

? ? var score:Int =0{

? ? ?? didSet{

? ? ?? ? ? text ="SCORE:\(score)"

? ? ?? }

? ? }

?

初始化

? ? init(unit:CGFloat,y:CGFloat,screenX:CGFloat){

?

? ? ?? let height:CGFloat=68 ? //?隨便

? ? ?? let width =2.5*unit ? ?// 自己定

?

根據屏幕和游戲區位置確定記分板位置：

? ? ?? let localX = (screenX-width)/2

? ? ?? let localY = (y-height)/2

?

? ? ?? super.init(frame:CGRect(x: localX, y: localY, width: width,height: height))

? ? ???

? ? ? ?backgroundColor =UIColor(red:?0.47, green: 0.84, blue:?0.97, alpha:?1)

?? ? ? textColor = UIColor.red

?? ? ? textAlignment = .center ? ?

? ? }

? ? required init?(coderaDecoder: NSCoder) {

?? ? ? fatalError("init(coder:) has not beenimplemented")

? ? }??

}

?

寫完排排錯 運行看看什么樣子

?

總結

以上是生活随笔為你收集整理的iOS swift 2048小游戏开发教程（一）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。