Aprenda a criar menus de jogos e projetar interfaces de usuário sem esforço usando as ferramentas GUI do Arcade.

Os menus do jogo e as interfaces do usuário (UI) desempenham um papel crucial no aprimoramento da experiência do usuário e no envolvimento de um jogo. Arcade, uma popular biblioteca Python para desenvolvimento de jogos, fornece poderosas ferramentas GUI (Graphical User Interface) que facilitam o design e a implementação de menus de jogos e elementos de interface do usuário.

Crie um jogo simples

Antes de começar, certifique-se de ter pip instalado no seu dispositivo. Use este comando para instalar a biblioteca arcade:

pip instalar fliperama

Comece criando um jogo simples usando Arcade.

O código usado neste artigo está disponível neste Repositório GitHub e é gratuito para você usar sob a licença do MIT.

Este jogo contará com um objeto de jogador que pode se mover para a esquerda e para a direita e um objeto inimigo. Segue o código do jogo:

importar videogames

LARGURA = 800
ALTURA = 600
PLAYER_SPEED = 25

aulaJogo(videogames. Janela):
def__iniciar__(auto):
super().__init__(WIDTH, HEIGHT, "Jogo Simples")
self.player_x = LARGURA // 2
self.enemy_x = LARGURA - 50
self.game_over = Falso

defconfigurar(auto):
arcade.set_background_color (arcade.color. BRANCO)

defon_draw(auto):
arcade.start_render()
arcade.draw_circle_filled (self.player_x, HEIGHT // 2, 20, arcade.color. AZUL)
arcade.draw_circle_filled (self.enemy_x, HEIGHT // 2, 20, arcade.color. VERMELHO)

defatualizar(auto, delta_time):
self.inimigo_x += 0.5
se self.enemy_x >= LARGURA:
self.game_over = Verdadeiro

defon_key_press(auto, chave, modificadores):
se chave == arcade.key. ESQUERDA:
self.player_x -= PLAYER_SPEED
elif chave == arcade.key. CERTO:
self.player_x += PLAYER_SPEED

jogo = Jogo()
game.setup()
arcade.run()

Adicionando tela de fim de jogo

Adicione uma tela de game over que exiba uma mensagem quando o o inimigo se move para fora da janela do jogo. Use o arcade.gui. UIManager e arcade.gui. UIMessageBox aulas para conseguir isso.

Crie uma instância de UIManager e ative-o. Dentro de on_draw método, verifique se o game Over sinalizador está definido e, em caso afirmativo, desenhe o gerenciador de interface do usuário. O show_game_over_screen método cria um UIMessageBox com uma mensagem de fim de jogo e a adiciona ao gerenciador de interface do usuário. Você também pode habilitar e desabilitar o gerenciador de interface do usuário no atualizar baseado no estado do jogo.

Crie um novo arquivo chamado game-over.py e adicione o código com as atualizações abaixo:

importar videogames
de arcade.gui importar UIManager, UIMessageBox

LARGURA = 800
ALTURA = 600
PLAYER_SPEED = 25

aulaJogo(videogames. Janela):
def__iniciar__(auto):
super().__init__(WIDTH, HEIGHT, "Jogo Simples")
self.player_x = LARGURA // 2
self.enemy_x = LARGURA - 50
self.ui_manager = UIManager()
self.game_over = Falso

defconfigurar(auto):
arcade.set_background_color (arcade.color. BRANCO)
self.ui_manager.enable() # Habilite o gerenciador de interface do usuário

defon_draw(auto):
arcade.start_render()
arcade.draw_circle_filled (self.player_x, HEIGHT // 2, 20, arcade.color. AZUL)
arcade.draw_circle_filled (self.enemy_x, HEIGHT // 2, 20, arcade.color. VERMELHO)
se self.game_over:
self.ui_manager.draw()

defatualizar(auto, delta_time):
self.inimigo_x += 0.5
se self.enemy_x >= LARGURA:
self.show_game_over_screen()
self.game_over = Verdadeiro
se self.game_over:
self.ui_manager.enable()
outro:
self.ui_manager.disable()

defon_key_press(auto, chave, modificadores):
se chave == arcade.key. ESQUERDA:
self.player_x -= PLAYER_SPEED
elif chave == arcade.key. CERTO:
self.player_x += PLAYER_SPEED

defshow_game_over_screen(auto):
message_box = UIMessageBox(
largura=400,
altura=200,
mensagem_texto="Game Over!"
)
self.ui_manager.add (message_box)

jogo = Jogo()
game.setup()
arcade.run()

Abaixo está a saída:

Adicionando botões

Agora, aprimore a tela de game over adicionando botões para reiniciar o jogo ou sair. Você pode fazer isso usando o botões parâmetro de UIMessageBox e fornecer uma função de retorno de chamada para lidar com cliques de botão.

Crie um novo arquivo chamado botões.py e adicione o código com as atualizações abaixo:

defshow_game_over_screen(auto):
message_box = UIMessageBox(
largura=400,
altura=200,
mensagem_texto="Game Over!",
botões=("Reiniciar", "Saída"),
callback=self.on_game_over_button_click
)
self.ui_manager.add (message_box)

defon_game_over_button_click(auto, botão_texto):
se botão_texto == "Reiniciar":
self.restart_game()
elif botão_texto == "Saída":
arcade.close_window()

defreiniciar o jogo(auto):
self.game_over = Falso
self.enemy_x = LARGURA - 50
self.ui_manager.clear()

Abaixo está a saída:

No show_game_over_screen método, adicione dois botões, Reiniciar e Saída, para o UIMessageBox especificando-os no botões parâmetro. Também forneça uma função de retorno de chamada, on_game_over_button_click, para lidar com cliques de botão. Dentro da função callback, verifique qual botão foi clicado e execute a ação correspondente.

As ferramentas GUI do Arcade oferecem uma variedade de recursos adicionais que podem aprimorar ainda mais a funcionalidade e a interatividade dos menus do jogo e dos designs de interface do usuário. Aqui estão alguns exemplos:

UIDraggableMixin

O UIDraggableMixin A classe pode ser usada para tornar qualquer widget de interface do usuário arrastável. Ele fornece funcionalidade para lidar com o comportamento de arrastar, permitindo que os usuários movam os elementos da interface do usuário pela tela. A combinação desse mixin com outros widgets de interface do usuário permite que você crie janelas ou painéis arrastáveis ​​em seu jogo.

UIMouseFilterMixin

O UIMouseFilterMixin A classe permite capturar todos os eventos de mouse que ocorrem em um widget específico. Isso é particularmente útil para widgets semelhantes a janelas, nos quais você deseja impedir que os eventos do mouse afetem os elementos subjacentes da interface do usuário. Ao filtrar os eventos do mouse, você pode controlar a interação dentro do widget de forma independente.

UIWindowLikeMixin

O UIWindowLikeMixin A classe fornece um comportamento semelhante a uma janela para um widget. Ele manipula todos os eventos do mouse que ocorrem dentro dos limites do widget e permite que o widget seja arrastado. Isso é ideal para criar janelas ou painéis arrastáveis ​​com os quais os usuários podem interagir em seu jogo.

Superfície

O Superfície classe representa um buffer para desenhar elementos de interface do usuário. Ele abstrai o desenho no buffer e fornece métodos para ativar, limpar e desenhar o buffer na tela. Você pode usar essa classe internamente para renderizar widgets ou elementos de interface do usuário personalizados em seu jogo.

Esses recursos adicionais oferecem oportunidades para criar experiências de usuário mais interativas e dinâmicas em seus jogos. Experimente esses recursos para adicionar funcionalidades exclusivas e destacar os menus do jogo e os designs de interface do usuário.

Melhores práticas para incorporar GUI

Ao incorporar ferramentas GUI em seus jogos usando o Arcade, é importante seguir algumas práticas recomendadas para garantir uma experiência de usuário suave e perfeita. Aqui estão algumas dicas para manter em mente:

Plano e Protótipo

Antes de mergulhar na implementação, gaste tempo planejando e prototipando seus menus de jogo e elementos de interface do usuário. Considere o layout, a funcionalidade e a estética visual para garantir um design coerente e fácil de usar.

Mantenha-o consistente

Mantenha um estilo visual e layout consistentes nos menus do jogo e nos elementos da interface do usuário. Isso ajuda os usuários a navegar pelo seu jogo com mais facilidade e fornece uma experiência coesa.

Design Responsivo

Projete seus elementos de interface do usuário para serem responsivos e adaptáveis ​​a diferentes tamanhos e resoluções de tela. Isso garante que os menus do jogo e a interface do usuário permaneçam utilizáveis ​​e visualmente atraentes em vários dispositivos.

Tratamento Eficiente de Eventos

Lide com os eventos de entrada do usuário com eficiência para garantir interações responsivas e suaves. Evite cálculos desnecessários ou processamento de eventos que possam introduzir atrasos ou atrasos na capacidade de resposta da interface do usuário.

Feedback do usuário

Forneça feedback claro e imediato aos usuários quando eles interagirem com os menus do jogo e os elementos da interface do usuário. Indicações visuais, animações e feedback de áudio em jogos pode melhorar a experiência do usuário e fazer o jogo parecer mais polido.

Seguindo essas práticas recomendadas, você pode criar menus de jogos e designs de interface do usuário intuitivos e visualmente atraentes.

Aumente o envolvimento do usuário com interface de usuário visualmente atraente

Adicionar elementos GUI ao seu jogo não apenas melhora a usabilidade, mas também aumenta o apelo visual e o envolvimento geral dos jogadores. Esteja você criando um menu inicial, game over screen ou qualquer outro elemento de interface do usuário, as ferramentas de GUI do Arcade oferecem uma variedade de recursos e funcionalidades para aprimorar a experiência do usuário do seu jogo.