Foggy day

이번 포스팅에서는 EventChannel에 대해 알아보겠습니다. EventChannel(이벤트채널)이란? - 이벤트 채널은 플랫폼들이 이벤트 스트림을 사용해서 통신하는 방법입니다. 데이터 전송 방향은 Native -> Flutter입니다. 1. Dart EventChannel 2. Android EventChannel 1. Dart EventChannel 먼저 Dart 코드에서 이벤트 채널(스트림)을 등록해 보겠습니다. EventChannel 클래스를 생성해야 하는데 이때 생성자에 채널명을 넣어주세요. EventChannel 클래스의 receiveBroadcastStream 함수의 리턴 타입은 Stream이므로 listen 함수를 구현할 수 있습니다. listen 함수의 event에는 Native에서 전..

이번 포스팅에서는 MethodChannel에 대해 간략히 살펴보고, Android Native와 통신하는 방법을 알아보겠습니다. Flutter는 MethodChannel을 사용해서 각 플랫폼과 통신할 수 있습니다. 메소드 채널은 비동기방식이며 FIFO 순서를 보장합니다. 1. Flutter -> Android Native 2. Android Native -> Flutter 1. Flutter -> Android Native 먼저 볼 것은 Flutter에서 Android Native의 함수를 호출하는 방법입니다. - Flutter(Dart) Flutter 측면에서 호출하는 방식은 간단합니다. MethodChannel 클래스를 생성하고, 생성자에 채널 이름으로 원하는 문자열을 넣습니다. 그리고 invokeM..

채널 확인 flutter channel 채널 변경 flutter channel {} ex) flutter channel stable 업그레이드(최신 버전으로 업그레이드) flutter upgrade 다운그레이드(최신 버전보다 한 단계 낮은 버전으로 다운그레이드) flutter downgrade 특정 버전으로 변경 # flutter SDK가 설치된 디렉터리로 이동 cd ~/development/flutter git checkout 3.0.0 flutter doctor flutter --version

이번 포스팅에서는 StreamController의 broadcast에 대해 알아보겠습니다. stream 사용법 -2에서는 single listen을 사용했었습니다. 리스너를 한개만 붙여서 사용할 수 있었습니다. StreamController에는 여러개의 broadcast를 이용해 여러개의 listener를 사용할 수 있습니다. 1. StreamController.broadcast생성 2. Listener 추가 3. add, addStream 4. onListen, onResume, onPause, onCancel 5. 리스너 여러개 추가 5. close 실행 영상 1. StreamController 생성 여러개의 리스너를 사용하고 싶다면 생성할 때 broadcast 생성자를 사용해야 합니다. final ..

이번 포스팅에서는 StreamController에 대해 알아보겠습니다. StreamController는 stream을 구독할 수 있는 클래스입니다. 이전 포스팅에서 Stream을 사용해 데이터의 흐름을 관찰할 수 있다고 했습니다. 그리고 StreamController는 이러한 Stream을 편하게 관리할 수 있도록 도와줍니다. 1. StreamController 생성 2. Stream listen 3. button widget 4. add 5. addStream 6. onListen, onResume, onPause, onCancel 7. close 최종 영상 1. StreamController 생성 StreamController를 생성할 때 Stream의 데이터 타입을 설정해 줄 수 있습니다. 예제에서..

Dart에서는 Future와 Stream으로 비동기 프로그래밍을 구현할 수 있습니다. 이번 포스팅에서는 Stream에 대해 알아보겠습니다. Stream의 사전적인 의미는 흐르다는 뜻이며, 프로그래밍에서는 데이터의 흐름을 의미합니다. Stream을 사용한다면 지속적으로 데이터의 흐름을 관찰할 수 있습니다. 1. Stream 함수의 구조 2. Stream 함수들 3. StreamBasic Widget 1. stream 함수의 구조 Stream에서는 데이터를 전달하는 부분이 있고, 데이터를 받는 부분이 있습니다. 데이터 전달은 Stream 함수에서 하고, 데이터를 받는 것은 listen에서 합니다. 아래 코드를 보면 countStream이라는 Stream타입의 함수를 만들었습니다. 구조를 보면 Stream는 ..

이번 포스팅에서는 Future의 사용법에 대해 알아보겠습니다. Flutter에서는 Future와 Stream을 이용해 비동기 프로그래밍을 구현할 수 있습니다. 비동기와 동기를 간략하게 구분해 보자면 동기는 직렬적으로 작업들을 실행하는 것이고, 비동기는 병렬적/직렬적으로 작업들을 실행시키는 것입니다. 비동기 작업은 네트워크 통신을 할 때 많이 사용합니다. 특정 api를 호출해서 받아온 데이터를 이용해 또다른 api를 호출하는 로직이 많기 때문입니다. 여기서는 비동기에 대해서는 간략하게 언급만 하고, 예제와 함께 Future의 사용법에 대해 알아보겠습니다.  1. 문법의 형태2. Future.microtask3. Future.delayed4. Future.any5. Future.doWhile6. Future..

이번 포스팅에서는 showModalBottomSheet에 대해 알아보겠습니다. showModalBottomSheet는 팝업과 유사하지만 아래에서 위로 올라오는 형태의 팝업입니다. 1. 바텀시트 호출 2. 바텀시트의 특성들 3. 바텀시트와 Future 4. 바텀시트의 AnimationController 최종 동영상 1. 바텀시트 호출 먼저 바텀시트를 호출하는 방법부터 알아보겠습니다. 바텀시트를 호출하기 위해서는 showModalBottomSheet 함수를 사용해야 합니다. 기본적으로 context와 WidgetBuilder를 전달해야 합니다. showModalBottomSheet( context: context, builder: (context) { return Container( color: Colors..

이번 포스팅은 Navigator 사용법 1부에 이은 2부입니다. 1부를 안 보신 분은 확인해 주시기 바랍니다. https://jinhan38.tistory.com/147 [Flutter] Navigator- 사용법(1부) 이번 포스팅은 Flutter Navigator의 사용법에 대해 알아보겠습니다. Flutter에서 화면을 이동하는 방법은 개발자마다 다른 것 같습니다. Flutter에서 제공하는 기본적인 Navigator로만 사용하는 경우가 있 jinhan38.com 1부에서는 Navigator와 MaterialPageRoute를 사용하면서 페이지를 이동했습니다. 이번에는 사전에 경로를 지정해 놓고, 해당 경로를 입력해서 화면을 이동하는 함수를 알아보겠습니다. 1. MaterialApp 설정 2. pus..

이번 포스팅은 Flutter Navigator의 사용법에 대해 알아보겠습니다. Flutter에서 화면을 이동하는 방법은 개발자마다 다른 것 같습니다. Flutter에서 제공하는 기본적인 Navigator로만 사용하는 경우가 있고, Getx나 go_router를 사용하는 분들도 있습니다. 이번에는 Dart에서 제공하는 기본적인 방법을 배워보고 추후에 기회가 되면 다른 방법도 알아보겠습니다. Navigator사용법에 대한 설명은 길어질 것 같아서 1, 2부로 나눴습니다. Navigator를 상세하게 다루기엔 범위가 넓고, 코드 파악에만 많은 시간을 투자해야 합니다. 때문에 간단한 개념과 사용법을 위주로 다루겠습니다. 1. Route와 Navigator 2. push, pop 3. pushReplacement..