开发者社区> ghost丶桃子> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

【IOS-COCOS2D游戏开发之十七】灵活使用精灵可视区域(TEXTURERECT)与锚点(ANCHORPOINT),并结合可视区域与锚点制作进度条!

简介:
+关注继续查看
本站文章均为 李华明Himi 原创,转载务必在明显处注明: 

转载自【黑米GameDev街区】 原文链接: http://www.himigame.com/iphone-cocos2d/501.html



今天Himi单用一篇博文来给童鞋们介绍精灵相关的两个常用的细节知识点;

首先来介绍第一个知识点:精灵可视区域;

不管在哪个移动平台上进行开发游戏都会接触使用到可视区域,比如Kjava(J2me)平台的setClip方法,Android的clipRect方法等等,那么在iOS上也一样存在,这里我们介绍cocos2d引擎中的可视区域得函数是setTextureRect;

可能没有接触过游戏得童鞋不明白其概念,那么Himi就简单概述下:

所谓可视区域就是在一个完整的表面上对其设置一定大小的区域,让其只显示设置的区域的面,其他部分隐藏不显示出来;最常用的是将一张图片设置一个可视区域,只让这张图展示设置的区域;

那么这里在啰嗦几句,在cocos2d中精灵CCSprite的可视区域一般可以通过两种方式来设置:

1.在创建精灵的时候进行设置;2.在创建后进行设置;举例如下:

新建一个cocos2d项目,然后在HelloWorldLayer.m中init方法中创建一个精灵,代码如下:

上面我创建了3个精灵,第一个没有设置可是区域的icon精灵,第二个和第三个是设置了可视区域宽30高30的精灵,但是第二个和第三个精灵的可是区域宽高相同,但是起始点不同;而且第二个是从创建精灵的时候设置可视区域,第三个精灵则是创建精灵后进行设置的,设置的地方不一样,功能是一样的;

需要详细讲解的是不管用以上两种设置可视区域的哪种方法都需要传入一个CGRect对象,这个CGrect参数有四个,坐标x,y,以及宽高w,y;

那么CGRect在可是区域的函数中的作用如下:

CGRect的x,y表示从这个精灵贴图的(x,y)坐标开始设置可视区域,(w,h)可视区域的大小;

下面是运行效果图,童鞋们通过三个精灵(从左往右)之间的对比就很容易明白的:

下面介绍第二个知识点:精灵锚点(anchorPoint);

渲染锚点的作用就是在渲染图片的时候确定其渲染的方式,一般常用的锚点有以下几种:

图片左上角、图片右上角、图片中心点、图片左下角、图片右下角等等

首先童鞋们需要知道一点,在cocos2d引擎中在layer中添加渲染精灵贴图的时候默认的锚点是其中心点;

那么由于cocos2d中layer的原点(0,0)点是屏幕的左下角,所以如果默认创建一个精灵添加到layer中的话,是精灵的中心点放置在layer的原点上,即精灵图片显示在屏幕中只是精灵的宽一半高一半,如下图:

对应代码如下:

那么如果我们设置其精灵的锚点为左下角则正好将精灵icon完整显示出来,因为精灵的左下角正好与layer的原点重合,如下图:

对应代码如下:

设置的方法是精灵的anchorPoint属性,赋值的是个CGPoint对象,其CGPoint中的x与y最大取1,表示最右与最下;

———以上介绍的过于简单,那么下面Himi利用可视区域与锚点的特性制作一种从左往右样式简单进度条;

首先我们仍然使用cocos2d的icon图作为一个进度条,然后让其从左往右不断显示出来;步骤如下:

第一步:创建一个精灵,设置精灵的锚点为x=0(最左侧),y=0.5(精灵的y轴中点),代码如下:

细心的童鞋可能会发现以上代码运行后发现精灵并不显示在屏幕中点,嗯,因为我们设置了精灵的锚点,现在精灵的左下角与屏幕中点重合着;

第二步:添加一个变量用于记录当前进度:

然后开启一个刷新函数:

最后一步:在刷新函数中书写从左往右慢慢显示icon进度条逻辑代码,代码如下:

运行截图如下:(icon显示区域越来越大,不断循环)

 

OK,本篇介绍完毕,可能童鞋们会认为本篇知识点过于简单,如果你是个经常关注Himi博客的童鞋,那么你会发现Himi基本上所有的博文都是介绍了很多细节方面的问题,原因一,千篇一律的文章太多,别人都写那么多了,我也没必要赘述。原因二,Himi常说的,细节决定一切,虽然说得绝对了些,但是事实开发项目中基本都是细节问题困扰着大家;


版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
iOS开发:下架App的步骤
首先登陆你的 iTunes Connect
0 0
2022 ios APP最新iOS开发上架测试教程
2022 ios APP最新iOS开发上架测试教程
0 0
[ios开发]-APP-上架流程
由于苹果的机制,在非越狱机器上安装必须通过官方的Appstore, 开发者开发好应用后上传Appstore,也需要通过审核等环节。 AppCan作为一个跨主流平台的一个开发平台,也对ipa包上传Appstore作了支持。 本文从三个流程来介绍如何实现AppCan在 线编译出ipa包,以及上传到苹果Appstore。
0 0
iOS开发之打包上传到App Store——(一)各种证书的理解
iOS开发之打包上传到App Store——(一)各种证书的理解
0 0
IOS APP开发:苹果app从开发到上架教程详解
IOS APP开发:苹果app从开发到上架教程详解
0 0
IOS开发:UniAPP实现BLE低功耗蓝牙开发1
1、Uni-app介绍 2、Uni-app优点 3、BLE开发流程
0 0
iOS开发 - 穿针引线之内存管理(二)
iOS开发 - 穿针引线之内存管理
0 0
文章
问答
文章排行榜
最热
最新
相关电子书
更多
3D动画的菜谱式灯光与云渲染
立即下载
360°全景视频播放器的实现原理
立即下载
复杂环境下的视觉同时定位与地图构建
立即下载