/ / Cách sử dụng Công cụ GUI của Arcade để tạo Menu trò chơi và Giao diện người dùng

Cách sử dụng Công cụ GUI của Arcade để tạo Menu trò chơi và Giao diện người dùng

Menu trò chơi và giao diện người dùng (UI) đóng vai trò quan trọng trong việc nâng cao trải nghiệm người dùng và mức độ tương tác của trò chơi. Arcade, một thư viện Python phổ biến để phát triển trò chơi, cung cấp các công cụ GUI (Giao diện người dùng đồ họa) mạnh mẽ giúp dễ dàng thiết kế và triển khai menu trò chơi cũng như các thành phần giao diện người dùng.




Tạo một trò chơi đơn giản

Trước khi bắt đầu, hãy đảm bảo rằng bạn đã cài đặt pip trên thiết bị của mình. Sử dụng lệnh này để cài đặt thư viện arcade:

 pip install arcade 

Bắt đầu bằng cách tạo một trò chơi đơn giản bằng Arcade.

Mã được sử dụng trong bài viết này có sẵn trong kho lưu trữ GitHub này và bạn được sử dụng miễn phí theo giấy phép MIT.

Trò chơi này sẽ có một đối tượng người chơi có thể di chuyển sang trái và phải và một đối tượng của kẻ thù. Đây là mã cho trò chơi:

 import arcade

WIDTH = 800
HEIGHT = 600
PLAYER_SPEED = 25

class Game(arcade.Window):
    def __init__(self):
        super().__init__(WIDTH, HEIGHT, "Simple Game")
        self.player_x = WIDTH // 2
        self.enemy_x = WIDTH - 50
        self.game_over = False

    def setup(self):
        arcade.set_background_color(arcade.color.WHITE)

    def on_draw(self):
        arcade.start_render()
        arcade.draw_circle_filled(self.player_x, HEIGHT // 2, 20, arcade.color.BLUE)
        arcade.draw_circle_filled(self.enemy_x, HEIGHT // 2, 20, arcade.color.RED)

    def update(self, delta_time):
        self.enemy_x += 0.5
        if self.enemy_x >= WIDTH:
            self.game_over = True

    def on_key_press(self, key, modifiers):
        if key == arcade.key.LEFT:
            self.player_x -= PLAYER_SPEED
        elif key == arcade.key.RIGHT:
            self.player_x += PLAYER_SPEED

game = Game()
game.setup()
arcade.run()

Thêm trò chơi qua màn hình

Thêm màn hình game over hiển thị thông báo khi kẻ địch di chuyển ra ngoài cửa sổ game. Sử dụng arcade.gui.UIManagerarcade.gui.UIMessageBox lớp để đạt được điều này.

Tạo một thể hiện của Trình quản lý giao diện người dùng và kích hoạt nó. Bên trong on_draw phương pháp, kiểm tra xem game_over cờ được đặt và nếu vậy, hãy vẽ trình quản lý giao diện người dùng. Các show_game_over_screen phương pháp tạo ra một UIMessageBox với thông báo kết thúc trò chơi và thêm nó vào trình quản lý giao diện người dùng. Bạn cũng có thể bật và tắt trình quản lý giao diện người dùng trong cập nhật phương pháp dựa trên trạng thái trò chơi.

Tạo một tệp mới có tên game-over.py và thêm mã với các bản cập nhật bên dưới:

 import arcade
from arcade.gui import UIManager, UIMessageBox

WIDTH = 800
HEIGHT = 600
PLAYER_SPEED = 25

class Game(arcade.Window):
    def __init__(self):
        super().__init__(WIDTH, HEIGHT, "Simple Game")
        self.player_x = WIDTH // 2
        self.enemy_x = WIDTH - 50
        self.ui_manager = UIManager()
        self.game_over = False

    def setup(self):
        arcade.set_background_color(arcade.color.WHITE)
        self.ui_manager.enable()

    def on_draw(self):
        arcade.start_render()
        arcade.draw_circle_filled(self.player_x, HEIGHT // 2, 20, arcade.color.BLUE)
        arcade.draw_circle_filled(self.enemy_x, HEIGHT // 2, 20, arcade.color.RED)
        if self.game_over:
            self.ui_manager.draw()

    def update(self, delta_time):
        self.enemy_x += 0.5
        if self.enemy_x >= WIDTH:
            self.show_game_over_screen()
            self.game_over = True
        if self.game_over:
            self.ui_manager.enable()
        else:
            self.ui_manager.disable()

    def on_key_press(self, key, modifiers):
        if key == arcade.key.LEFT:
            self.player_x -= PLAYER_SPEED
        elif key == arcade.key.RIGHT:
            self.player_x += PLAYER_SPEED

    def show_game_over_screen(self):
        message_box = UIMessageBox(
            width=400,
            height=200,
            message_text="Game Over!"
        )
        self.ui_manager.add(message_box)

game = Game()
game.setup()
arcade.run()

Dưới đây là đầu ra:

trò chơi trên màn hình với một văn bản và một nút

Thêm nút

Bây giờ, nâng cao trò chơi qua màn hình bằng cách thêm các nút để khởi động lại trò chơi hoặc thoát. Bạn có thể thực hiện điều này bằng cách sử dụng nút tham số của UIMessageBox và cung cấp chức năng gọi lại để xử lý các lần nhấp vào nút.

Tạo một tệp mới có tên nút.py và thêm mã với các bản cập nhật bên dưới:

 def show_game_over_screen(self):
    message_box = UIMessageBox(
        width=400,
        height=200,
        message_text="Game Over!",
        buttons=("Restart", "Exit"),
        callback=self.on_game_over_button_click
    )
    self.ui_manager.add(message_box)

def on_game_over_button_click(self, button_text):
    if button_text == "Restart":
        self.restart_game()
    elif button_text == "Exit":
        arcade.close_window()

def restart_game(self):
    self.game_over = False
    self.enemy_x = WIDTH - 50
    self.ui_manager.clear()

Dưới đây là đầu ra:

trò chơi trên màn hình với các nút khởi động lại và thoát

bên trong show_game_over_screen phương pháp, thêm hai nút, Khởi động lạiLối rađến UIMessageBox bằng cách chỉ định chúng trong nút tham số. Cũng cung cấp chức năng gọi lại, on_game_over_button_click, để xử lý các lần nhấp vào nút. Bên trong chức năng gọi lại, hãy kiểm tra nút nào đã được nhấp và thực hiện hành động tương ứng.

Các công cụ GUI của Arcade cung cấp nhiều tính năng bổ sung có thể nâng cao hơn nữa chức năng và tính tương tác của menu trò chơi và thiết kế giao diện người dùng của bạn. Dưới đây là một vài ví dụ:

UIDraggableMixin

Các UIDraggableMixin lớp có thể được sử dụng để làm cho bất kỳ tiện ích giao diện người dùng nào có thể kéo được. Nó cung cấp chức năng xử lý hành vi kéo, cho phép người dùng di chuyển các phần tử giao diện người dùng xung quanh màn hình. Kết hợp mixin này với các tiện ích giao diện người dùng khác cho phép bạn tạo các cửa sổ hoặc bảng điều khiển có thể kéo được trong trò chơi của mình.

UIMouseFilterMixin

Các UIMouseFilterMixin class cho phép bạn nắm bắt tất cả các sự kiện chuột xảy ra trong một tiện ích con cụ thể. Điều này đặc biệt hữu ích cho các tiện ích giống như cửa sổ nơi bạn muốn ngăn các sự kiện chuột ảnh hưởng đến các thành phần giao diện người dùng bên dưới. Bằng cách lọc các sự kiện chuột, bạn có thể kiểm soát tương tác trong tiện ích một cách độc lập.

UIWindowLikeMixin

Các UIWindowLikeMixin lớp cung cấp hành vi giống như cửa sổ cho một tiện ích con. Nó xử lý tất cả các sự kiện chuột xảy ra trong ranh giới của tiện ích và cho phép kéo tiện ích. Điều này lý tưởng để tạo các cửa sổ hoặc bảng điều khiển có thể kéo được mà người dùng có thể tương tác trong trò chơi của bạn.

Bề mặt

Các Bề mặt lớp đại diện cho một bộ đệm để vẽ các phần tử giao diện người dùng. Nó trừu tượng hóa bản vẽ trên bộ đệm và cung cấp các phương thức để kích hoạt, xóa và vẽ bộ đệm trên màn hình. Bạn có thể sử dụng lớp này trong nội bộ để hiển thị tiện ích con hoặc phần tử giao diện người dùng tùy chỉnh trong trò chơi của mình.

Các tính năng bổ sung này mang đến cơ hội tạo trải nghiệm người dùng năng động và tương tác hơn trong trò chơi của bạn. Thử nghiệm với các tính năng này để thêm chức năng độc đáo và làm nổi bật menu trò chơi cũng như thiết kế giao diện người dùng của bạn.

Thực tiễn tốt nhất để kết hợp GUI

Khi kết hợp các công cụ GUI vào trò chơi của bạn bằng Arcade, điều quan trọng là phải tuân theo một số phương pháp hay nhất để đảm bảo trải nghiệm người dùng mượt mà và liền mạch. Dưới đây là một số lời khuyên cần ghi nhớ:

Kế hoạch và nguyên mẫu

Trước khi đi sâu vào triển khai, hãy dành thời gian lập kế hoạch và tạo nguyên mẫu cho menu trò chơi và các phần tử giao diện người dùng của bạn. Xem xét bố cục, chức năng và tính thẩm mỹ trực quan để đảm bảo thiết kế mạch lạc và thân thiện với người dùng.

Giữ nó nhất quán

Duy trì phong cách trực quan nhất quán và bố cục trên các menu trò chơi và các phần tử giao diện người dùng của bạn. Điều này giúp người dùng điều hướng trong trò chơi của bạn dễ dàng hơn và mang lại trải nghiệm gắn kết.

Thiết kế đáp ứng

Thiết kế các phần tử giao diện người dùng của bạn để đáp ứng và thích ứng với các kích thước và độ phân giải màn hình khác nhau. Điều này đảm bảo các menu và giao diện người dùng trò chơi của bạn vẫn có thể sử dụng được và hấp dẫn trực quan trên nhiều thiết bị khác nhau.

Xử lý sự kiện hiệu quả

Xử lý các sự kiện đầu vào của người dùng một cách hiệu quả để đảm bảo các tương tác nhanh nhạy và trơn tru. Tránh các tính toán hoặc xử lý sự kiện không cần thiết có thể gây ra độ trễ hoặc độ trễ trong khả năng phản hồi của giao diện người dùng.

Phản hồi của người dùng

Cung cấp phản hồi rõ ràng và ngay lập tức cho người dùng khi họ tương tác với menu trò chơi và các phần tử giao diện người dùng của bạn. Tín hiệu trực quan, hoạt ảnh và phản hồi âm thanh trong trò chơi có thể nâng cao trải nghiệm người dùng và khiến trò chơi trở nên bóng bẩy hơn.

Bằng cách làm theo các phương pháp hay nhất này, bạn có thể tạo menu trò chơi và thiết kế giao diện người dùng trực quan và hấp dẫn về mặt hình ảnh.

Tăng mức độ tương tác của người dùng với giao diện người dùng hấp dẫn trực quan

Việc thêm các yếu tố GUI vào trò chơi của bạn không chỉ cải thiện khả năng sử dụng mà còn nâng cao sức hấp dẫn trực quan và mức độ tương tác tổng thể của người chơi. Cho dù bạn đang tạo menu bắt đầu, trò chơi trên màn hình hay bất kỳ thành phần giao diện người dùng nào khác, các công cụ GUI của Arcade đều cung cấp nhiều tính năng và chức năng để nâng cao trải nghiệm người dùng trong trò chơi của bạn.

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *