Sử dụng các nút trong giao diện người dùng Unity

Trang Cập Nhật : Thứ Ba, 28 tháng 11, 2023

Ngày tạo trang : Thứ Năm, 24 tháng 3, 2022

Môi trường xác minh

Windows

cửa sổ 11

Biên tập viên Unity

2020.3.25f1

Điều kiện tiên quyết cho mẹo này

Các cài đặt sau đây đã được thực hiện trước như một điều kiện tiên quyết để giải thích các mẹo này.

Lúc đầu

Một nút có thể được sử dụng như một đối tượng mà người dùng tự nhấp vào hoặc nó có thể được sử dụng để đưa ra lựa chọn, chẳng hạn như "có" hoặc "không". Nếu bạn muốn phức tạp hơn một chút, bạn có thể sử dụng một nút làm đối tượng để chọn một mục danh sách như menu.

Ngoài ra, nó cũng có thể được sử dụng cho mục đích gỡ lỗi và khi nhấp vào nút để thay đổi trạng thái tùy ý.

Nhấp vào nút để thay đổi văn bản

Nếu bạn chỉ cần nhấp vào nút, bạn sẽ thực hiện một số xử lý. Lần này, mỗi lần bạn nhấp vào nút, số văn bản sẽ tăng thêm 1.

Vị trí và cấu hình giao diện người dùng

Thêm văn bản và các nút từ cấu trúc phân cấp vào dạng xem.

Bạn có thể đặt nó ở bất cứ đâu miễn là bạn đặt nó ở nơi bạn có thể nhìn thấy nó. Vì rất khó nhìn thấy ở trạng thái ban đầu, các cài đặt như "màu văn bản trắng", "thay đổi kích thước", "tăng kích thước phông chữ", v.v. được đặt. Nội dung của Văn bản sẽ được thay đổi tự động sau đó, vì vậy bạn có thể để nó dưới dạng "Văn bản mới".

Cài đặt ký tự của nút được chia thành "Nút" và "Văn bản", vì vậy hãy chọn Văn bản và đặt nó.

Thêm tập lệnh

Chọn thư mục Scenes từ dự án của bạn, nhấp chuột phải vào một khoảng trống và chọn C# Script để thêm nó. Ban đầu, tốt hơn là tạo tập lệnh trong một thư mục riêng biệt, nhưng tôi sẽ bỏ qua nó cho mục đích kiểm tra hoạt động.

Tên tệp phải dễ hiểu. Nhập càng nhiều ký tự chữ và số càng tốt. ButtonClick Trong trường hợp này, nó được đặt thành .

Sau khi tạo, nhấp đúp vào tập lệnh C # để mở trình chỉnh sửa tập lệnh. Nếu trình soạn thảo tập lệnh của bạn là Visual Studio, bạn sẽ thấy một cái gì đó như thế này:

Start, Phương pháp lần này không cần thiết, vì vậy hãy xóa nó, Update viết lại và lưu nó như sau.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;    // 追加

public class ButtonClick : MonoBehaviour
{
  /// <summary>カウントアップするテキストオブジェクト。</summary>
  [SerializeField] Text CountText;

  public void OnClick()
  {
  }
}

Cú pháp của C# không phải là chủ đề chính của mẹo này, vì vậy tôi sẽ không giải thích nó. Hãy tự học. Chỉ thảo luận về các mô tả cụ thể của Unity.

MonoBehaviour Các trường được viết trong các lớp kế thừa từ đó sẽ có thể được đặt trong Unity Editor. CountText Ở đây, chúng ta định nghĩa một đối tượng text được gọi là Để nó được hiển thị, nó public phải được xuất bản với . SerializeField Tuy nhiên, nếu bạn thêm thuộc tính, bạn public sẽ có thể hiển thị nó trong trình chỉnh sửa với khả năng truy cập khác với . Đây là một mô tả tốt hơn nếu bạn không muốn truy cập nó từ các lớp khác càng nhiều càng tốt ngoài mục đích thiết lập nó trong trình chỉnh sửa.

OnClick Các phương pháp được cung cấp để mô tả phải làm gì khi nhấp vào nút. public Điều này phải được định nghĩa trong .

Đính kèm từ Unity Editor

Quay trở lại Unity Editor và chọn từ hệ thống phân cấp EventSystem .

EventSystem inspector sẽ xuất hiện, vì vậy hãy thả tập lệnh C # bạn vừa tạo trong khu vực "Thêm thành phần" bên dưới. Kịch bản hiện đã sẵn sàng để hoạt động.

Trên thực tế, tập lệnh này có thể được gắn vào bất kỳ đối tượng nào và Button nó phải được gắn vào đối tượng. Trong mẹo này, chúng tôi sẽ thêm vào để làm cho nó thống nhất dễ hiểu EventSystem . Button Tất nhiên, không có vấn đề gì với việc gắn nó vào . Tuy nhiên, tốt hơn là không gắn nó vào một đối tượng hoàn toàn không liên quan, vì nó sẽ gây nhầm lẫn.

Nếu bạn nhìn vào tập lệnh bạn đã thêm, bạn có thể thấy rằng mục "Đếm văn bản" được hiển thị. Khi bạn đã xuất bản một trường theo cách này, bạn sẽ có thể đặt giá trị từ Unity Editor. Chúng tôi muốn truy cập đối tượng văn bản khi chúng tôi nhấp vào nút, vì vậy hãy kéo từ hệ thống Text phân cấp và Count Text thả nó vào . Điều này sẽ cho phép bạn truy cập nó từ tập lệnh của bạn bất cứ lúc nào.

Tiếp theo, chọn từ hệ thống Button phân cấp và nhấp vào + bên dưới Khi nhấp vào trong Trình kiểm tra Button .

Sau đó, một mục sẽ được thêm vào.

Ở mục dưới bên phải, tôi đã bỏ một tập lệnh đính kèm từ hệ EventSystem thống phân cấp. Vì chúng ta cần đặt đối tượng mà tập lệnh được đính kèm ở đây, Nếu bạn đang đính kèm tập lệnh vào Nút, bạn cần bao gồm Nút.

Nếu bạn nhấp vào "Không có chức năng", tập lệnh đính kèm sẽ được hiển thị, vì vậy ButtonClick hãy chọn . Chọn phương pháp bạn đã tạo OnClick trong đó. Bây giờ khi bạn nhấp vào nút, OnClick phương thức được gọi.

Nhật ký đầu ra bằng cách nhấp vào nút

Tôi sẽ xuất nhật ký để xác nhận rằng nó hoạt động. Bạn có thể kiểm tra xem nó có hoạt động chỉ bằng cách viết một dòng hay không và nó sẽ rất hữu ích cho việc gỡ lỗi trong tương lai, vì vậy tốt hơn là bạn nên nhớ nó.

ButtonClick Mở tập lệnh và OnClick thêm nội dung sau vào .

public void OnClick()
{
  // コンソール ログを出力
  Debug.Log("ボタンが押されました！");
}

Khi bạn đã nhập và lưu, hãy chạy trò chơi và nhấp vào nút.

Mỗi lần bạn nhấp vào nó, một thông báo sẽ xuất hiện trong tab bảng điều khiển. Bây giờ bạn có thể thấy rằng nó đang hoạt động.

Thay đổi văn bản bằng cách nhấp vào nút

Bây giờ bạn có thể di chuyển các nút, mục đích của mẹo này đã đạt được. Bây giờ tôi đã đặt đối tượng văn bản, tôi muốn thay đổi văn bản mỗi khi tôi nhấp vào nút.

Viết lại kịch bản như sau.

// 省略

public class ButtonClick : MonoBehaviour
{
  /// <summary>カウントアップするテキストオブジェクト。</summary>
  [SerializeField] Text CountText;

  /// <summary>クリックカウント。</summary>
  private int _counter = 0;

  public void OnClick()
  {
    // コンソール ログを出力
    Debug.Log("ボタンが押されました！");

    // カウントを増やす
    _counter++;

    // カウントした数を表示する
    CountText.text = _counter.ToString();
  }
}

Nội dung chỉ đơn giản là tăng số đếm lên 1 mỗi khi bạn nhấp và đặt số cho đối tượng văn bản.

Chạy trò chơi và đảm bảo rằng số lượng tăng lên với mỗi lần nhấp.

Căn chỉnh máy ảnh (2D) với khung vẽ

Sử dụng menu thả xuống Unity UI