CocosCreator怎樣使用cc.follow進(jìn)行鏡頭跟隨

更新時間：2021年04月16日 15:37:46 作者：gamedaybyday

這篇文章主要介紹了CocosCreator怎樣使用cc.follow進(jìn)行鏡頭跟隨，想要學(xué)習(xí)follow的同學(xué)，一定要看一下

Cocos Creator版本：2.3.4

Demo下載：https://files-cdn.cnblogs.com/files/gamedaybyday/cocos2.3.4_ccfollow.7z

說先來使用下cocoscreator自帶的跟隨代碼，cc.follow。

CC.Follow使用

一、設(shè)置地圖適配容器leftNode

假設(shè)這是個橫屏跑酷游戲。地圖大小1500x1500，那么leftNode高寬為1500x1500，并且widget居左下對齊。

二、設(shè)置地圖容器map

地圖容器也是1500x1500，和leftNode區(qū)別就是沒有適配組件widget，因為你用了widget，就沒法讓地圖移動了。這也是為什么多套一層leftNode用來適配屏幕的原因。

地圖里有一個角色Role。（一個普通的cc.Button按鈕）

地圖四周有紅色的按鈕作為識別地圖邊緣。

地圖容器上掛組件Follow.ts，并設(shè)置target角色目標(biāo)為Role。Role就是一個按鈕cc.Button，我們這里把它當(dāng)成移動的角色。

Follow.ts代碼如下：

const {ccclass, property} = cc._decorator;
 
@ccclass
export default class Follow extends cc.Component {
 
    @property(cc.Node)
    target:cc.Node = null;
 
    start () {
        var follow = cc.follow(this.target, cc.rect(0,0, 1500,1500));
        this.node.runAction(follow);
    }
}

三、虛擬搖桿控制角色移動

虛擬搖桿參考：https://www.cnblogs.com/gamedaybyday/p/13061387.html

不知道也沒關(guān)系，只要你能用其他方法控制角色移動，改變角色的x,y就行。

四、實際演示效果

可以看到角色在移動時，“鏡頭”會自動跟隨角色Role移動，并且限制范圍在1500x1500內(nèi)，沒有超出放著紅色按鈕的邊界。

CC.Follow的源碼

源碼在CC.Action.js內(nèi)

以上就是CocosCreator怎樣使用cc.follow進(jìn)行鏡頭跟隨的詳細(xì)內(nèi)容，更多關(guān)于CocosCreator鏡頭跟隨的資料請關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章:

相關(guān)文章

小程序api實現(xiàn)promise封裝過程解析
這篇文章主要介紹了小程序api實現(xiàn)promise封裝過程解析,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
2019-11-11
JavaScript超過Number最大值的解決方案
在JavaScript中,Number類型是基于IEEE754雙精度浮點數(shù)標(biāo)準(zhǔn)表示的,雖然在常見場景下非常高效,但在處理大數(shù)據(jù)時,Number類型存在顯著的精度限制,在這些場景中,如何精確處理大數(shù)據(jù)和超大數(shù)字成為了一個重要的問題,所以本文給大家介紹了JavaScript超過Number最大值的解決方案
2025-01-01
javascritp添加url參數(shù)將參數(shù)加入到url中
javascritp添加url參數(shù)方法，將參數(shù)加入到url中,如果原來url中有則覆蓋，下面是示例代碼，感興趣的朋友可以參考下
2014-09-09
js 判斷一個數(shù)字是不是2的n次方冪的實例
下面小編就為大家分享一篇js 判斷一個數(shù)字是不是2的n次方冪的實例，具有很好的參考價值，希望對大家有所幫助
2017-11-11
javascript基于牛頓迭代法實現(xiàn)求浮點數(shù)的平方根【遞歸原理】
這篇文章主要介紹了javascript基于牛頓迭代法實現(xiàn)求浮點數(shù)的平方根,簡單說明了牛頓迭代法的原理,并結(jié)合實例分析了javascript基于遞歸的數(shù)值運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下
2017-09-09
詳談LABJS按需動態(tài)加載js文件
為了提高頁面的打開和加載速度，我們經(jīng)常把JS文件放在頁面的尾部，但是有些JS必須放在頁面前面，這樣就會增加頁面的加載時間；于是出現(xiàn)了按需動態(tài)加載的概念，這個概念就是當(dāng)頁面需要用到這個JS文件或者CSS渲染文件的時候，在去請求這些文件，這樣就節(jié)省了頁面的加載時間
2015-05-05
JS一維數(shù)組轉(zhuǎn)化為三維數(shù)組方法
這篇文章主要給大家分享了JS一維數(shù)組轉(zhuǎn)化為三維數(shù)組的方法，下面文章圍繞JS數(shù)組轉(zhuǎn)換的相關(guān)資料展開內(nèi)容，對大家的學(xué)習(xí)有一定的參考價值，需要的小伙伴可以參考一下
2022-01-01
完美實現(xiàn)仿QQ空間評論回復(fù)特效
這篇文章主要介紹了完美實現(xiàn)仿QQ空間評論回復(fù)特效，非常的實用，附上實例代碼給大家，有需要的小伙伴參考下吧。
2015-05-05
js實現(xiàn)無縫輪播圖插件封裝
這篇文章主要為大家詳細(xì)介紹了js實現(xiàn)無縫輪播圖插件封裝，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-07-07
JavaScript?日期和時間的格式化方法
這篇文章主要介紹了JavaScript?日期和時間的格式化,JavaScript?中的?Date?對象提供了許多方法和屬性，可以用于處理日期和時間，根據(jù)具體情況選擇適合的方法和技巧，需要的朋友可以參考下
2023-02-02