首頁 資料庫 mysql教程 cocos2d中的anchorPoint

cocos2d中的anchorPoint

Jun 07, 2016 pm 03:25 PM
圖片 放置

将该图片放置到屏幕左下方 CCSprite sprite = CCSprite.sprite( Default.png ); addChild(sprite); 生成的精灵放置在(0,0),也就是屏幕左下角。但是精灵的贴图的中心点和精灵的左下角位置一致,导致贴图只能显示一部分(贴图的右边上半部分)。 可以这样想

cocos2d中的anchorPoint

将该图片放置到屏幕左下方

CCSprite sprite = CCSprite.sprite(<span>"</span><span>Default.png</span><span>"</span>);  
addChild(sprite);  
登入後複製

生成的精灵放置在( 0,0 ),也就是屏幕左下角。但是精灵的贴图的中心点和精灵的左下角位置一致 ,导致贴图只能显示一部分(贴图的右边上半部分)。

cocos2d中的anchorPoint

可以这样想,一个精灵有两部分,一部分是节点背景对象 ,另一部分是贴图对象 (自己理解定义的名称,非官方)

 

怎么可以让贴图完全显示出来呢?使用定位点

 

每个节点都有一个定位点,但是只有当节点拥有贴图时,这个定位点才有用。默认情况下, anchorPoint 属性设置为(0.5,0.5 )

 

定位点和节点的位置没有关系。当改变 anchorPoint 属性的时候,我们能看到精灵在屏幕上的位置发生了变化,但是其实节点没有改变;改变的是精灵里贴图的位置

cocos2d中的anchorPoint

CCSprite sprite = CCSprite.sprite(<span>"</span><span>Default.png</span><span>"</span>);  
sprite.setScale(<span>0.6f</span>);  
sprite.setPosition(CGPoint.make(<span>500</span>, <span>300</span>));  
addChild(sprite);  
              
ccMacros.CCLOGERROR(<span>"</span><span>test</span><span>"</span>, <span>"</span><span>Position:</span><span>"</span>+sprite.getPosition().x +<span>"</span><span>--</span><span>"</span>+sprite.getPosition().y);  
ccMacros.CCLOGERROR(<span>"</span><span>test</span><span>"</span>, <span>"</span><span>AnchorPoint:</span><span>"</span>+sprite.getAnchorPoint().x +<span>"</span><span>--</span><span>"</span>+sprite.getAnchorPoint().y);  
ccMacros.CCLOGERROR(<span>"</span><span>test</span><span>"</span>, <span>"</span><span>AnchorPointInPixels:</span><span>"</span>+sprite.getAnchorPointInPixels().x+<span>"</span><span>--</span><span>"</span>+sprite.getAnchorPointInPixels().y);  
登入後複製

cocos2d中的anchorPoint

cocos2d中的anchorPoint

cocos2d中的anchorPoint

修改定位点为0

CCSprite sprite = CCSprite.sprite(<span>"</span><span>Default.png</span><span>"</span>);  
sprite.setScale(<span>0.6f</span>);  
sprite.setPosition(CGPoint.make(<span>500</span>, <span>300</span>));  
sprite.setAnchorPoint(CGPoint.make(<span>0</span>, <span>0</span>));  
addChild(sprite);  
登入後複製

cocos2d中的anchorPoint

cocos2d中的anchorPoint

从上面可以看出来精灵的位置没有发生变化,发生变化的只是贴图对象 相对于节点背景对象 的偏移 。

默认情况下 anchorPoint 为( 0.5,0.5 ),即贴图对象 的中心位置对应着节点背景对象 的左下角;而当 anchorPoint 为(0,0 ),即贴图对象 的左下角对应着节点背景对象 的左下角

 

所以按照下面的代码,图片就可以正好显示在左下角了

CCSprite sprite = CCSprite.sprite(<span>"</span><span>Default.png</span><span>"</span>);  
sprite.setAnchorPoint(CGPoint.make(<span>0</span>, <span>0</span>));  
addChild(sprite);  
登入後複製

cocos2d中的anchorPoint

 

附:AnchorPoint问题:

设置AnchorPoint,到底有什么作用,当初我的理解是这个AnchorPoint是相对本身位置参考点。 
比如:我定义个Sprite,设置一个anchorPoint为居中置顶的位置 。
           sprite.anchorPoint = ccp( intW / 2, intH );
           sprite.rotation  = 90;
但实际翻转时还是以左下角为参考点翻转。更改的参考点并不起作用,或者我理解错误。
问题:

1:想实现我这个更改翻转的参考点,如何实现?;
2:AnchorPoint到底做什么用?



答:这个属性表示你这个图片setPosition时的点在图片上所处的位置.
取值范围0-1
0,0表示左下角,
1,1表示右上角
0.5,0.5表示图片的中心点.

所有的图片都是以矩形来界定的.



问:这样设置翻转时还是以左下角为参考点


答:在设置 anchorPoint 的时候,   
imageVIew = [[UIImageView alloc] init];
imageView.anchorPoint = ccp(0.5, 1);
imageView.frame = CGRectMake(.......);

好像是先设置 anchorPoint, 再设置 frame.  试试.



答:问题算是解决了。说说基本思路。 
我之前定义一个Sprite,初始化时用一个ColorLayer 填充精灵 代码如下: 
+ (id) BulletWithinLayer:(CCLayer *) layer 

    BQBullet *bullet = [BQBullet node]; 
     
    //bullet.anchorPoint = ccp(0.5,1);///注释A 
    [bullet SetLayer:layer]; 
     
    return bullet; 


-(id)init 


    if((self == [super init])) 
    { 
        CCColorLayer *tmp = [CCColorLayer layerWithColor:ccc4(255, 255, 0, 255)]; 
        //tmp.anchorPoint = ccp(0.5,1);  ///注释B 
        [self addChild:tmp z:0 tag:1]; 
    } 
    return self; 


//生成一个bullet精灵 
BQBullet *bullet = [BulletWithinLayer:layer]; 
bullet.anchorPoint= ccp(0.5,1); 
bullet.rotation= 45; 
[layer addChild: bullet z:1]; 

这时看到的翻转还是已左下角,关闭注释A,B都是无效。 

后面我用一个图片代替ColorLayer生成精灵,就有效果了。 

为什么会有这种区别呢?更填充的层有关系吗?真是没搞懂啊?虽然说最后游戏不是这种写法,但对程序员来说,在没有图的情况下应该也能完成一个游戏,就是用单纯的色块来替换,这样就不用等美术图出来了,也能更早的出模型,至少以前在J2ME上都是可以这样做的,现在在iphone上,画个色块就TMD的这么麻烦,真是很不爽! 



针对:色块无法翻转的问题找到了,因为色块是ColorLayer,CCLayer默认的isRelativeAnchorPoint = NO;重新打开就行了isRelativeAnchorPoint = YES;


本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

小紅書發布自動儲存圖片怎麼解決?發布自動保存圖片在哪裡? 小紅書發布自動儲存圖片怎麼解決?發布自動保存圖片在哪裡? Mar 22, 2024 am 08:06 AM

隨著社群媒體的不斷發展,小紅書已經成為越來越多年輕人分享生活、發現美好事物的平台。許多用戶在發布圖片時遇到了自動儲存的問題,這讓他們感到十分困擾。那麼,如何解決這個問題呢?一、小紅書發布自動儲存圖片怎麼解決? 1.清除快取首先,我們可以嘗試清除小紅書的快取資料。步驟如下:(1)開啟小紅書,點選右下角的「我的」按鈕;(2)在個人中心頁面,找到「設定」並點選;(3)向下捲動,找到「清除快取」選項,點擊確認。清除快取後,重新進入小紅書,嘗試發布圖片看是否解決了自動儲存的問題。 2.更新小紅書版本確保你的小

抖音評論裡怎麼發圖片?評論區圖片入口在哪裡? 抖音評論裡怎麼發圖片?評論區圖片入口在哪裡? Mar 21, 2024 pm 09:12 PM

隨著抖音短影片的火爆,用戶們在留言區互動變得更加豐富多彩。有些用戶希望在評論中分享圖片,以便更好地表達自己的觀點或情感。那麼,抖音評論裡怎麼發圖片呢?本文將為你詳細解答這個問題,並為你提供一些相關的技巧和注意事項。一、抖音評論裡怎麼發圖片? 1.開啟抖音:首先,你需要開啟抖音APP,並登入你的帳號。 2.找到評論區:瀏覽或發布短影片時,找到想要評論的地方,點擊「評論」按鈕。 3.輸入評論內容:在留言區輸入你的評論內容。 4.選擇傳送圖片:在輸入評論內容的介面,你會看到一個「圖片」按鈕或「+」號按鈕,點

ppt怎麼讓圖片一張一張出來 ppt怎麼讓圖片一張一張出來 Mar 25, 2024 pm 04:00 PM

在PowerPoint中,讓圖片逐一顯示是常用的技巧,可以透過設定動畫效果來實現。本指南詳細介紹了實現此技巧的步驟,包括基本設定、圖片插入、新增動畫、調整動畫順序和時間。此外,還提供了進階設定和調整,例如使用觸發器、調整動畫速度和順序,以及預覽動畫效果。透過遵循這些步驟和技巧,使用者可以輕鬆地在PowerPoint中設定圖片逐一出現,從而提升簡報的視覺效果並吸引觀眾的注意力。

在 iPhone 上讓圖片更清晰的 6 種方法 在 iPhone 上讓圖片更清晰的 6 種方法 Mar 04, 2024 pm 06:25 PM

Apple最近的iPhone可以透過清晰的細節、飽和度和亮度來捕捉回憶。但有時,您可能會遇到一些問題,這些問題可能會導致影像看起來不那麼清晰。儘管iPhone相機上的自動對焦已經取得了長足的進步,可以讓您快速拍照,但相機在某些情況下可能會錯誤地對焦錯誤的拍攝對象,從而使照片在不需要的區域更加模糊。如果iPhone上的照片看起來失焦或整體缺乏清晰度,以下貼文應該可以幫助您使它們更清晰。如何在iPhone上讓圖片更清晰[6種方法]您可以嘗試使用本機的「照片」應用程式來清理照片。如果您需要更多功能和選項

如何使用HTML、CSS和jQuery實現圖片合併展示的進階功能 如何使用HTML、CSS和jQuery實現圖片合併展示的進階功能 Oct 27, 2023 pm 04:36 PM

如何使用HTML、CSS和jQuery實現圖片合併展示的高級功能概述:在網頁設計中,圖片展示是一個重要的環節,而圖片合併展示是提高頁面加載速度和提升用戶體驗的常用技巧之一。本文將介紹如何使用HTML、CSS和jQuery來實現圖片合併展示的進階功能,並提供具體的程式碼範例。一、HTML佈局:首先,我們需要在HTML中建立一個容器來展示合併後的圖片。可以使用di

網頁圖片載入不出來怎麼辦? 6種解決辦法 網頁圖片載入不出來怎麼辦? 6種解決辦法 Mar 15, 2024 am 10:30 AM

  有網友發現打開瀏覽器網頁,網頁上的圖片遲遲加載不出來,是怎麼回事?檢查過網路是正常的,那是哪裡出現了問題呢?下面小編就來跟大家介紹一下網頁圖片載入不出來的六種解決方法。網頁圖片載入不出來:  1、網速問題網頁顯示不出圖片有可能是因為電腦的網路速度比較慢,電腦中開啟的軟體比較多,  而我們造訪的圖片比較大,這就可能因為載入逾時,導致圖片顯示不出來,  可以將比較佔網速的軟體將關掉,可以去任務管理器查看一下。  2、造訪人數過多  網頁顯示不出圖片還有可能是因為我們造訪的網頁,在同時段造訪的

福昕PDF閱讀器如何將pdf文件轉成jpg圖片-福昕PDF閱讀器將pdf文件轉成jpg圖片的方法 福昕PDF閱讀器如何將pdf文件轉成jpg圖片-福昕PDF閱讀器將pdf文件轉成jpg圖片的方法 Mar 04, 2024 pm 05:49 PM

你們是不是也在使用福昕PDF閱讀器軟體呢?那麼你們知道福昕PDF閱讀器如何將pdf文檔轉成jpg圖片嗎?下面這篇文章就為大夥帶來了福昕PDF閱讀器將pdf文檔轉成jpg圖片的方法,有興趣的夥伴們快來下文看看吧。先啟動福昕PDF閱讀器,接著在頂部工具列找到“特色功能”,然後選擇“PDF轉其他”功能。在接下來,開啟一個名為「福昕pdf線上轉換」的網頁。在頁面上方右側點選「登入」按鈕進行登錄,然後開啟「PDF轉圖片」功能。之後點擊上傳按鈕並將想要轉換成圖片的pdf檔加入進來,加入完畢後點擊「開始轉

如何使用 JavaScript 實作圖片的拖曳縮放功能? 如何使用 JavaScript 實作圖片的拖曳縮放功能? Oct 27, 2023 am 09:39 AM

如何使用JavaScript實作圖片的拖曳縮放功能?在現代web開發中,實現圖片的拖曳和縮放是常見的需求。透過使用JavaScript,我們可以輕鬆地為圖片添加拖曳和縮放功能,提供更好的使用者體驗。在本篇文章中,將介紹如何使用JavaScript來實現此功能,以及附有具體的程式碼範例。 HTML結構首先,我們需要一個基本的HTML結構來展示圖片,並為圖片增加

See all articles