Study Record

pub get 을 실행하던 Dart Sdk version 이 2.19.0 이상이 필요하다고 해서 프로젝트의 dart version 을 바꿔보려 한다. ✍ dart 버전 다운받기 Flutter SDK releases 를 다운받을 수 있는 사이트에서 원하는 dart version 에 맞는 Flutter SDK 를 다운받는다. Flutter SDK releases All current Flutter SDK releases, stable, beta, and master. docs.flutter.dev 2.19.1 버전을 다운로드하였다. ✍ 안드로이드 스튜디오 프로젝트의 dart 설정하기 다운로드한 Flutter Sdk releases 의 압축을 풀고 ./flutter/bin/cache/dart-sdk/ 파일 경..

✍ 탭바의 기본 클릭 ink 효과 탭바의 탭을 선택하면 기본으로 번지는 효과가 발생한다. 누르면 잉크처럼 번지는 효과(splash)와 관련된 TabBar 인자는 다음과 같다. TabBar({ MaterialStateProperty ? overlayColor, InteractiveInkFeatureFactory? splashFactory, BorderRadius? splashBorderRadius, }) overlayColor 의 기능 중 일부는 splash 와 관련된 색상을 정의한다. splashFactory 는 어떤 splash 를 사용할지를 뜻하고 splashBorderRadius 는 번지는 영역의 가장자리를 둥글게 만들 수 있다. 예시) TabBar({ overlayColor: MaterialSta..

✍ 탭바 디자인 변경하기 TabBar, TabBarView, Tab, DefaultTabController 를 사용하여 구현한 탭바의 디자인과 관련된 인자를 소개하려 한다. ✍ TabBar TabBar({ Key? key, required List tabs, TabController? controller, bool isScrollable = false, EdgeInsetsGeometry? padding, Color? indicatorColor, bool automaticIndicatorColorAdjustment = true, double indicatorWeight = 2.0, EdgeInsetsGeometry indicatorPadding = EdgeInsets.zero, Decoration? ind..

🎁 탭바(TabBar) 만들기 탭바를 만드는 방법 중 Appbar 위젯의 bottom 인자를 사용하는 방법을 소개하려 한다. 먼저 TabBar() 위젯의 tabs 인자(List)에 탭 역할을 할 위젯들을 넣는다. 어떤 위젯이든 되지만 Tab() 위젯을 제공해주고 있다. 탭바에 따른 화면들은 TabBarView() 의 children 인자(List)에 넣어주면 되는데 TabBar() 위젯의 tabs 인자의 List 인덱스와 TabBarView() 의 children 인자의 List 인덱스가 서로 연결되어 탭을 클릭하면 그 인덱스의 화면이 보인다. TabBar 와 TabBarView 를 정의했다고 해서 자동으로 이 둘이 서로 연결되어 탭을 클릭하면 그 화면으로 넘어가는 것은 아니다. 서로를 연결해주는 방식으..

✍ Drawer Dawer 위젯은 햄버거 아이콘을 누르면 슬라이드 메뉴가 나오는 기능을 쉽게 구현해 준다. Scaffold 인자 중 drawer 에 Drawer 위젯을 넣고 appBar 인자를 채우면 자동으로 앱바에 햄버거 아이콘이 추가되면서 Drawer 를 열고 닫기를 조절할 수 있다. 기본 모양은 다음과 같다. Drawer 의 child 로 슬라이드 메뉴의 위젯을 넣어준다. Scaffold( appBar: AppBar(title: const Text("Drawer")), drawer: Drawer( backgroundColor: Colors.deepPurple, child: ListView( children: [ const DrawerHeader( child: Text("Drawer Header", ..

✍ 비동기 작업 비동기로 작업할 때 여러 가지 요청(ex. 서버 request)을 해야할 경우, 한 요청이 끝날 때까지 기다렸다가 끝나면 다른 요청을 시작하는 식으로 순차적으로 진행할 경우 시간이 오래 걸릴 수 있다. 이럴 때, 다수의 요청을 한 번에 시작하고 끝나는 것을 기다린다면 시간을 단축시킬 수 있다. 😶 순차적인 진행일 경우 Future fetchData() async { print("start ${DateTime.now()}"); for(int i=0; i

✍ 실시간 스크롤 offset 알아보기 사용자가 스크롤 위젯을 스크롤할 때마다 얼마큼 스크롤 됐는지 알고 싶을 때가 있다. 이럴 때 ScrollController 를 사용하여 리스너를 추가해 주면 된다. 스크롤 위젯은 controller 인자가 있는 위젯이면 가능하다. (ex. ListView, GridView, CustomScrollView 등) 원하는 스크롤 뷰의 controller 인자에 미리 선언한 scrollController 를 넣고 addListener 함수로 리스너 함수를 선언해 주면 scrollController.offset 값으로 현재 스크롤 값을 알 수 있다. 위젯이 사라지기 전에 removeListener 와 dispose 를 해주는 것도 하면 안전하게 ScrollController..

✍ Enum type 열거형 타입(Enum type)은 고정된 수의 상수 값을 나타내는 데 사용되는 특수한 종류의 클래스이다. 색상을 나타내는 enum type 을 예시로 하면 다음과 같이 사용할 수 있다. enum Color { red, green, blue } void main() { Color color = Color.green; // green switch(color) { case Color.red: print("red"); break; case Color.green: print("green"); break; case Color.blue: print("blue"); break; } } 😶 values enum Color { red, green, blue } void main() { // List ..