안녕하세요~ totally 개발자입니다. WebView를 사용하시다보면 웹사이트 페이지에 있는 iframe 태그로 구현된 유튜브 영상의 경우 전체화면을 눌러도 안드로이드의 경우 전체화면이 되지 않는 경우가 있습니다. 현재 webview_flutter로는 이것을 해결할 방법이 아직 발견되지 않았고 flutter_inappwebview 패키지를 사용하여 해결할 수 있습니다. Step 1: pubspec.yaml에 flutter_inappwebview 패키지를 추가합니다. Step 2: 사용하실 페이지에서 import합니다. Step 3: 먼저 controller 변수 선언하신 뒤, 아래처럼 InAppWebView 위젯으로 url를 넣어주면 됩니다. 개발에 도움이 되셨기를 바랍니다. Reference: htt..

안녕하세요~ totally 개발자입니다. 플러터 개발을 하시다보면 아래 에러가 종종 발생하는 것을 보신 적이 있을 겁니다. 저는 현재 M1 맥북과 VSCode를 사용하고 있습니다. 해결책은 아래와 같습니다. Step 1: flutter clean 명령어 입력 Step 2: flutter pub get 명령어 입력 Step 3: ios 이슈이니 ios 경로로 가셔서 pod install 명령어 입력 Step 4: 그리고 sudo gem install cocoapods 입력하시고 root 비밀번호(맥 비밀번호)를 입력하시면 됩니다. Step 5: run 실행해줍니다. 다만 여기에서 fn + F5로 디버그 모드로 실행했을 때 에러가 계속 나오는 경우가 있습니다. 이 때에는 터미널에서 flutter run --..

안녕하세요~ totally 개발자입니다. Flutter & Google Analytics 4 설치 및 연동 이 포스팅에서는 Google Analytics 4를 Flutter 앱에 연동하는 방법에 대해 살펴보도록 하겠습니다. 먼저 기본적으로 파이어베이스와 플러터 앱은 연동되어 있어야 합니다. Step 1: 파이어베이스에 접속 -> 프로젝트 설정 -> 통합 -> Google Analytics 사용 설정을 눌러줍니다 (이미 되어 있는 경우에는 스킵하시면 됩니다) Step 2: 계정 선택 후 이미 생성된 계정이 있는 경우에는 그 계정을 선택하면 되고 없는 경우에는 새로 생성하시면 됩니다. 위처럼 입력하고 저장합니다. Step 3: 위치를 지정하고 사용 설정하시면 됩니다. Step 4: 각 플랫폼 별 SDK 추가..

안녕하세요~ totally 개발자입니다. WebView JavaScript Communication Flutter로 개발을 하다보면 웹뷰를 통해서 구현하는 경우가 필요합니다. 웹뷰를 통해서 구현할 때 웹 쪽과 플러터 앱 사이에 통신이 필요한 경우가 있습니다. 통신한다는 이야기는 데이터를 주고 받는 것을 말하며 주로 url 뒤에 데이터를 붙여 parameter 값을 넘기거나 웹 쪽의 자바스크립트 함수를 호출하는 방법이 있습니다. 이 포스팅에서는 자바스크립트 함수를 호출하는 방법을 통해 통신해보도록 하겠습니다. 사용한 패키지는 webview_flutter이며 최신 버전을 사용하면 아래 방법으로 구현이 안 되기 때문에 조금 이전 버전을 사용해야 하며 저는 3.0.4 버전을 사용하였습니다. 참고로 웹뷰로 사용할..

안녕하세요~ totally 개발자입니다. Collection & Generic 이미 해당 부분은 그 동안 포스팅을 해오면서 자연스레 많이 사용하였습니다만 해당 부분에 대한 원리와 개념을 아는 것이 중요하다고 생각되어 포스팅을 쓰게 되었습니다. Collection(콜렉션)이란 데이터들을 모아둔 자료 구조를 말합니다. 플러터는 다트 언어를 사용하고 있으니 Map과 List가 Collection으로 쓰이게 됩니다. 제네릭을 설명하기 전에 제네릭의 유무 차이는 아래와 같습니다. 제네릭을 사용하지 않은 경우 List studentNameList = []; 제네릭을 사용한 경우 List studentNameList = []; 위와 같이 제네릭을 사용하면 사용하고 있는 Collection에 Type(타입)을 지정하게..

안녕하세요~ totally 개발자입니다. 예전 포스팅(아래)에서 Firebase Cloud Messaging을 활용하여 푸시 알림을 하는 방법에 대해 알아보았습니다. https://totally-developer.tistory.com/149 [004] 플러터 (Flutter) Tip - Firebase Cloud Messaging (FCM) & flutter_local_notification 연동 및 알림, 알림 탭 했을 안녕하세요~ totally 개발자입니다. 이 포스팅은 제가 실제 플러터 앱 개발을 진행하며 파이어베이스 클라우드 메시징 (Firebase Cloud Messaging - 이하 FCM) 그리고 flutter_local_notification 패키지와의 연동 totally-developer..