<tt-image data-tteditor-tag=”tteditorTag” contenteditable=”false” class=”syl1555657331078″ data-render-status=”finished” data-syl-blot=”image” style=”box-sizing: border-box; cursor: text; color: rgb(34, 34, 34); font-family: “PingFang SC”, “Hiragino Sans GB”, “Microsoft YaHei”, “WenQuanYi Micro Hei”, “Helvetica Neue”, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: pre-wrap; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: block;”>
image
<input class=”pgc-img-caption-ipt” placeholder=”图片描述(最多50字)” value=”” style=”box-sizing: border-box; outline: 0px; color: rgb(102, 102, 102); position: absolute; left: 187.5px; transform: translateX(-50%); padding: 6px 7px; max-width: 100%; width: 375px; text-align: center; cursor: text; font-size: 12px; line-height: 1.5; background-color: rgb(255, 255, 255); background-image: none; border: 0px solid rgb(217, 217, 217); border-radius: 4px; transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;”></tt-image>
游戏规则(改编自维基百科)
从1~10这十个数字中随机抽取4个数字(可重复)，对这四个数运用加、减、乘、除和括号进行运算得出24。每个数字都必须使用一次，但不能重复使用。详见：
https://zh.wikipedia.org/wiki/24%E7%82%B9
逐步实现
Step1：制作24点生成器
既然是24点小游戏，当然要先定义一个24点游戏生成器啦。主要思路就是随机生成4个有解的数字，且范围在1~10之间，代码实现如下：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”> def generate(self):
self.__reset()
while True:
self.numbers_ori = [random.randint(1, 10) for i in range(4)]
self.numbers_now = copy.deepcopy(self.numbers_ori)
self.answers = self.__verify()
if self.answers:
break
</pre>
在验证4个数字是否有解并求出所有解部分，我直接暴力枚举然后去重了，感兴趣的同学可以自己再优化一下求解算法(有数字重复的时候)。我的代码如下图所示，其实就是递归枚举所有排序然后一一验证是否有解：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”> ”’验证生成的数字是否有答案”’
def __verify(self):
answers = []
for item in self.__iter(self.numbers_ori, len(self.numbers_ori)):
item_dict = []
list(map(lambda i: item_dict.append({str(i): i}), item))
solution1 = self.__func(self.__func(self.__func(item_dict[0], item_dict[1]), item_dict[2]), item_dict[3])
solution2 = self.__func(self.__func(item_dict[0], item_dict[1]), self.__func(item_dict[2], item_dict[3]))
solution = dict()
solution.update(solution1)
solution.update(solution2)
for key, value in solution.items():
if float(value) == self.target:
answers.append(key)
# 避免有数字重复时表达式重复(T_T懒得优化了)
answers = list(set(answers))
return answers
”’递归枚举”’
def __iter(self, items, n):
for idx, item in enumerate(items):
if n == 1:
yield [item]
else:
for each in self.__iter(items[:idx]+items[idx+1:], n-1):
yield [item] + each
”’计算函数”’
def __func(self, a, b):
res = dict()
for key1, value1 in a.items():
for key2, value2 in b.items():
res.update({‘(‘+key1+’+’+key2+’)’: value1+value2})
res.update({‘(‘+key1+’-‘+key2+’)’: value1-value2})
res.update({‘(‘+key2+’-‘+key1+’)’: value2-value1})
res.update({‘(‘+key1+’×’+key2+’)’: value1*value2})
value2 > 0 and res.update({‘(‘+key1+’÷’+key2+’)’: value1/value2})
value1 > 0 and res.update({‘(‘+key2+’÷’+key1+’)’: value2/value1})
return res
</pre>
Step2：定义游戏精灵类
因为玩家需要通过鼠标点击来操作卡片，这时候就涉及到一些碰撞检测。所以先定义一些必要的游戏精灵类。
源代码加群!欢迎加入新手技术交流基地：*1004391443 群里有大牛解答，有资源，有源码，学不学的会就看你了！
①卡片类
卡片类的定义也很简单，在屏幕上根据被赋予的属性值来显示自身即可。当然之后也需要根据用户的操作来改变这些属性值(内容、颜色、字体等)并在屏幕上根据属性的改变而改变显示状态即可。具体而言代码实现如下：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”>class Card(pygame.sprite.Sprite):
def init(self, x, y, width, height, text, font, font_colors, bg_colors, attribute, **kwargs):
pygame.sprite.Sprite.init(self)
self.rect = pygame.Rect(x, y, width, height)
self.text = text
self.attribute = attribute
self.font_info = font
self.font = pygame.font.Font(font[0], font[1])
self.font_colors = font_colors
self.is_selected = False
self.select_order = None
self.bg_colors = bg_colors
”’画到屏幕上”’
def draw(self, screen, mouse_pos):
pygame.draw.rect(screen, self.bg_colors[1], self.rect, 0)
if self.rect.collidepoint(mouse_pos):
pygame.draw.rect(screen, self.bg_colors[0], self.rect, 0)
font_color = self.font_colors[self.is_selected]
text_render = self.font.render(self.text, True, font_color)
font_size = self.font.size(self.text)
screen.blit(text_render, (self.rect.x+(self.rect.width-font_size[0])/2,
self.rect.y+(self.rect.height-font_size[1])/2))
</pre>
②按钮类
按钮类和卡片类类似，唯一的不同点就是在用户点击按钮时需要根据该按钮的功能来响应用户的本次点击操作(即实现一次该功能)。因此只需要继承卡片类，然后再定义一个响应用户点击按钮事件的回调函数即可。代码实现如下：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”>class Button(Card):
def init(self, x, y, width, height, text, font, font_colors, bg_colors, attribute, **kwargs):
Card.init(self, x, y, width, height, text, font, font_colors, bg_colors, attribute)
”’根据button function执行响应操作”’
def do(self, game24_gen, func, sprites_group, objs):
if self.attribute == ‘NEXT’:
for obj in objs:
obj.font = pygame.font.Font(obj.font_info[0], obj.font_info[1])
obj.text = obj.attribute
self.font = pygame.font.Font(self.font_info[0], self.font_info[1])
self.text = self.attribute
game24_gen.generate()
sprites_group = func(game24_gen.numbers_now)
elif self.attribute == ‘RESET’:
for obj in objs:
obj.font = pygame.font.Font(obj.font_info[0], obj.font_info[1])
obj.text = obj.attribute
game24_gen.numbers_now = game24_gen.numbers_ori
game24_gen.answers_idx = 0
sprites_group = func(game24_gen.numbers_now)
elif self.attribute == ‘ANSWERS’:
self.font = pygame.font.Font(self.font_info[0], 20)
self.text = ‘[%d/%d]: ‘ % (game24_gen.answers_idx+1, len(game24_gen.answers)) + game24_gen.answers[game24_gen.answers_idx]
game24_gen.answers_idx = (game24_gen.answers_idx+1) % len(game24_gen.answers)
else:
raise ValueError(‘Button.attribute unsupport <%s>, expect <%s>, <%s> or <%s>…’ % (self.attribute, ‘NEXT’, ‘RESET’, ‘ANSWERS’))
return sprites_group
</pre>
Step3：实现游戏主循环
先构思一下怎么设计游戏主界面，个人的简单设计草图如下(不是特别走心的设计草图T_T)：
<tt-image data-tteditor-tag=”tteditorTag” contenteditable=”false” class=”syl1555657347497″ data-render-status=”finished” data-syl-blot=”image” style=”box-sizing: border-box; cursor: text; color: rgb(34, 34, 34); font-family: “PingFang SC”, “Hiragino Sans GB”, “Microsoft YaHei”, “WenQuanYi Micro Hei”, “Helvetica Neue”, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: pre-wrap; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: block;”>
image
<input class=”pgc-img-caption-ipt” placeholder=”图片描述(最多50字)” value=”” style=”box-sizing: border-box; outline: 0px; color: rgb(102, 102, 102); position: absolute; left: 187.5px; transform: translateX(-50%); padding: 6px 7px; max-width: 100%; width: 375px; text-align: center; cursor: text; font-size: 12px; line-height: 1.5; background-color: rgb(255, 255, 255); background-image: none; border: 0px solid rgb(217, 217, 217); border-radius: 4px; transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;”></tt-image>
OK，开搞。先初始化、加载必要的素材和定义必要的变量，代码实现如下：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”> # 初始化, 导入必要的游戏素材
pygame.init()
pygame.mixer.init()
screen = pygame.display.set_mode(SCREENSIZE)
pygame.display.set_caption(’24 point – 微信公众号: Charles的皮卡丘’)
win_sound = pygame.mixer.Sound(AUDIOWINPATH)
lose_sound = pygame.mixer.Sound(AUDIOLOSEPATH)
warn_sound = pygame.mixer.Sound(AUDIOWARNPATH)
pygame.mixer.music.load(BGMPATH)
pygame.mixer.music.play(-1, 0.0)
# 24点游戏生成器
game24_gen = game24Generator()
game24_gen.generate()
# 精灵组
# –数字
number_sprites_group = getNumberSpritesGroup(game24_gen.numbers_now)
# –运算符
operator_sprites_group = getOperatorSpritesGroup(OPREATORS)
# –按钮
button_sprites_group = getButtonSpritesGroup(BUTTONS)
# 游戏主循环
clock = pygame.time.Clock()
selected_numbers = []
selected_operators = []
selected_buttons = []
is_win = False
</pre>
游戏主循环主要分三个部分，首先是按键检测：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”> for event in pygame.event.get():
if event.type == pygame.QUIT:
pygame.quit()
sys.exit(-1)
elif event.type == pygame.MOUSEBUTTONUP:
mouse_pos = pygame.mouse.get_pos()
selected_numbers = checkClicked(number_sprites_group, mouse_pos, ‘NUMBER’)
selected_operators = checkClicked(operator_sprites_group, mouse_pos, ‘OPREATOR’)
selected_buttons = checkClicked(button_sprites_group, mouse_pos, ‘BUTTON’)
</pre>
根据检测结果更新卡片状态和一些变量：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”>”’检查控件是否被点击”’
def checkClicked(group, mouse_pos, group_type=’NUMBER’):
selected = []
# 数字卡片/运算符卡片
if group_type == GROUPTYPES[0] or group_type == GROUPTYPES[1]:
max_selected = 2 if group_type == GROUPTYPES[0] else 1
num_selected = 0
for each in group:
num_selected += int(each.is_selected)
for each in group:
if each.rect.collidepoint(mouse_pos):
if each.is_selected:
each.is_selected = not each.is_selected
num_selected -= 1
each.select_order = None
else:
if num_selected < max_selected:
each.is_selected = not each.is_selected
num_selected += 1
each.select_order = str(num_selected)
if each.is_selected:
selected.append(each.attribute)
# 按钮卡片
elif group_type == GROUPTYPES[2]:
for each in group:
if each.rect.collidepoint(mouse_pos):
each.is_selected = True
selected.append(each.attribute)
# 抛出异常
else:
raise ValueError(‘checkClicked.group_type unsupport <%s>, expect <%s>, <%s> or <%s>…’ % (group_type, *GROUPTYPES))
return selected
</pre>
当有两个数字和一个运算符被点击时，则执行被点击数字1{+/-/×/÷}被点击数字2操作(数字1、2根据点击顺序确定)，并进一步更新卡片属性和一些必要的变量：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”> if len(selected_numbers) == 2 and len(selected_operators) == 1:
noselected_numbers = []
for each in number_sprites_group:
if each.is_selected:
if each.select_order == ‘1’:
selected_number1 = each.attribute
elif each.select_order == ‘2’:
selected_number2 = each.attribute
else:
raise ValueError(‘Unknow select_order <%s>, expect <1> or <2>…’ % each.select_order)
else:
noselected_numbers.append(each.attribute)
each.is_selected = False
for each in operator_sprites_group:
each.is_selected = False
result = calculate(selected_number1, selected_number2, *selected_operators)
if result is not None:
game24_gen.numbers_now = noselected_numbers + [result]
is_win = game24_gen.check()
if is_win:
win_sound.play()
if not is_win and len(game24_gen.numbers_now) == 1:
lose_sound.play()
else:
warn_sound.play()
selected_numbers = []
selected_operators = []
number_sprites_group = getNumberSpritesGroup(game24_gen.numbers_now)
</pre>
最后根据各个卡片的属性在屏幕上显示各个卡片，若游戏胜利/游戏失败，则同时显示游戏胜利/游戏失败提示框：
<pre spellcheck=”false” style=”box-sizing: border-box; margin: 5px 0px; padding: 5px 10px; border: 0px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 16px; line-height: inherit; font-family: inherit; vertical-align: baseline; cursor: text; counter-reset: list-1 0 list-2 0 list-3 0 list-4 0 list-5 0 list-6 0 list-7 0 list-8 0 list-9 0; background-color: rgb(240, 240, 240); border-radius: 3px; white-space: pre-wrap; color: rgb(34, 34, 34); letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;”> # 精灵都画到screen上
for each in number_sprites_group:
each.draw(screen, pygame.mouse.get_pos())
for each in operator_sprites_group:
each.draw(screen, pygame.mouse.get_pos())
for each in button_sprites_group:
if selected_buttons and selected_buttons[0] in [‘RESET’, ‘NEXT’]:
is_win = False
if selected_buttons and each.attribute == selected_buttons[0]:
each.is_selected = False
number_sprites_group = each.do(game24_gen, getNumberSpritesGroup, number_sprites_group, button_sprites_group)
selected_buttons = []
each.draw(screen, pygame.mouse.get_pos())
# 游戏胜利
if is_win:
showInfo(‘Congratulations’, screen)
# 游戏失败
if not is_win and len(game24_gen.numbers_now) == 1:
showInfo(‘Game Over’, screen)
pygame.display.flip()
clock.tick(30)
</pre>
