SpriteKit之使用精靈SKSpriteNode

精靈是創(chuàng)建場景內(nèi)容的基石酪耕,用SKSpriteNode表示。美工創(chuàng)建好圖像滓彰,游戲內(nèi)加載圖像作為紋理控妻,然后使用紋理創(chuàng)建精靈并添加到場景中。

本文使用的是Xcode8.0揭绑,語言是Swift3.0弓候。

1 創(chuàng)建精靈

最簡單的利用圖片創(chuàng)建精靈方式:

let ship = SKSpriteNode(imageNamed: "Spaceship")
ship.position = view!.center
addChild(ship)

如下:

屏幕快照 2017-02-05 上午11.26.27.png

這種方式創(chuàng)建的精靈,有很多默認(rèn)的行為:

  • 精靈的尺寸和圖片的size相同
  • 精靈以圖片的中心位置來渲染
  • 精靈在幀緩沖區(qū)中是半透明的
  • 一個SKTexture對象被創(chuàng)建并附加到了精靈上他匪。

2 定制精靈

精靈從創(chuàng)建到呈現(xiàn)到界面菇存,會經(jīng)過四個階段:定位、調(diào)整尺寸邦蜜、著色依鸥、混合,這四個階段我們都是可以通過修改精靈的屬性來進行控制的畦徘。

2.1 使用錨點移動精靈的frame

精靈的anchorPoint屬性決定frame的哪一點定位在精靈的位置上毕籽,錨點在單位坐標(biāo)系中指定抬闯,單位坐標(biāo)系如下:

屏幕快照 2017-02-05 上午11.18.50.png

設(shè)置錨點:

//使用錨點,移動ship关筒,錨點范圍0--1溶握,默認(rèn)為(0.5, 0.5)
ship.anchorPoint = CGPoint(x: 0.5, y: 1)
屏幕快照 2017-02-05 上午11.27.25.png

指定錨點后,如果對精靈進行旋轉(zhuǎn)蒸播,則會圍繞著錨點旋轉(zhuǎn)睡榆,如下:

//旋轉(zhuǎn)90度
ship.zRotation = CGFloat(M_PI_2)
屏幕快照 2017-02-05 上午11.31.09.png

2.2 調(diào)整尺寸

精靈的尺寸有它的三個屬性決定的:

  • size屬性是精靈的基準(zhǔn)尺寸,該值和紋理的尺寸相等袍榆。
  • xScale與yScale屬性胀屿,對基準(zhǔn)尺寸進行縮放。
        //使用Scale屬性對精靈進行縮放
        ship.xScale = 0.3
        ship.yScale = 0.3

如下:

屏幕快照 2017-02-05 上午11.39.22.png

2.3 著色

紋理應(yīng)用到精靈之前包雀,可以使用color和colorBlendFactor進行著色宿崭,color決定顏色,colorBlendFactor屬性是混合因子才写,默認(rèn)為0葡兑。如下,我們給飛船添加一個紅色色調(diào):

        //使用color和colorBlendFactor屬性對精靈進行著色赞草,默認(rèn)混合因子colorBlendFactor為0
        ship.color = SKColor.red
        ship.colorBlendFactor = 0.5

如圖:

屏幕快照 2017-02-05 上午11.43.08.png

添加一個顏色變化的動畫:

        //顏色動畫
        let pulseRed = SKAction.sequence([SKAction.colorize(with: SKColor.red, colorBlendFactor: 0.5, duration: 0.2),
                                          SKAction.wait(forDuration: 0.1),
                                          SKAction.colorize(withColorBlendFactor: 0, duration: 0.1)])
        ship.run(SKAction.repeatForever(pulseRed))
2017-02-05 12_00_53.gif

2.4 混合精靈到幀緩沖區(qū)

渲染的最終階段是把精靈的紋理混合到目標(biāo)幀緩沖區(qū)讹堤,默認(rèn)是使用紋理的alpha值混合紋理與目標(biāo)像素,但是厨疙,當(dāng)想添加其它特效到場景時洲守,可以使用其它混合模式≌雌啵可以使用BlendMode屬性來控制精靈的混合行為:

        //使用BlendMode屬性控制精靈混合行為
        ship.blendMode = .add

3 使用紋理對象

雖然我們可以用上面的方法一個一個的創(chuàng)建精靈梗醇,但是,假如有很多精靈共用一個圖像時搭独,使用使用圖像創(chuàng)建出紋理婴削,然后通過紋理創(chuàng)建精靈是更好的方式,使用紋理創(chuàng)建的好處是不用每次都去bundle加載圖像牙肝,只需要加載一次到紋理中即可。

我們給場景添加一個功能嗤朴,當(dāng)點擊某一點時配椭,在該點生成一架飛船,再次點擊時雹姊,上一次生成的飛船往下掉股缸,知道飛出屏幕,代碼如下:

    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        let touch = touches.first
        addTextureShip(touch!)
    }
    
    func addTextureShip(_ touch: UITouch) {
        //使用小部分紋理吱雏,我們可以在原紋理的基礎(chǔ)上敦姻,只使用其中的某一部分
        let texture = SKTexture(rect: CGRect(x: 0, y: 0.5, width: 1.0, height: 0.5), in: shipTexture)
        
        let ship = SKSpriteNode(texture: texture, size: CGSize(width: 40, height: 40))
        ship.position = touch.location(in: self)
        ship.name = "Ship"
        ship.zRotation = CGFloat(M_PI)
        
        enumerateChildNodes(withName: "Ship") { (node, _) in
            let current = node as! SKSpriteNode
            if current.physicsBody == nil {
                current.physicsBody = SKPhysicsBody(rectangleOf: current.size)
            }
        }
        
        addChild(ship)
    }
    
    override func didSimulatePhysics() {
        enumerateChildNodes(withName: "Ship") { (node, _) in
            if node.position.y < 0 {
                node.removeFromParent()
            }
        }
    }

最終效果:

2017-02-05 12_01_33.gif

結(jié)語

本文學(xué)習(xí)了精靈的創(chuàng)建瘾境,修改等操作,精靈是游戲的基石镰惦。

本文代碼(game02):https://github.com/flywo/SwiftGame

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末迷守,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子旺入,更是在濱河造成了極大的恐慌兑凿,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,723評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件茵瘾,死亡現(xiàn)場離奇詭異礼华,居然都是意外死亡,警方通過查閱死者的電腦和手機拗秘,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,485評論 2 382
  • 文/潘曉璐 我一進店門圣絮,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人雕旨,你說我怎么就攤上這事扮匠。” “怎么了奸腺?”我有些...
    開封第一講書人閱讀 152,998評論 0 344
  • 文/不壞的土叔 我叫張陵餐禁,是天一觀的道長。 經(jīng)常有香客問我突照,道長帮非,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,323評論 1 279
  • 正文 為了忘掉前任讹蘑,我火速辦了婚禮末盔,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘座慰。我一直安慰自己陨舱,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 64,355評論 5 374
  • 文/花漫 我一把揭開白布版仔。 她就那樣靜靜地躺著游盲,像睡著了一般。 火紅的嫁衣襯著肌膚如雪蛮粮。 梳的紋絲不亂的頭發(fā)上益缎,一...
    開封第一講書人閱讀 49,079評論 1 285
  • 那天,我揣著相機與錄音然想,去河邊找鬼莺奔。 笑死,一個胖子當(dāng)著我的面吹牛变泄,可吹牛的內(nèi)容都是我干的令哟。 我是一名探鬼主播恼琼,決...
    沈念sama閱讀 38,389評論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼屏富!你這毒婦竟也來了晴竞?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,019評論 0 259
  • 序言:老撾萬榮一對情侶失蹤役听,失蹤者是張志新(化名)和其女友劉穎颓鲜,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體典予,經(jīng)...
    沈念sama閱讀 43,519評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡甜滨,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,971評論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了瘤袖。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片衣摩。...
    茶點故事閱讀 38,100評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖捂敌,靈堂內(nèi)的尸體忽然破棺而出艾扮,到底是詐尸還是另有隱情,我是刑警寧澤占婉,帶...
    沈念sama閱讀 33,738評論 4 324
  • 正文 年R本政府宣布泡嘴,位于F島的核電站,受9級特大地震影響逆济,放射性物質(zhì)發(fā)生泄漏酌予。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,293評論 3 307
  • 文/蒙蒙 一奖慌、第九天 我趴在偏房一處隱蔽的房頂上張望抛虫。 院中可真熱鬧,春花似錦简僧、人聲如沸建椰。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,289評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽棉姐。三九已至,卻和暖如春啦逆,著一層夾襖步出監(jiān)牢的瞬間谅海,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,517評論 1 262
  • 我被黑心中介騙來泰國打工蹦浦, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人撞蜂。 一個月前我還...
    沈念sama閱讀 45,547評論 2 354
  • 正文 我出身青樓盲镶,卻偏偏與公主長得像侥袜,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子溉贿,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 42,834評論 2 345

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,516評論 25 707
  • 紋理(Textures) 我們已經(jīng)了解到枫吧,我們可以為每個頂點使用顏色來增加圖形的細節(jié),從而創(chuàng)建出有趣的圖像宇色。但是通...
    IceMJ閱讀 5,621評論 2 13
  • 本文來自于CSDN博客九杂,作者:晏博,已獲授權(quán)宣蠕,版權(quán)歸原作者所有例隆,未經(jīng)作者同意,請勿轉(zhuǎn)載抢蚀。 背景 陸陸續(xù)續(xù)一年多镀层,總...
    passiontim閱讀 834評論 0 5
  • 文|舍舍魚 不知道是否每個男孩子唱逢,都有一個武俠夢? 作為一個時而淑女屋休,時而漢子的雙魚座女生坞古,我是有的。 年少的時候...
    舍舍魚閱讀 2,966評論 16 13
  • 獨自 徘徊在樓梯口 彷徨在這 熟悉 卻又陌生的校園 我想回到那個夏天 一起寫卷子 一起跑一千 一起打籃球 一起罵老...
    弦斷閱讀 199評論 0 0