선택한 항목이 드롭다운 항목 목록의 맨 위에 오도록 스크롤합니다

페이지 업데이트 :
페이지 생성 날짜 :

검증 환경

윈도우
  • 윈도우 11
유니티 에디터
  • 2020.3.25에프1

이 팁의 전제 조건

이 팁을 설명하기 위한 전제 조건으로 다음 설정이 미리 이루어졌습니다.

드롭다운 항목 목록을 표시할 때 맨 위 항목이 항상 표시됩니다.

드롭 다운 항목 수가 드롭 다운 영역보다 크면 스크롤이 표시되며, 이때 표시되는 첫 번째 항목은 항상 맨 위에 있는 항목입니다.

맨 아래에 있는 항목을 선택하고 확장할 때도 마찬가지입니다.

그러나 일부 사용자는 확장 시 목록 맨 위에 선택한 항목을 원할 수 있습니다. 이를 수용하려면 다음과 같은 추가 설정을 구성해야 합니다.

드롭다운을 확장할 때 선택한 항목이 맨 위에 오도록 스크롤합니다.

이 작업은 스크립트에 의해 수행됩니다. 프로젝트에 스크립트를 추가하고 이름을 지정 DropdownScroll 하지만 이름은 임의적입니다.

스크립트 편집기를 열 때 다음을 입력합니다.

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

public class DropdownScroll : MonoBehaviour
{
  public void Start()
  {
    // スクロールの計算に必要な各コンポーネントを取得
    var dropdown = GetComponentInParent<Dropdown>();
    var scrollRect = gameObject.GetComponent<ScrollRect>();
    var viewport = transform.Find("Viewport").GetComponent<RectTransform>();
    var contentArea = transform.Find("Viewport/Content").GetComponent<RectTransform>();
    var contentItem = transform.Find("Viewport/Content/Item").GetComponent<RectTransform>();

    // 選択しているアイテムの位置や表示領域をもとに選択アイテムまでスクロールすべき量を計算する
    var areaHeight = contentArea.rect.height - viewport.rect.height;
    var cellHeight = contentItem.rect.height;
    var scrollRatio = (cellHeight * dropdown.value) / areaHeight;
    scrollRect.verticalNormalizedPosition = 1.0f - Mathf.Clamp(scrollRatio, 0.0f, 1.0f);
  }
}

코드의 내용은 그렇게 복잡하지 않습니다. 드롭다운이 확장되면 스크롤 위치가 계산되고 선택한 항목이 맨 위에 오도록 설정됩니다.

Start 메서드에 작성하는 이유는 드롭다운이 확장될 때마다 초기화 프로세스가 작동한다고 가정하기 때문입니다.

코드를 저장한 후 이 Dropdown Template 스크립트를 .

Temolate 그 아래에 있는 오브젝트는 게임이 실행된 후 드롭다운이 확장될 때 생성됩니다. 연결된 구성 요소도 배포 시 초기화됩니다. 또한 드롭 다운을 닫으면 확장 된 오브젝트가 소멸됩니다. 다시 배포하면 다시 생성되므로 각 배포 후에 초기화 프로세스가 실행됩니다.

해보자.

위에서 언급했듯이 아무 조치도 취하지 않은 드롭다운은 아래 항목을 선택한 상태에서 확장해도 표시되지 않습니다. 반면에 우리가 다룬 드롭다운을 확장하면 선택한 항목을 볼 수 있는 지점까지 스크롤되는 것을 볼 수 있습니다.