UI Scroll Rect 만들기 및 기능 설명

만을어볼 기능 = 스크롤 되는 창

1. ScollRect만들기

먼저 마스크 영역을 만든다.

Panel을 만들어준다. Image로 해도 상관없음.

내가 원하는 크기로 조절 후 

마스크 컴포넌트를 추가해준다.

똑같은 방법으로 스크롤 렉트도 추가한다.

이제 마스크 영역이 만들어 젔고 내가 원하는 이미지를 띠우면 된다.

이미지 생성 하기

리소스중에 원하는거 선택해서 넣으면됨.

이제 크기를 정하면 됨. Width, Height만큼 스크롤 할수 있습니다.

텍스처가 있는데 안뜨는 경우 이미지를 눌러보면 sprite로 변경 해주어야함.

다시 패널을 눌러서 Content에 Image를 넣어주자.

스크롤 렉트 부과 설명(포터샵으로 만듬)

마스크 스크롤 렉트 완성!

완성 GIF

이미지 크기는 2000x2000으로 해놨고 마스크 영역은 캔버스 크기로 해 놓음.

스크롤 하면 그 부분만 확인할 수 있다.

마스크 영역이 아니여도 나오게 하고싶을 경우 마스크 컴포넌트를 삭제하면 된다.

2. 스크롤바(Scollbar) 만들기

패널안에 스크롤 바 생성하자

처음 생성하면 왼쪽에서 오른쪽으로 스크롤할 수 있게 되어있다.

Direction을 변경 하면 위에서 아래로, 아래서 위로, 오른쪽에서 왼쪽으로 변경 가능하다.

스크롤할 방향과 크기와 위치를 조절했다. 이제 스크롤렉트에 연결해야 한다.

패널을 눌러서 스크롤를 연결 한다.

스크롤 바 만들기 끝

결과화면

위 아래 스크롤 거꾸로 했넹.