小飞机(三)

继续我们的话题,我们第一次说到的五个步骤,现在应该是要做第三个步骤了,也就是在屏幕上添加各种元素。有了之前的铺垫,这个是比较简单的。

首先从生命条说起,就是绘制生命条,我们设置的是外面有一个白框,里面用绿色填充生命值。
因为前面已经讲了不少,所以这个就不过多解释。
代码如下:

# 生命条宽高
BAR_LENGTH = 100
BAR_HEIGHT = 10
# 生命条外圈尺寸
outline_rect = pygame.Rect(5, 5, BAR_LENGTH, BAR_HEIGHT)
# 生命条填充尺寸(实际长度后面会实时调整)
fill_rect = pygame.Rect(5, 5, BAR_LENGTH, BAR_HEIGHT)
# 绘制外圈(2:宽度为2)
pygame.draw.rect(screen, (255, 255, 255), outline_rect, 2)
# 绘制填充
pygame.draw.rect(screen, (0, 255, 0), fill_rect)

效果如下:


生命条.png

接着是生命数,就是有几条生命,就显示几个小飞机在右上角
代码如下:

# 生命数
# 加载图片并按比例缩放
player_img = pygame.image.load(path.join(img_dir, 'playerShip1_orange.png')).convert()
player_mini_img = pygame.transform.scale(player_img, (25, 19))
# 设置colorkey ,在绘制图像的时候,将所有和colorkey一样的颜色设置为透明
player_mini_img.set_colorkey((0, 0, 0))
# 定义绘制起始位置
x = WIDTH - 100
y = 5
# 循环绘制生命(小飞机)
# 这里的生命数(3)后续也会实时调整
for i in range(3):
    live_rect = player_mini_img.get_rect()
    live_rect.x = x + 30 * i
    live_rect.y = y
    screen.blit(player_mini_img, live_rect)

这里要注意的是因为图片的缘故,直接画上去外圈会有一团黑色,所以我们要设置一下colorkey,让黑色变为透明的
效果如下:


生命数.png

然后我们添加分数值,这个比较简单,因为前面已经写好了一个方法

draw_text(screen, str(6666), 18, WIDTH / 2, 8)

现在我们可以直接绘制玩家了方法也是和之前一样

# 绘制玩家
plane_img = pygame.transform.scale(player_img, (50, 38))
plane_img.set_colorkey((0, 0, 0))
# 定义玩家的初始位置
centerx = WIDTH / 2
bottom = HEIGHT - 10
plane_rect = plane_img.get_rect()
# 设置玩家的位置
plane_rect.centerx = centerx
plane_rect.bottom = bottom
# 绘制玩家
screen.blit(plane_img, plane_rect)

我们看一下现在的效果


玩家.png

现在从视觉上已经有点感觉了,但是不着急,因为后续的内容相对之前的会复杂一下,代码量也会多,所以在这之前,我们先把代码整理一下。
整理的方向就是把常用的值用变量定义
把可分离的代码块用函数或类包装抽取一下。
最直接的就是颜色的定义

WHITE = (255, 255, 255)
BLACK = (0, 0, 0)
RED = (255, 0, 0)
GREEN = (0, 255, 0)
BLUE = (0, 0, 255)
YELLOW = (255, 255, 0)

然后我们把那些功能明显的代码块做成一个个函数/类

def draw_text(surf, text, size, x, y):
    """
    绘制文字的方法
    :param surf: (pygame里面每个画面都当作surface,譬如之前的main_pic,screen这些),
            这里是待传入要绘制的画面
    :param text: 要绘制的文本
    :param size: 要绘制的尺寸
    :param x: 要绘制的x起始坐标
    :param y: 要绘制的y起始坐标
    :return:
    """

def draw_lives_bar(surf, x, y):
    """
    绘制生命条的方法
    :param surf: 待绘制的画面
    :param x: 要绘制的x起始坐标
    :param y: 要绘制的y起始坐标
    :return:
    """

def draw_lives(surf, x, y, lives, image):
    """
    绘制生命数
    :param surf: 待绘制的画面
    :param x: 要绘制的x起始坐标
    :param y: 要绘制的y起始坐标
    :param lives: 生命数
    :param image: 生命的表示图片
    :return:
    """

def player(surf, image):
    """
    绘制玩家飞机
    :param surf: 待绘制的画面
    :param image: 玩家飞机的图片
    :return:
    """

def main_menu(screen, width, height):
    """
    准备页面&声音
    :param screen: 待绘制的画面
    :param width: 屏幕宽度
    :param height: 屏幕高度
    :return:
    """

def game_menu(surf):
    """
    游戏界面&声音
    :param surf: 待绘制画面
    :return:
    """

这样我们的代码就会简便不少,以后调整的时候就会方便很多。
代码放在https://pan.baidu.com/s/1_faELHA6qsAuKWXEW3w-YQ

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,908评论 1 45
  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,170评论 1 32
  • 那敏认识小风时间不长,也就两年而已吧。对,没有记错的话是在2014年的那个夏季。 他们现在在一起也才刚刚一年,有时...
    乖巧的耿直gril阅读 238评论 0 0
  • 01 这两天在看朱伟的《恋练有词》。 他有一句话是这么说的,“我们总是喜欢拿‘顺其自然’来敷衍人生路上的荆棘坎坷,...
    李昭然阅读 7,396评论 3 12
  • 每一朵花都有她的花期,每一个生命也都有她的缘分。 站在30岁的路口,可以很沉着冷静的看到自己,看到自己的生命状...
    陆宁阅读 218评论 0 0