스크롤 뷰에서 Content 내부의 특정 요소가 보이려면 어떻게 해야하는지 계산할 필요가 생겼다.
이 작업을 하기 위해서 필요한 전제조건은 다음과 같다.
1. 스크롤 뷰를 다룰 줄 알아야 한다.
2. 스크롤뷰, 뷰포트, 콘텐트의 각 차이를 알아야 한다.
3. 이번 글에서는 수직값을 계산하는데 중점을 둔다.
만약 아직 스크롤뷰를 다룰줄 모르는 사람이 이를 행해야 한다면 튜토리얼을 보는 것을 추천한다.
유니티 공식 메뉴얼도 있고,
https://wergia.tistory.com/25 다른 분들의 글을 보는 것도 나쁘지 않다.
그리고 2번 항목인 스크롤뷰, 뷰포트, 콘텐트의 차이는 이러하다.
Scroll View - Scroll Rect를 포함하는 스크롤 요소의 최상위 오브젝트다.
Viewport - Scroll View 하위 요소중 하나로 Mask 역할을 한다. 즉, 실제로 어느 영역까지를 보여줄지 정하는 것은 Viewport이다. 이는 Content와의 크기차이를 기반하여 수평, 수직 Bar의 길이가 정해진 다는 것이다.
Content - Viewport에 의해 보여질 영역이다. 즉 스크롤UI에 속하게 하려면 Content 내부에 요소를 배치해야한다.
이를 조금더 이해해보려면 Content의 크기를 늘렸다 줄였다하면서 스크롤바가 어떻게 변하는지 확인해보자.
-------------------------------------------------------
계산방법
Viewport와 Content의 Anchors를
Min(0,1), Max(1,1), Pivot(0,1)로 설정한다.
이렇게하면 좌우는 Stretch상태가 되고 상단을 기준으로 잡혀 높이를 늘릴때 하단으로 길어진다.
2D에서 UI는 Anchors와 Pivot에 의해 좌표나 크기에 따른 연산 방식이 달라진다. 지금은 좀더 수월하게 하기위해 이렇게 설정했다.
계산식은 다음과 같다.
VerticalNormalizedPosition = 1f + (target.anchoredPosition.y / view.content.sizeDelta.y);
이렇게 하는 이유는 앵커의 기준이 상단이기 때문에 스크롤 최상단에 위치할수록 0에 가깝고 아래로갈수록 값이 -로 작아진다.
즉, 0 ~ -1f 사이의 값이 나온다.
수직스크롤바는 최상단은 1이고 아래로갈수록 0이라서 1f 를 더함으로서 수치를 맞춰준다.
이 계산식은 하나의 문제점이 있는데, 이동했을때 Viewport의 최상단에 위치한 것이 아니라, 보이도록 한 것이기 때문에 본래 위치의 영향을 받는다. 한번 실행해보면 이해할 것이다.