[Flutter] 페이지 상단으로 스크롤되는 기능 구현하기(scroll-to-top)

일반적으로 ScrollView의 스크롤 위치를 이동시키기 위해선 ScrollController를 생성자에 넣어주고, 해당 컨트롤러에 jumpTo 등의 메소드를 주어 이동 시켜한다.
하지만, 이 때문에 불필요한 ScrollController를 생성해야하는 불편함이 있고, 이렇게 생성했다 하더라고 다른 context에서 사용하기 위해선 별도의 상태 관리를 해줘야하는 문제점이 있다.

예를 들어 만약 위의 이미지 처럼 하단 네비게이터나 별도의 Top 버튼을 만들어 터치 시 현재 스크롤이 상단으로 이동해야하는 기능을 구현한다고 가정해보자. 기존의 방식이라면 각 페이지의 ScrollView마다 ScrollController를 만들고 이를 네이게이션 버튼과 Top버튼이 참조할 수 있도록 구현해야한다. 둘은 완전히 다른 컨텍스트에 있기 때문에 별도의 viewmodel을 만들어 참조하는 등의 구현이 필요해진다.

하지만 PrimaryScrollController를 사용하면 이런 불편함을 크게 줄일 수 있다.

var controller = PrimaryScrollController.of(context);
controller?.jumpTo(0);

PrimaryScrollController를 사용해 현재 컨텍스트의 ScrollController를 찾고 바로 필요한 기능을 실행할 수 있다.

flutter.... 개발할 때마다 새로운 기능들을 발견하게 된다.