Chủ Nhật, 23 tháng 3, 2014

2048 - trào lưu mới sau Flappy Bird


2048 - trào lưu mới sau Flappy Bird



Trên các mạng xã hội cũng như tại các cửa hàng ứng dụng thường xuyên xuất hiện các game mang tính chất gây nghiện như Candy Crush hay gần đây nhất là Flappy Bird. Đó là những game đơn giản nhưng lại gây nghiện cho nhiều người chơi, 2048 cũng vậy.
2048 được tạo ra bởi một lập trình viên 19 tuổi người Ý tên là Gabriele Cirulli, được chơi miễn phí và đã xuất hiện trên Github và đầu tháng 3 này. 2048 được chơi dựa trên trình duyệt web và nhiều phiên bản không chính thức cũng đã xuất hiện trên Android và các nền tảng khác.
2048 có thể mô tả một cách đơn giản như những game Threes hay Candy Crush dành cho những người đam mê toán, rất khó để hiểu cách ở lần chơi đầu tiên, chỉ mất khoảng 1 phút để có thể nhận ra cách chơi và sau đó nó sẽ bắt đầu gây nghiện một cách từ từ.

Cirulli ra mắt trò chơi này vào ngày 09/03, 3 ngày sau, anh đăng lên Tweeter của mình là đã có hàng ngàn người chơi trò chơi này tại cùng một thời điểm.
28000 người đang chơi # 2048 game. Lượng thời gian mà mọi người đã bỏ ra khi chơi trò chơi này sẽ không bao giờ có thể lấy lại được.






Link download bản Android: https://play.google.com/store/apps/details?id=tiny.com.puzzle.number

Link bản gốc trên web: http://gabrielecirulli.github.io/2048/


(P/S: Bản game Android này do một bạn học CNTT PTIT port lại sang Android từ bản browser)

Thứ Năm, 20 tháng 3, 2014

Pixel Perfect Collision Detection (Using Cocos2d-x)


This post found its way because I couldnt find the answer to one of the questions I asked on StackOverflow (http://stackoverflow.com/questions/18546066/pixel-perfect-collision-detection-in-cocos2dx) and thought there would be others like me in search for an answer.


Collision detection is an integral part of almost all games. It is used to find when a bullet hits an enemy or when you bump into a wall etc.
There are many different requirements when we do collision detection and depending on our game we choose one of the many detection techniques.
The default Collision detection mechanism used by games and provided in almost all game engines and frameworks is a “Bounding Box” collision.
Simply put, a “Bounding Box” collision detection system the sprites/objects being checked for collision are treated as the smallest rectangle which completely engulfs them. Then these two Boxes are checked if they are colliding with each other.
But sometimes this very simple collision detection system is not accurate. Specially when we use sprites with alpha values (mostly png files) or when our objects are rotated by some angles. See the image below:

Pixel – Perfect collision detection is a system where we check if the objects concerned are actually colliding rather than just being part of a bounding box which is bigger than their size. WARNING: This system though more accurate is obviously more performance intensive and hence depending on your game requirements choose wisely about which of the different systems you want to use.
TIP: This system though written specially for Cocos2d-x framework can be easily understood and implemented for any language/framework you are using.
So its time to get our hands dirty,
We are going to develop a Singleton Class for collision detection and just plug and play this in any project we are doing.
Things used:
1. Singleton Class – CollisionDetection
2. Opengl Vertex and Fragment Shaders
3. CCRenderTexture Class – Cocos2d-x
Theory:
1. Create a CCRenderTexture which is going to serve as a secondary draw buffer.
2. We first do a simple collision detection (Bounding Box) to check if the two sprite’s bounds are colliding
3. If step 2 is a success then we are going to draw the two concerned objects in our secondary buffer we created in step 1. (We are going to set its visibility to false, so that even though we draw something, nothing will we visible to the end user)
4. Using openGL fragment shaders we are going to draw one of the objects completely RED and the other completely BLUE!
OpenglNoCollision     CorrectOpenglCollision
5. Using another of openGL functionality glReadPixels we are going to read the pixels data of all the pixels in the Rectangular area (Intersection area) of the bounding box collision
6. We are then going to loop through all the pixel values and check if a single pixel has BOTH the RED and the BLUE pixels. If they have then the objects are actually colliding or else not.
Now here is the code for the above steps. I have commented the code for you to understand what is going on. If there are any questions please leave in the comments and I will try and answer to the best of my knowledge
CollisionDetection.h
CollisionDetection.cpp
 SolidColorShader.fsh
 SolidVertexShader.vsh
For using the Collision Detection Class:
1. Initialize the CCRenderTexture object
2. Call the Singleton function whenever collision detection required