Циклічний перегляд об'єктів інтерфейсу користувача

Сторінка оновлюється :
Дата створення сторінки :

Середовище верифікації

Вікна
  • Вікна 11
Редактор Unity
  • 2020.3.25f1

Передумови для цієї поради

Наступні налаштування були зроблені заздалегідь як обов'язкова умова для пояснення цих порад.

Посилання

Розгортання зразків об'єктів інтерфейсу користувача

Розмістіть кнопку на полотні наступним чином: Виділений об'єкт відображається зеленим кольором для наочності.

Виділяти можна тільки ті об'єкти, які знаходяться в обраному напрямку.

Коли ви розміщуєте об'єкт інтерфейсу користувача, ви можете спочатку натиснути клавіші зі стрілками на клавіатурі або геймпаді, щоб вибрати об'єкт інтерфейсу користувача в зазначеному напрямку. Це дуже інтуїтивно зрозуміло і легко зрозуміти, тому я не думаю, що вам потрібно морочитися зі зміною налаштувань.

Однак у макеті, подібному до меню, за замовчуванням неможливо виконати операцію циклу вибору, наприклад «повернутися до верхньої частини, коли ви натискаєте вниз, коли вибрано нижню частину».

На малюнку вище ви не можете вибрати Button1, натиснувши натиснутою, коли вибрано Button3. Звичайно ж, якщо ви натиснете вгору, коли вибрано Button1, ви не зможете вибрати Button3.

Циклічний перегляд виділень

Тут ми створимо механізм, який дозволить вам нескінченно перебирати виділення. У зразку макета ви можете вибрати Button1, натиснувши вниз, коли вибрано Button3, і ви можете вибрати Button3, натиснувши вгору, коли вибрано Button1.

Цей контроль здійснюється у скрипті. Це сценарій загального призначення, який можна використовувати з невеликою кількістю описів і можна використовувати в інших сценах. Натомість діють такі обмеження:

  • Рухатися вгору і вниз можна тільки в одному напрямку.
  • Застосовується до всіх Selectable існуючих під зазначеним об'єктом

Тому ціль використання обмежена меню, які вибираються прокручуванням вгору і вниз, але дуже корисно, якщо ви обмежитеся цим макетом. До речі, він обмежений верхом і низом, але якщо трохи доопрацювати скрипт, то можна зробити його обмеженим ліворуч і праворуч.

Створіть сценарій у своєму проекті. Ви можете назвати це як завгодно, але я SelectLoop залишу це як .

Скрипт виглядає так:

using UnityEngine;
using UnityEngine.UI;  // 追加

public class SelectLoop : MonoBehaviour
{
  // 最初のフレーム更新の前に開始が呼び出されます
  void Start()
  {
    // ボタンなど選択可能なコンポーネントを取得する
    var selects = GetComponentsInChildren<Selectable>();
    for (var i = 0; i < selects.Length; i++)
    {
      var nav = selects[i].navigation;
      nav.mode = Navigation.Mode.Explicit;
      nav.selectOnUp = selects[i == 0 ? selects.Length - 1 : i - 1];
      nav.selectOnDown = selects[(i + 1) % selects.Length];
      selects[i].navigation = nav;
    }
  }

  // 更新はフレームごとに1回呼び出されます
  void Update() { }
}

Те, що ми робимо, це робимо наступні налаштування для поведінки вибору navigation ключа .

  • Натисніть клавішу вгору, щоб вибрати попередній об'єкт, і виберіть останній об'єкт, щоб вибрати перший об'єкт.
  • Натисніть клавішу вниз, щоб вибрати наступний об'єкт, або виберіть перший об'єкт, якщо це останній об'єкт.

До речі, порядок цього об'єкта (Selectable) залежить від порядку ієрархії. Розташуйте їх у тому порядку, в якому ви хочете, щоб вони були виділені в ієрархії.

Після збереження скрипта прикріпіть його як компонент. Цей скрипт буде застосований до прикріпленого об'єкта Selectable , тому цього разу Canvas ми приєднаємо до .

Спробуйте перемістити його і подивіться, чи зможете ви перемістити його між Button1 і Button3 одним натисканням клавіші.