[flutter] 29... ExpansionTile 스크롤 영역 개선하기

플러터에서 가장 많이 쓰이는 위젯중 하나는 Listview일것이다.

이 위젯과 같이 쓰이는 찰떡 위젯은 ExpansionTile이다.

 

그런데 해당 위젯으로 구성하면

타일 부분을 터치하며 스크롤하면 먹히지 않는다.

따라서 타일이 그려지지 않는 영역을 터치하여 스크롤해야한다.

앱을 빌드해보면 정말 별로다...

 

열심히 구글링한 결과 역시나 방법은 있었다.

 

우선 해당 위젯을 Stateful Widget으로 변경해줘야한다.

 

다음 리스트뷰안에 컨트롤러를 등록해주고

ListView.builder(
 controller: _scrollController,
 ...
 ...
 ...

컨트롤러를 작성해주면 끝난다.

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final ScrollController _scrollController = ScrollController();

  void _scrollToSelectedContent(bool isExpanded, double previousOffset, int index, GlobalKey myKey) {
    final keyContext = myKey.currentContext;

    if (keyContext != null) {
      // make sure that your widget is visible
      final box = keyContext.findRenderObject() as RenderBox;
      _scrollController.animateTo(isExpanded ? (box.size.height * index) : previousOffset,
          duration: Duration(milliseconds: 500), curve: Curves.linear);
    }
  }

 해주고나니 정말 속이 시원해졌다...