Flutter

Flutter 공식 문서(https://docs.flutter.dev/ui/layout) 기반으로 Layout에 대한 심층 분석을 해보려고 합니다. 1. Layout 기본 개념 Flutter에서 Layout은 위젯 트리를 기반으로 이루어집니다. 위젯 트리는 각 위젯의 크기와 위치를 정의하는 계층 구조이며, Flutter 앱의 UI를 구성하는 기본 요소입니다. Layout은 다음과 같은 3가지 단계로 진행됩니다. Measure: 각 위젯은 자식 위젯들의 크기를 기반으로 자신의 크기를 계산합니다. Layout: 각 위젯은 자신의 크기와 위치를 기반으로 자식 위젯들을 배치합니다. Paint: 각 위젯은 자신을 화면에 렌더링합니다. 2. Layout 위젯 종류 Flutter는 다양한 Layout 위젯을 제공합니..

Scrollbar 에 색상을 넣는 방법은 ScrollbarThemeData 를 이용하는 방법이 있다. Widget build(BuildContext context) { return MaterialApp.router( title: 'Flutter Demo', debugShowCheckedModeBanner: false, theme: ThemeData( primarySwatch: Colors.blue, scrollbarTheme: ScrollbarThemeData( thumbColor: MaterialStateProperty.all(Colors.blue), trackColor: MaterialStateProperty.all(Colors.green), thumbVisibility: MaterialStatePr..

Flutter 의 Rendering 과 라이프사이클에 대한 정리 개인적으로 공부하면서 정리한 내용입니다. 잘못된 내용이 있으면 코멘트 부탁드립니다. Lifecycle 에 대해 작성하기 앞서 Flutter 의 작동 방식에 대해 알아보자. Flutter는 60fps 를 목표로 한다. 이는 1초에 최소 60번 화면을 다시 그린다는 의미이다. 일반적으로 화면을 한 번 그릴때마다 복잡한 계산을 해야 한다면 60fps 는 무리일 수 있다. 하지만, 미리 계산된 값이 존재하고 이 값이 변하지 않았다는 가정하에 새로 계산을 하는 대신 이전의 값을 가져다 쓸 수 있으면 속도 향상을 기대할 수 있을 것이다. 이러한 방식을 기반으로 Flutter 는 state 라는 개념을 가지고 있으며, 이를 기반으로 렌더링을 한다. 여기..

The Scrollbar's ScrollController has no ScrollPosition attached. ListView 에 ScrollBar 를 표시하고 싶어서 아래와 같은 구조로 구현하였을 때 위와 같은 에러가 발생하였다 ScrollBar 위젯이 ListView 의 스크롤 포지션 정보를 가져올 수 없어서 발생하는 에러인 것 같다. 해결법은 ListView 와 ScrollBar 의 'controller' 에 동일한 ScrollController 를 지정해주면 해결된다