วนซ้ําการเลือกวัตถุ UI

ปรับปรุงหน้า :
วันที่สร้างเพจ :

สภาพแวดล้อมการตรวจสอบ

หน้าต่าง
  • หน้าต่าง 11
ตัวแก้ไขความสามัคคี
  • 2020.3.25f1

ข้อกําหนดเบื้องต้นสําหรับเคล็ดลับนี้

มีการตั้งค่าต่อไปนี้ล่วงหน้าเป็นข้อกําหนดเบื้องต้นสําหรับคําอธิบายของเคล็ดลับเหล่านี้

หนังสืออ้างอิง

การปรับใช้ออบเจ็กต์ UI ตัวอย่าง

วางปุ่มบน Canvas ดังนี้: วัตถุที่เลือกจะแสดงเป็นสีเขียวเพื่อความชัดเจน

คุณสามารถเลือกได้เฉพาะวัตถุที่อยู่ในทิศทางที่เลือกเท่านั้น

เมื่อคุณวางวัตถุ UI คุณสามารถกดปุ่มลูกศรบนแป้นพิมพ์หรือแป้นเกมเพื่อเลือกวัตถุ UI ในทิศทางที่ระบุ สิ่งนี้ใช้งานง่ายและเข้าใจง่ายดังนั้นฉันไม่คิดว่าคุณต้องเปลี่ยนการตั้งค่า

อย่างไรก็ตาม ในรูปแบบที่เหมือนเมนู จะไม่สามารถดําเนินการลูปการเลือกได้ เช่น "กลับไปที่ด้านบนเมื่อคุณกดลงในขณะที่เลือกด้านล่าง" ตามค่าเริ่มต้น

ในรูปด้านบน คุณไม่สามารถเลือก 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 ที่แนบมาดังนั้นคราว Canvas นี้เราจะแนบไปกับ

ลองย้ายและดูว่าคุณสามารถย้ายไปมาระหว่าง Button1 และ Button3 ด้วยการกดแป้นพิมพ์ได้หรือไม่