Sunday, May 11, 2014

Sprite và những Action cơ bản trong Cocos2d-x V3.0

Hi!

Chủ nhật ta lại một mình, buồn buồn ngồi viết Blog chơi, viết đi viết lại buồn ơi vẫn buồn

Đây là 1 bài về Sprite và một số Action trong Cocos2d-x V3 các bạn nhé, phần Tut này có Video hướng dẫn của nước ngoài tại Đây. Mình tổng hợp lại dưới dạng Text, tiện cho việc tra cứu.

Tạo 1 dự án mới tên Tutorial, hoặc helloworld, hoặc abc ...., trong hàm init() của nó

SPRITE:

Tạo Sprite, Đặt vị trí trên màn hình, thêm vào Layer

auto sprite = Sprite::create("sprite.png");
sprite->setPosition(Point(x,y));
this->addChild(sprite,1);


ACTION

1/ MoveBy (di chuyển 1 sprite tới 1 điểm với 1 khoảng cho trước)
static MoveBy* create ( float duration, const Point & deltaPosition )
Ex:
auto action = MoveBy::create(3,Point(100,100);
sprite->runAction(action);

2/ MoveTo (di chuyển 1 sprite tới 1 điểm cho trước)
static MoveTo* create ( float duration, const Point & position )
Ex:

auto action = MoveTo::create(3,Point(100,100);
sprite->runAction(action);

3/ JumpBy (Nhảy tới 1 điểm với 1 khoảng cho trước, cùng với chiều cao và bước nhảy)
static JumpBy* create ( float duration, const Point & position, float height, int jumps )
Ex:
auto action =  JumpBy::create(3,Point(100,100),50,5);
sprite->runAction(action);

4/ JumpTo (Nhảy tới 1 điểm cho trước, cùng với chiều cao và bước nhảy)
static JumpTo* create ( float duration, const Point & position, float height, int jumps )
auto action =  JumpTo:create(3,Point(100,100),50,5);
sprite->runAction(action);

* Lưu ý: trong các hàm trên tuy cùng 1 Point(100,100), nhưng hoàn toàn khác nhau, 1 cái thì là điểm tọa độ trong loại hàm Func_TO, 1 loại là đoạn (x,y) trong loại hàm Func_BY

5/ BezierBy ( Di chuyển sprite theo 1 đường "cong" tạo bởi 3 điểm đầu, giữa và cuối )
static BezierBy * create (float t, const ccBezierConfig &c)
ccBezierConfig  là 1 cấu trúc 3 điểm định nghĩa như sau:
struct ccBezierConfig {
Point controlPoint_1;
Point controlPoint_2;
Point endPosition;
};

Ex:
ccBezierConfig  bezier;
bezier.controlPoint_1 = Point(100,100);
bezier.controlPoint_2 = Point(200,-200);
bezier.endPosition = Point(40,400);
auto action = BezierBy::create(3,bezier);
sprite->runAction(action);

6/ BezierTo  ( Di chuyển sprite theo 1 đường "cong" tạo bởi 3 điểm đầu, giữa và cuối )
static BezierTo * create (float t, const ccBezierConfig &c)

Ex:
ccBezierConfig  bezier;
bezier.controlPoint_1 = Point(100,100);
bezier.controlPoint_2 = Point(200,-200);
bezier.endPosition = Point(40,400);
auto action = BezierBy::create(3,bezier);
sprite->runAction(action);

* Lưu ý: Dù cùng 1 ccBezierConfig, nhưng BezierTo và BezierBy di chuyển trên màn hình sẽ khác nhau, do tọa độ Point trong ccBezierConfig là khác nhau về bản chất. Các bạn cần lưu ý điều này.

7/ Place (Đặt Sprite tại 1 tọa độ xác định trên màn hình
static Place* create(const Point & pos)
EX:
auto action = Place::create(Point(100,100));
sprite->runAction(action);

8/ ScaleBy (Thay đổi kích thước sprite theo 1 tỷ lệ xác định)
static ScaleBy* create ( float duration, float s )
static ScaleBy* create ( float duration, float sx, float sy )
static ScaleBy* create ( float duration, float sx, float sy, float sz )

EX:
auto action = ScaleBy::create(4,3); sprite->runAction(action);
auto action = ScaleBy::create(4,3,5); sprite->runAction(action);

9/ ScaleTo ( Thay đổi kích thước sprite theo 1 tỷ lệ xác định);
static ScaleTo * create ( float duration, float s )
static ScaleTo * create ( float duration, float sx, float sy )
static ScaleTo * create ( float duration, float sx, float sy, float sz )

EX:
auto action = ScaleTo ::create(4,3); sprite->runAction(action);
auto action = ScaleTo ::create(4,3,5); sprite->runAction(action);

* 2 lệnh ScaleTo, ScaleBy, kết quả khá giống nhau

10/ RotateBy ( Quay Sprite theo 1 góc xác định)
static RotateBy* create ( float duration, float deltaAngle )
static RotateBy* create ( float duration, float deltaAngleZ_X, float deltaAngleZ_Y )
Ex:
auto action = RotateBy::create(3,45); sprite->runAction(action);

11/ RotateTo ( Quay Sprite theo 1 góc xác định)
static RotateTo* create ( float duration, float deltaAngle )
static RotateTo* create ( float duration, float deltaAngleZ_X, float deltaAngleZ_Y )
Ex:
auto action = RotateTo::create(3,45); sprite->runAction(action);

12/ TintBy (Chuyển màu của Sprite sang 1 màu nhất định)
static TintBy* create ( float duration, GLshort deltaRed, GLshort deltaGreen, GLshort deltaBlue )
Ex:
auto action = TinBy::create(3, 255,200,100); sprite->runAction(action);
* Cách này chuyển màu khá nhanh và không mượt như cách dưới

13/ TintTo (Chuyển màu của Sprite sang 1 màu nhất định)
static TintTo* create ( float duration, GLshort deltaRed, GLshort deltaGreen, GLshort deltaBlue )
Ex:
auto action = TintTo::create(3, 255,200,100); sprite->runAction(action);
* Màu biến thiên mượt hơn cách trên

14/ FadeTo ( Tạo hiệu ứng Fade cho sprite với độ Opacity nhất định)
static FadeTo* create ( float duration, GLubyte opacity )
Ex:
auto action = FadeTo::create(3,55); sprite->runAction(action)
Opacity từ 0 tới ~ 255 ??

15/ FadeIn ( Tạo Fade - hiện dần 1 sprite)
static FadeIn * create (float d)
Ex:
sprite->setOpacity(0);
auto action = FadeIn::create(5);sprite->runAction(action);

16/ FadeOut ( Làm mờ dần 1 sprite )
static FadeOut * create (float d)
Ex:
auto action = FadeOut ::create(5);sprite->runAction(action);

17/ Repeat ( Nhắc lại 1 Action với số lần xác định)
static Repeat* create ( FiniteTimeAction * action, unsigned int times )
Ex:
auto action = Repeat:create(RotateBy::create(2,45),8); sprite->runAction(action);

18/ RepeatForever ( Nhắc lại 1 Action với số lần vô hạn)
static RepeatForever * create (ActionInterval *action)
Ex:
auto action = RepeatForever :create(RotateBy::create(2,45)); sprite->runAction(action);

Các bạn có thể tra cứu Hàm cocos2d-x V3 ở đây nhé

TOBE CONTINUED (2)...

0 nhận xét:

Post a Comment