전체 글
Flutter Generator 사용법
Flutter Generator Code Generator 코드 제너레이션 사용 이유 - 반복되는 코드를 자동으로 생성할때 사용 - 보일러 플레이트 코드 감소 등등 Flutter Gen 사용법 pubspec.yaml 설정 - dev_dependencies: flutter_gen_runner: ^5.2.0 - flutter_gen 설정 flutter_gen: output: lib/gen/ #default: lib/gen/ line_lenght: 160 #default: 80 null_safety: true integrations: flutter_svg: true flare_flutter: true assets: enabled: true fonts: enabled: true colors: enabled: t..
Flutter - Getx(LifeCycle) 사용방법
Flutter App을 만들다 보면 상태관리를 GetX로 하거나 Provider등등 다양한 상태관리를 통해 App을 관리할 수 있다. 하지만 FlutterApp을 만들때 변수를 바꾸거나 관리하기 위해 StatefulWidget을 사용하는데 GetX라이브러리는 StatefulWidget 사용을 지양하하고 .obs 관찰 연산자를 통해 변수를 Observable로 바꾸는데 사용한다 이로인해 StatefulWidget은 사용하지 않고 StatelessWidget을 사용하게 되는데 StatelessWidget을 사용하게 되면, 그 Widget은 상태값을 가지지 않는 위젯이 된다. 그럼 이 상황에서 우리는 어떤 방식으로 생명주기를 관리할 수 있는지에 대해 의문이 들 수 있습니다. Controller단에 GetxCo..
![[Flutter] - SliverAppBar 사용 방법](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdfoRnH%2Fbtrv6egWUBZ%2F4r23tgdD7iDoI1Os1hOGD0%2Fimg.png)
[Flutter] - SliverAppBar 사용 방법
안녕하세요 오늘은 SliverAppBar 사용 방법에 대해 설명드리겠습니다. Body에 List뷰를 사용했을때 상단 AppBar가 확장되거나 내가 스크롤하는 움직임에 따라서 변화를 주고 싶을 때 주로 사용합니다. 기본 위젯에 요소가 너무 많아서 제가 쓰면서 가장 필요하다고 생각했던 것들 위주로 정리해봤습니다. 일단 구현 화면은 다음과 같습니다. 하단 사진을 보시면 body부분엔 Listview가 AppBar에는 Image가 들어가 있는 형태로 구성되어 있습니다. 그럼 이렇게 구현하려면 어떤 방식을 사용해야 하는지 지금 부터 알아보도록 하겠습니다. 1. slivers를 CustomScrollView로 감싸주자 @override Widget build(BuildContext context) { return ..
![[Flutter] BottomNavigationBar (플러터 바텀네비게이션) 사용 방법](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FpSJKx%2FbtrsXtUO9Hb%2FzffUMO2sVB4O0RFuWkVcRk%2Fimg.png)
[Flutter] BottomNavigationBar (플러터 바텀네비게이션) 사용 방법
안녕하세요 오늘은 BottomNavigationBar 사용 방법에 대해 설명드리겠습니다. 이런 기본적인 위젯이 알아두면 쉽게 써먹을 수 있죠 많이 쓰이기도 하구요. 기본적으로 사용하는 방법 중 2가지를 소개해 드리자면, 스와이프(Swipe)가 필요한 경우 그렇지 않은 경우로 나뉜 방법을 설명 드리겠습니다. 1. Swipe 가능 DefaultTabController을 이용하는 방식입니다. Scaffold의 Body 부분을 TabBarView로 선언해 주면서 tab 별 화면을 작성하고 bottomNavigationBar에서는 Container안의 Tabbar를 구현해주시면 swipe으로 구현이 가능합니다. class _bottomnaviState extends State { @override Widget b..
![[Flutter] 2.0 Button(플러터 버튼) 사용방법](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FUHjrN%2FbtrsXsn3aCG%2Fzg681PWvopPZzS3D0pNMjK%2Fimg.png)
[Flutter] 2.0 Button(플러터 버튼) 사용방법
안녕하세요 오늘은 Flutter Button 사용방법에 대해 포스팅 해보도록 하겠습니다. flutter 버전이 2.0으로 올라가면서 버튼이 변경되었습니다. 기존 버튼들인 FlatButton, OutlineButton, RaisedButton -> TextButton, OutlinedButton, ElevatedButton 으로 변경되었습니다. 현재 2.0 이상의 버전에서 기존 버튼들을 사용할 시엔 이런식으로 deprecated가 된 것을 확인할 수 있으며 대체할 버튼을 사용하라는 친절한 메세지도 보여줍니다. FlatButton -> TextButton OutlineButton -> OutlinedButton RaisedButton -> ElevatedButton 으로 변경되었습니다. 바뀐 후 버튼의 사용..