ผลต่างระหว่างรุ่นของ "Prg2/arcade6 dotrun"
Jittat (คุย | มีส่วนร่วม) |
Jittat (คุย | มีส่วนร่วม) ล (Prg2/arcade5 dotrun ถูกเปลี่ยนชื่อเป็น Prg2/arcade6 dotrun) |
||
(ไม่แสดง 8 รุ่นระหว่างกลางโดยผู้ใช้คนเดียวกัน) | |||
แถว 26: | แถว 26: | ||
== Let's get started == | == Let's get started == | ||
+ | === Create a new project and set up a Git repository === | ||
+ | |||
+ | Create a directory to keep the project. Create a git repository there. | ||
+ | |||
+ | We will start with a very simple dot moving game. | ||
+ | |||
+ | {{synfile|dotrun.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | import arcade | ||
+ | from models import World | ||
+ | |||
+ | SCREEN_WIDTH = 600 | ||
+ | SCREEN_HEIGHT = 400 | ||
+ | |||
+ | class ModelSprite(arcade.Sprite): | ||
+ | def __init__(self, *args, **kwargs): | ||
+ | self.model = kwargs.pop('model', None) | ||
+ | |||
+ | super().__init__(*args, **kwargs) | ||
+ | |||
+ | def sync_with_model(self): | ||
+ | if self.model: | ||
+ | self.set_position(self.model.x, self.model.y) | ||
+ | |||
+ | def draw(self): | ||
+ | self.sync_with_model() | ||
+ | super().draw() | ||
+ | |||
+ | |||
+ | class DotRunWindow(arcade.Window): | ||
+ | def __init__(self, width, height): | ||
+ | super().__init__(width, height) | ||
+ | |||
+ | arcade.set_background_color(arcade.color.GRAY) | ||
+ | |||
+ | self.world = World(SCREEN_WIDTH, SCREEN_HEIGHT) | ||
+ | |||
+ | self.dot_sprite = ModelSprite('images/dot.png', | ||
+ | model=self.world.dot) | ||
+ | |||
+ | def update(self, delta): | ||
+ | self.world.update(delta) | ||
+ | |||
+ | |||
+ | def on_draw(self): | ||
+ | arcade.start_render() | ||
+ | self.dot_sprite.draw() | ||
+ | |||
+ | if __name__ == '__main__': | ||
+ | window = DotRunWindow(SCREEN_WIDTH, SCREEN_HEIGHT) | ||
+ | arcade.run() | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | {{synfile|models.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | GRAVITY = -1 | ||
+ | MAX_VX = 10 | ||
+ | ACCX = 1 | ||
+ | |||
+ | class Model: | ||
+ | def __init__(self, world, x, y, angle): | ||
+ | self.world = world | ||
+ | self.x = x | ||
+ | self.y = y | ||
+ | self.angle = 0 | ||
+ | |||
+ | |||
+ | class Dot(Model): | ||
+ | def __init__(self, world, x, y): | ||
+ | super().__init__(world, x, y, 0) | ||
+ | self.vx = 0 | ||
+ | self.vy = 0 | ||
+ | |||
+ | def update(self, delta): | ||
+ | if self.vx < MAX_VX: | ||
+ | self.vx += ACCX | ||
+ | |||
+ | self.x += self.vx | ||
+ | |||
+ | |||
+ | class World: | ||
+ | def __init__(self, width, height): | ||
+ | self.width = width | ||
+ | self.height = height | ||
+ | |||
+ | self.dot = Dot(self, 0, 100) | ||
+ | |||
+ | |||
+ | def update(self, delta): | ||
+ | self.dot.update(delta) | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | You can use the dot image file here: [https://gitlab.com/jittat/arcade-dotrun/raw/f2e95a083c35aba5c81004e4052814b1426e7074/images/dot.png?inline=false dot.png]. Save it to <tt>images/dot.png</tt>. | ||
+ | |||
+ | Try to run the game to see if there is a dot moving. | ||
+ | Then, commit the code. | ||
+ | |||
+ | {{gitcomment|Don't forget to commit your code.}} | ||
+ | |||
+ | === Jumping dot === | ||
+ | |||
+ | We will make the dot jumps, basically by having attributes <tt>vy</tt> and <tt>is_jump</tt>. The dot will also keep <tt>base_y</tt>. | ||
+ | |||
+ | {{synfile|models.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | class Dot(Model): | ||
+ | def __init__(self, world, x, y, base_y): | ||
+ | super().__init__(world, x, y, 0) | ||
+ | self.vx = 0 | ||
+ | self.vy = 0 | ||
+ | self.is_jump = False | ||
+ | |||
+ | self.base_y = base_y | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | When the dot lands, it will stop falling when its y co-ordinate is at most base_y. | ||
+ | |||
+ | When create a dot, make sure to put 100 to base_y. | ||
+ | |||
+ | {{synfile|dotrun.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | class World: | ||
+ | def __init__(self, width, height): | ||
+ | self.width = width | ||
+ | self.height = height | ||
+ | |||
+ | self.dot = Dot(self, 0, 100, 100) | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | We will create method <tt>jump</tt> in dot. | ||
+ | |||
+ | {{synfile|models.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | class Dot(Model): | ||
+ | # ... | ||
+ | def jump(self): | ||
+ | if not self.is_jump: | ||
+ | self.is_jump = True | ||
+ | self.vy = JUMP_VY | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | Don't forget to add constant <tt>JUMP_VY</tt> at the top of the code. You can put 10 for it. | ||
+ | |||
+ | To take a key press and make the dot jump, add the following methods. | ||
+ | |||
+ | {{synfile|models.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | import arcade.key # add this line at the top of the code in models.py | ||
+ | |||
+ | class World: | ||
+ | # ... | ||
+ | def on_key_press(self, key, key_modifiers): | ||
+ | if key == arcade.key.SPACE: | ||
+ | self.dot.jump() | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | Call it from DotRunWindow. | ||
+ | |||
+ | {{synfile|dotrun.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | class DotRunWindow(arcade.Window): | ||
+ | # ... | ||
+ | |||
+ | def on_key_press(self, key, key_modifiers): | ||
+ | self.world.on_key_press(key, key_modifiers) | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | ==== Exercise: jumping dot ==== | ||
+ | |||
+ | We still need to move the dot according to its vy and make sure that after it's y co-ordinate reaches base_y, it stops the jump (i.e., set vy=0 and is_jump = False). | ||
+ | |||
+ | {{synfile|models.py}} | ||
+ | <syntaxhighlight lang="python"> | ||
+ | class Dot(Model): | ||
+ | # ... | ||
+ | def update(self, delta): | ||
+ | if self.vx < MAX_VX: | ||
+ | self.vx += ACCX | ||
+ | |||
+ | self.x += self.vx | ||
+ | |||
+ | if self.is_jump: | ||
+ | # | ||
+ | # complete the code here | ||
+ | # | ||
+ | </syntaxhighlight> | ||
+ | |||
+ | == Platforms == | ||
+ | |||
+ | == Coins == | ||
== Additional steps == | == Additional steps == |
รุ่นแก้ไขปัจจุบันเมื่อ 15:54, 28 กุมภาพันธ์ 2562
- This is part of the course Programming 2.
In this tutorial we will sketch rough steps and new techniques for building the Dot Run game.
เนื้อหา
Steps
These are the steps we will take to implement the game.
- Shows Dot
- Dot moves to the right
- Dot moves and jump on the floor
- Viewport
- Shows platforms
- Jumps on top of platforms
- Recycles platforms
- Shows and collects coins
- Shows score
New techniques
Viewport
Drawing primitives
Player's states for jumping off and onto a platform
Let's get started
Create a new project and set up a Git repository
Create a directory to keep the project. Create a git repository there.
We will start with a very simple dot moving game.
import arcade
from models import World
SCREEN_WIDTH = 600
SCREEN_HEIGHT = 400
class ModelSprite(arcade.Sprite):
def __init__(self, *args, **kwargs):
self.model = kwargs.pop('model', None)
super().__init__(*args, **kwargs)
def sync_with_model(self):
if self.model:
self.set_position(self.model.x, self.model.y)
def draw(self):
self.sync_with_model()
super().draw()
class DotRunWindow(arcade.Window):
def __init__(self, width, height):
super().__init__(width, height)
arcade.set_background_color(arcade.color.GRAY)
self.world = World(SCREEN_WIDTH, SCREEN_HEIGHT)
self.dot_sprite = ModelSprite('images/dot.png',
model=self.world.dot)
def update(self, delta):
self.world.update(delta)
def on_draw(self):
arcade.start_render()
self.dot_sprite.draw()
if __name__ == '__main__':
window = DotRunWindow(SCREEN_WIDTH, SCREEN_HEIGHT)
arcade.run()
GRAVITY = -1
MAX_VX = 10
ACCX = 1
class Model:
def __init__(self, world, x, y, angle):
self.world = world
self.x = x
self.y = y
self.angle = 0
class Dot(Model):
def __init__(self, world, x, y):
super().__init__(world, x, y, 0)
self.vx = 0
self.vy = 0
def update(self, delta):
if self.vx < MAX_VX:
self.vx += ACCX
self.x += self.vx
class World:
def __init__(self, width, height):
self.width = width
self.height = height
self.dot = Dot(self, 0, 100)
def update(self, delta):
self.dot.update(delta)
You can use the dot image file here: dot.png. Save it to images/dot.png.
Try to run the game to see if there is a dot moving. Then, commit the code.
Jumping dot
We will make the dot jumps, basically by having attributes vy and is_jump. The dot will also keep base_y.
class Dot(Model):
def __init__(self, world, x, y, base_y):
super().__init__(world, x, y, 0)
self.vx = 0
self.vy = 0
self.is_jump = False
self.base_y = base_y
When the dot lands, it will stop falling when its y co-ordinate is at most base_y.
When create a dot, make sure to put 100 to base_y.
class World:
def __init__(self, width, height):
self.width = width
self.height = height
self.dot = Dot(self, 0, 100, 100)
We will create method jump in dot.
class Dot(Model):
# ...
def jump(self):
if not self.is_jump:
self.is_jump = True
self.vy = JUMP_VY
Don't forget to add constant JUMP_VY at the top of the code. You can put 10 for it.
To take a key press and make the dot jump, add the following methods.
import arcade.key # add this line at the top of the code in models.py
class World:
# ...
def on_key_press(self, key, key_modifiers):
if key == arcade.key.SPACE:
self.dot.jump()
Call it from DotRunWindow.
class DotRunWindow(arcade.Window):
# ...
def on_key_press(self, key, key_modifiers):
self.world.on_key_press(key, key_modifiers)
Exercise: jumping dot
We still need to move the dot according to its vy and make sure that after it's y co-ordinate reaches base_y, it stops the jump (i.e., set vy=0 and is_jump = False).
class Dot(Model):
# ...
def update(self, delta):
if self.vx < MAX_VX:
self.vx += ACCX
self.x += self.vx
if self.is_jump:
#
# complete the code here
#