opening title fire'nice team member: zhang yujie wang huan xiao fei cheng peng tutor: alexandre...
DESCRIPTION
Object In our project, we clone an action-puzzle game named 'Fire And Ice' which was first released in At last, we will try to make the final code high-efficiency in memory and CPU time. Leading role : DanaTRANSCRIPT
![Page 1: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/1.jpg)
Opening Title Fire'nIce Team Member: Zhang Yujie
Wang Huan Xiao Fei Cheng Peng
Tutor: Alexandre Devert
SSE USTC
Team Leader: Wei Qiang
![Page 2: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/2.jpg)
Content
Object
Tools and means
Design
Tasks
![Page 3: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/3.jpg)
Object
In our project, we clone an action-puzzle game named 'Fire And Ice' which was first released in 1992.
At last, we will try to make the final code high-efficiency in memory and CPU time.
Leading role:Dana
![Page 4: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/4.jpg)
Tools and Means
Language: C++ Function Library: SDL(Simple DirectMedia Layer) SDM: Agile Development Development Tool: visual studio 2010 Gimp
![Page 5: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/5.jpg)
Design
The project uses agile development methods. In our weekly work, we complete a certain task and realize the gradual optimization of the code.
So,our initial design for this project is not so perfect.It is just for an easy beginning.Look the picture in the next page:
![Page 6: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/6.jpg)
Design
![Page 7: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/7.jpg)
![Page 8: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/8.jpg)
Task1:
Play the game to the end ,make a printscreen
for each level.So we have more than 100 maps that printed from the game.Using the maps we make an HTML as a guide:
![Page 9: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/9.jpg)
Task2
Task: Showing a picture in the window and move it
with key pressing.
![Page 10: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/10.jpg)
Task2
To Show: Using the function “SDL_BlitSurface”, “put” a
png to the screen. Record the offset of the png: (x, y)
![Page 11: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/11.jpg)
Task2
To Move: Two new parameters: (xVel, yVel) xVel: speed of the motion on horizontal←→ yVel: speed of the motion on vertical ↑↓
Get events from the keyboard: Case: UP: yVel -= some value Case: DOWN: yVel +=some value Case: ….
![Page 12: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/12.jpg)
Task2
Then, change the offset(x, y) according to the speed on vertical and horizontal.following the formula :
x += xVel; y += yVel; Put the image on the new position according to the
new offset(x, y). But, before put a new image on the screen we
should always flush the screen ,otherwise we will see a lot of shadows like this:
![Page 13: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/13.jpg)
Task2
![Page 14: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/14.jpg)
Task3 Part1
Task: Make the mario move, using an image sheet.
How to get a small clip of the sheet? We need three parameters: offset, height and
width. Like this:
![Page 15: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/15.jpg)
Task3 Part1
![Page 16: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/16.jpg)
Task3 Part1
The animation needs a sequence of small clips of the Mario.
We use an array to store the sequence of the clips.
![Page 17: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/17.jpg)
Task3 Part1
We make a new parameter: status. If the keyboard state is UP: Set status = UP, then put the “up clips”
sequence to the screen according to the position we get from the (x, y).
![Page 18: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/18.jpg)
Task3 Part1
Transparency
The result will be
![Page 19: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/19.jpg)
Task3 Part2
Read a text file which looks like that################ ## ### D## ## ###############
Where '#' is a wall, 'D' is a little guy. The program load a picture containing pictures for the little guys and the walls.After this task we can load pictures and show them.
![Page 20: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/20.jpg)
Task3 Part2
We built a new class named Tile, including its position, width, height.
Then we built a new array named tiles. Read the map, case ‘#’, new a Tile, calculate
its position, then put it in the tiles array.
![Page 21: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/21.jpg)
Task3 Part2
Put the tile pictures according to the positions of the tiles.
![Page 22: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/22.jpg)
Task3 Part2
But now, the tiles are only images, Mario can walk across them.
How to solve this problem? We built a function: Collision Detection.
First, we add a property in both Mario and Tiles: SDL_Rect. It’s like a box or a “shell”, like this:
![Page 23: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/23.jpg)
Task3 Part2
When the two boxes get close to each other, one can not cross another’s boundary.
Then , Apply the collision detection function to every tile.
![Page 24: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/24.jpg)
Task4
In task3, there are only one kind of tile: block, and the block has only one status. But in the game, there are many kinds of things: blocks, fire, ice, jar, pipe…as:
![Page 25: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/25.jpg)
Task4
The blocks and the ices also have 4 kinds of status:
none-joined: left-joined: right-joined: Both-joined:
![Page 26: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/26.jpg)
Task4
Because in the map file, every block is the same:
We need to judge every block and ice what kind of status they are.
![Page 27: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/27.jpg)
Task4
Before, we read the map file, store every character into an array like this:
Eg: file: ’####’; in the array: ‘####’ But, in this task, we judge and change the
type of every tile, like this: File:’####’; in the array they are turned into:
‘[##]’
![Page 28: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/28.jpg)
Task4
Case ‘[’: put a onto the map; Case ‘]’: put a onto the map; Case ‘#’:put a onto the map; Case ‘^’: put a onto the map. So, in the map, file ‘####’ will be showed like
this: Not like this:
![Page 29: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/29.jpg)
Task5
Change one most important algorithm in our project:
Collision Detection is replaced by Position Detection!
Reason:Collision detection can not get Dana's next action after the 'collision';But position detection can do different actions after the collision,such as dropping,climing,stopping or dying.
![Page 30: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/30.jpg)
Task5
With position detection, when Dana come to some place, we can know what’s around it. It makes many problems easy to solve.
Such as:
![Page 31: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/31.jpg)
Task5
In this situation, there is a block in front of Dana, and we can know from position that there is no block in the left-up position, or up position. According to the rules, after pressing “left” key, Dana will climb to the top of the block.
![Page 32: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/32.jpg)
Task6
Each of us draw 10 maps for this project.
Like:
![Page 33: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/33.jpg)
Task……
Now we begin to making music and sound effect,but have not finished…
Next term , We will try to make the code more efficient ,reducing the amount of ‘if…else…’ that we use, optimizing the algorithm in detection, in level selecting, etc.
![Page 34: Opening Title Fire'nIce Team Member: Zhang Yujie Wang Huan Xiao Fei Cheng Peng Tutor: Alexandre Devert SSE USTC Team Leader: Wei Qiang](https://reader035.vdocument.in/reader035/viewer/2022062412/5a4d1b1a7f8b9ab059992f83/html5/thumbnails/34.jpg)
The End
Thanks for Alexandre Devert very much! AND
Merry Christmas! Happy New Year!