本期教程我们来创建工具栏,其实也非常简单,和之前做的方式相同,只是位置不同而已。我们将创建一个背景并将工具栏放置在其中。如果我发现你现在做的东西和我们最开始的项目介绍不一样,你不是有一个场景过渡吗?那我们可以在后面来做。我先把主体做好,然后我们逐步添加。现在我们先把工具栏做好,然后在中间添加一张图片。
首先,我们需要定义一个图片变量来表示工具栏。接下来,我们要处理相同的背景,初始化。我们将加载这张背景图片到内存中,并将其与工具栏图片合并。
# 定义工具栏图片变量toolbar_img =None# 初始化相同的背景definit_background():# 加载背景图片globalbackground_imgbackground_img = load_image("background.jpg")# 以"background.jpg"为例# 加载工具栏图片defload_toolbar_image():globaltoolbar_imgtoolbar_img = load_image("toolbar.png")# 以"toolbar.png"为例# 渲染函数中显示工具栏defrender():# 先渲染背景render_background()# 显示工具栏render_toolbar()# 渲染背景defrender_background():# 渲染背景图片draw_image(background_img, (0,0))# 假设背景图片大小和屏幕大小相同# 渲染工具栏defrender_toolbar():# 将工具栏图片放置在屏幕顶部中间位置screen_center_x = SCREEN_WIDTH //2toolbar_center_x = toolbar_img.get_width() //2screen_center_y = SCREEN_HEIGHT //2toolbar_center_y = toolbar_img.get_height() //2screen.blit(toolbar_img, (screen_center_x - toolbar_center_x, screen_center_y - toolbar_center_y))# 主函数defmain():init_background()# 初始化背景load_toolbar_image()# 加载工具栏图片render()# 渲染背景和工具栏# 运行主函数main()
通过这种方式,我们在渲染函数中实现了对背景和工具栏的显示,使得代码更加整洁且易于维护。
在这里,根据坐标来配置图片位置,比如说,你想放在哪个位置,就量一下那个位置的坐标。你可以使用 Windows 系统自带的画图软件来看坐标,截图后就可以看到坐标。比如,如果你想要把图片放在左下角,你就可以量一下左下角的坐标。假设你量得到的坐标是 (250, 250),那么 x 坐标就是 250,y 坐标就是 250。最顶部开始显示的话,y 坐标是零。所以,这个位置的话,y 坐标就是零。然后,你把这个坐标取整,比如取整到 250。然后,你就可以在代码中将 y 坐标设置为零或取整后的值,这样图片就会显示在相应的位置了。
为了处理背景图片和工具栏图片的坐标,你可以定义它们的位置并将其加载到资源中,然后在渲染函数中将它们渲染出来。这样做非常简单,只需要加几行代码。不过,有一个小问题就是图片周围有黑色的边框,这是因为图片是 PNG 格式的,而默认情况下背景是透明的,导致显示为黑色。为了解决这个问题,你可以将图片转换成背景透明的 PNG 格式,这样就会方便很多。
之前我们在素材中导入了两个文件,tools 和 p toots,这些工具文件里面有一个接口可以帮助我们处理图片。将这两个文件添加到项目中,然后调用接口即可实现背景透明化处理。
添加这些文件很简单。首先,将目录复制到项目中。然后,在项目名称上右键单击,选择“添加现有项”,然后选择要添加的目录。这样,当前目录下的文件就会被复制到项目中。
在复制的目录中,你会看到有 tools.h 和 tools.cpp 这两个文件。右键单击它们,选择“添加现有项”,然后确认添加。现在,这些文件已经添加到了项目中。
在 tools.h 文件中,有一个接口 pro_image_png,用于显示背景透明的 PNG 图片。如果你对它的实现感兴趣,可以查看具体的实现细节。现在,我们要调用这个接口了。
首先,要包含头文件 tools.h,使用双引号包含,因为它是我们自己写的头文件。然后,在代码中调用 pro_image_png 函数,将图片显示部分改成 put_image_png,参数是 PNG 图片的路径。其他部分保持不变。运行代码后,你会发现黑色的边角消失了。
现在,我们的工具栏已经添加了,但是还没有植物卡牌。我们希望在工具栏中添加一个能放置各种植物卡牌的区域,这样玩家就可以从中选择植物进行种植。现在,我们要开始实现工具栏中的植物卡牌。
植物卡牌有很多种类,每种植物对应一种卡牌。在代码中,我们可以使用数组来表示这些植物卡牌。我们可以定义一个图片数组 image,用于存储每种植物卡牌的图片。根据你的描述,最多可能有七种植物卡牌,所以我们可以定义一个长度为七的数组。
让我们先减少一点。保证有三种植物卡牌。在第一个红中,红的优点是它很灵活,但也有缺点,当我们要增加更多种类的植物时,你可能需要修改代码来适应新的情况。这样的做法不够方便。更方便的方式是使用一些小技巧。
我们可以先用一个整型常量数组来定义这些植物卡牌的类型。然后,我们可以在数组中添加新的植物类型,而不需要手动更改代码。最后,我们在数组的最后加上一个植物种类的计数,这样可以方便地统计有多少种植物类型。
这种方式非常巧妙。比如,如果我们有两种植物类型,后面再添加一种新的植物类型,数组的大小会自动增加,而不需要手动修改。这种方式非常高效,你在以后的开发中也可以使用这种技巧。
现在,让我们来定义植物卡牌。我现在先做两种植物卡牌:豌豆和向日葵。我们可以先定义一个数组来存储这些植物卡牌的图片,然后在初始化时加载这些图片到内存中。让我们看看我们有多少张卡牌,然后进行初始化。
在初始化过程中,我们可以使用循环来加载每张植物卡牌的图片。因为每张卡牌的文件名不同,所以我们需要根据文件名来生成加载路径。我们可以定义一个变量来表示文件名,然后通过循环来生成不同的文件名。
生成文件名的最简单方式是使用字符串格式化操作,将文件名打印到一个字符串中。在C语言中,我们可以使用 sprintf 函数来完成这个任务。sprintf 函数的第一个参数是目标字符串,后面的参数是要格式化的内容。
首先,我们需要确定每个卡牌的文件名。通常,我们可以在一个循环中使用 sprintf 函数来生成文件名。在生成文件名时,我们可以使用一个标志来表示卡牌的序号,并将其加到文件名中。
比如,假设我们的卡牌文件存储在植物目录下,文件名以 card%d.png 的格式命名,其中 %d 表示卡牌的序号。我们可以在循环中使用 sprintf 函数生成文件名,然后加载每个卡牌的图片。
加载图片后,我们就可以将每张卡牌渲染到屏幕上了。我们可以使用一个循环来遍历所有的卡牌,确定每张卡牌的位置,并使用 put_image 函数将其渲染到屏幕上。通常,我们可以根据卡牌的序号来确定每张卡牌的位置,然后将其放置在适当的位置上。
在确定位置时,我们可以使用一些简单的数学运算来计算每张卡牌的位置。通常,我们可以根据每张卡牌的大小和间距来确定每张卡牌的位置。最后,我们可以将每张卡牌渲染到屏幕上,这样玩家就可以在屏幕上看到所有的卡牌了。
总的来说,生成文件名和渲染卡牌到屏幕上是实现植物卡牌功能的关键步骤之一。通过使用字符串格式化操作和简单的数学运算,我们可以轻松地生成文件名和确定每张卡牌的位置,从而实现植物卡牌的功能。