Never give up

build가 끝나지 않은 시점에서 데이터의 변경이 일어나고 notifyListeners를 사용해서 UI를 변경시키면 레드스크린을 볼 수 있습니다 예제로 initState에서 build가 끝나지 않은 상태에서 다음과 같이 값을 변경하면 @override void initState() { super.initState(); Provider.of(context, listen: false).setNum(2); } class TestInt extends ChangeNotifier { int _num = 0; int get getNum => _num; void setNum(int value) { _num = value; notifyListeners(); //문제가 되는 부분 } } 다음과 같은 에러가 출력됩니다 ══..

createState : 프레임워크가 Stateful을 만들 때 createState 호출 mounted is true : createState가 state class를 만든 후 buildContext가 할당된다 할당된 경우 true 아닐경우 false 여기서 setState를 콜하면 widget이 시작되지않고 오류가 발생 initState : 객체가 위젯트리에 할당되었을 때 호출 build 전에 데이터를 가져와야되는 경우 controller등을 설정하는 경우에 사용 didChangeDependencies : State의 의존성이 변경되었을 때 호출 InheritedWidget, Provider등을 통해 데이터 변경 후 상태를 변경 build : 위젯을 return하는 함수 주로 UI부분을 처리 didU..

전에 ScrollController를 이용해서 동작을 읽었는데 Listener을 통해 Drag 이벤트 등을 읽을 수 있습니다 @override Widget build(BuildContext context) { var _data = Provider.of(context); return Scaffold( appBar: AppBar(title: Text('Scroll test')), body: Listener( onPointerMove: (value) { if (value.delta.dy > 0) { _data.setVisible(true); } else if (value.delta.dy < 0) { _data.setVisible(false); } }, child: ListView.builder( itemCou..

Listview를 사용하다보면 스크롤이 맨 위 혹은 아래에 도달했을때 특정 동작을 해야되는 경우가 있는데, ScrollController를 이용하면 간단하게 해결 가능합니다 (해당 소스코드는 맨 아래에 도달했을 때 FAB을 숨기는 동작을 함) 메인 class ListTestScreen extends StatefulWidget { @override _ListTestScreenState createState() => _ListTestScreenState(); } class _ListTestScreenState extends State { ScrollController _controller; @override void initState() { super.initState(); _controller = Scro..

화면을 구성하다보면 Navigator를 통하여 다른 화면으로 이동해야되는 상황이 생기고 Animation을 이용하여 조금 더 멋진 화면을 구성하는데 listener안에서 setState를 이용하면 성능이 떨어지기 때문에 AnimatedBuilder를 이용하면 세련된 애니메이션과 성능을 동시에 잡을 수 있습니다 메인화면 class TestAnimation extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('Animation test')), body: Padding( padding: const EdgeInsets.symmetric(horizontal:..

BottomNavigationBar 등을 통해 화면전환을 할 때 Indexed Stack을 이용하여 화면전환을 하면 더 관리하기 편하고 바뀌는 인덱스에 따라 해당되는 페이지를 보여줍니다 Provider를 이용하여 StatelessWidget에서 구현해봤습니다 (이후 다른 예제에서 많이 사용할 예정이어서 MultiProvider를 사용했습니다) 메인 void main() { runApp(MultiProvider( providers: [ChangeNotifierProvider(create: (_) => PageViewModel())], child: const MaterialApp(home: Main()), )); } 메인화면 class Main extends StatelessWidget { const Mai..

필자가 생각하는 Splash Screen(로딩 화면)사용 이유는 오래걸리는 작업을 할 때 ex) 네트워크에서 API를 불러올때, DB에서 많은 값을 가져올때 첫 화면에서 처리를 해주면 UI rendering중 처리해야될 작업이 줄어들어 앱을 쾌적하게 만들 수 있습니다 flutter.dev/docs/development/ui/advanced/splash-screen 위 공식문서에 따르면 Android, IOS 각각 따로 화면을 만들어주는데 비동기처리의 장점을 이용하여 동시에 관리할 수 있습니다 비동기 처리의 대한 이해가 필요하다면 링크를 참고해주세요 (링크 : devmemory.tistory.com/50) import 'package:ex1/main_screen.dart'; import 'package:f..

소프트웨어 키중 back key를 사용했을때 특별한 처리를 하기 위해서는 onBackPressed가 필요합니다 Native Android에서는 onBackPressed가 이미 있어서 그대로 사용하면 되었지만 Flutter에서는 다른 방법을 통해 해결해야 됩니다 이 방법에 대해서 알아보겠습니다 1. WillPopScope를 이용하여 onBackPressed이벤트 확인 class MainScreen extends StatelessWidget { @override Widget build(BuildContext context) { return WillPopScope( onWillPop: () async { await _onBackPressed(context); return false; }, child: Scaf..