Flutter - InAppWebView 5.8.0 > 6.0.0 마이그레이션 가이드

개요 인앱웹뷰가 6.0.0으로 버전업이 되었다. 이번에 마이그레이션을 하면서 느낀점은 편의성이 많이 좋아진 것 같은데 자세히는 안써봐서 잘 모르겠다. 우선은 내 프로젝트에 있는 코드들을 마이그레이션하면서 수정하였던 부분들을 기준으로 기재하도록 하겠다. 포스팅에서 인앱웹뷰 마이그레이션의 기준은 5.8.0에서 6.0.0이므로 글을 읽기 전에 참고하길 바란다. InAppWebview Migration 최소 필요 사양 변경 만약 앱이 실행이 되지 않거나 디버깅이 되지 않는다면 아래의 필요 사양을 꼭 확인해보자. 안드로이드 기준으로는 아마 compileSdk가 29~33 API 사이로 되어 있을 것이다. 다트 SDK : 2.17.0 이상, 4.0.0 미만 Flutter : 3.0.0 이상 Android : min..

• format_list_bulleted Mobile/Flutter
• · 2023. 12. 28.
• textsms

Flutter - Provider 없이 클래스 간 상태 관리 하기 (State 직접 업데이트하기)

개요 작성 목적 나는 처음 상태 관리를 provider로 배웠다. 간단한 로직임에도 다른 클래스끼리의 상태 변환을 위해 provider를 불러오고 정의하려니 너무 번거롭기도 하고 익숙한 형태도 아니기 때문에 불편했다. 간단히 클래스 간 상태를 공유하기 위해서, 또한 상태가 변경될 때의 빌드 작동 순서를 명확하게 이해하고자 직접 샘플 프로젝트로 최대한 간단하게 구현해 보았다. 내용 이 포스팅은.. 상태 관리 관련 패키지(Provider, GetX, Riverpod, bloc) 등의 패키지를 사용하지 않고 다른 클래스 간 상태를 직접 setState로 변경하는 방법을 다룬다. * 설명으로 다루는 프로젝트는 아래의 깃허브에서 다운로드 가능합니다. https://github.com/luvris2/flutter-..

• format_list_bulleted Mobile/Flutter
• · 2023. 12. 22.
• textsms

Flutter - Carousel Slider 기본 구문, 사용 방법, 캐러셀 인디케이터 구현하기

Overview 이번 포스팅에서는 Carousel Slider 를 사용하여 페이지들을 슬라이드로 넘기는 기능을 구현해 보도록 합니다. 또한, 사용자의 입력 없이 자동으로 일정한 간격으로 페이지가 슬라이드 되는 기능과 하단의 인디케이터를 통해 현재 화면 표시 및 특정 페이지로 이동하는 기능을 구현합니다. 포스팅에서는 각 페이지당 이미지를 배치하여 식별할 수 있도록 하였습니다. 포스팅에서 설명하는 플러터 프로젝트 파일은 깃허브에서 다운로드 가능합니다. https://github.com/luvris2/flutter-example/tree/main/flutter_carousel_slider_test 사전 작업 Carousel Slider 패키지 설치 flutter pub add carousel_slider 이미..

• format_list_bulleted Mobile/Flutter
• · 2023. 12. 20.
• textsms

Flutter VS Code Extension - 플러터 코드 자동 완성 익스텐션 설치 및 사용 방법 (Awesome Flutter Snippets With VS Code)

Awesome Flutter Snippets 어썸 플러터 스니펫은 일반적으로 사용되는 플러터 클래스 및 메서드를 모아둔 것이다. 위젯 작성과 관련된 대부분의 보일러 플레이트 코드를 제거하여 개발 속도를 높여준다. 예를 들어, Stateless Widget위젯은 statelessW를 입력하여 만들 수 있도록 한다. 쉽게 말해서, 자주 사용되는 기본적인 클래스 및 메서드들을 쉽게 작성할 수 있도록 도와주는 익스텐션이라고 보면 된다. * 보일러플레이트 코드(Boilerplate code) : 상용구 코드라고도 부르며, 여러 가지 상황에서 수정하지 않거나 최소한의 수정만을 거쳐 여러 곳에 필수적으로 사용되는 코드를 의미한다. 굳이, '이런 간단한 것들 때문에 익스텐션까지 설치해야해?' 라는 의문이 들 수도 있다..

• format_list_bulleted Mobile/Flutter
• · 2023. 12. 15.
• textsms

Flutter - InAppWebview Communication (인앱웹뷰로 웹과 앱 양방향 통신하기, 자바스크립트 커뮤니케이션)

Overview 이번 포스팅에서는... InAppWebview Package를 이용하여 구성된 웹 페이지에서 자바스크립트를 통해 웹에서 앱으로 데이터를 전달하고 (web -> app) 앱에서 웹으로 데이터를 전달하고 (웹에서 데이터를 요청하면, app -> web) 웹과 앱 서로 데이터를 양방향으로 주고 받는 (web app) 방법에 대해서 포스팅합니다. 이 포스팅에서는 InAppWebview의 기본 사용 방법은 설명하지 않습니다. 웹 페이지 구성 및 기본 사용 방법에 대한 포스팅은 아래의 포스팅을 참고해주세요. Flutter - inAppWebView 사용 방법, 메서드 설명, 당겨서 새로고침 기능 구현 inAppWebview에서 팝업은 기본적으로 보여지지 않기 때문에 따로 구현해야 합니다. 팝업 구현..

• format_list_bulleted Mobile/Flutter
• · 2023. 11. 28.
• textsms

Flutter - showDialog 상태변환하기 (다이얼로그 새로고침, setState, StatefulBuilder, StatefulWdiget)

Overview 다이얼로그 내에서는 상태변환이 이뤄져도 다이얼로그 창의 위젯이 다시 렌더링이 되지 않는다. 이유는 다이얼로그를 포함하는 클래스 자체가 StatelessWidget으로 구성되어 있기 때문이다. 이것을 어떻게 확인하냐면, IDE툴에서 showDialog 혹은 AlertDialog 위치에서 F12를 눌러보자. 그럼 Dialog 클래스가 StatelessWidget을 상속하는 것을 확인할 수 있다. (필자는 VS Code를 사용하며, F12는 Go to Definition 기능으로, 정의된 부분을 바로 확인할 수 있는 기능을 제공한다.) 즉, 다이얼로그 창 내에서 상태변환을 하여도 데이터가 업데이트되지 않고, 재호출해야 바뀐 값을 불러온다. 아래의 이미지는 확인 버튼을 누르면 값이 +1씩 증가하..

• format_list_bulleted Mobile/Flutter
• · 2023. 11. 27.
• textsms