내가 보려고 적는 기록*✧⁺

WebView란 앱 내에서 웹브라우저 컴포넌트를 사용해 웹페이지를 띄우는 것을 말한다. WebView를 사용하기 위해 webview_flutter 패키지를 활용해보자. 1. 먼저 터미널 창에 아래 명령어를 입력하여 패키지를 설치한다. (참고: https://pub.dev/packages/webview_flutter/install) 최신버전 설치 시 호환성 오류가 많이 발생하여 본 게시글에서는 특정버전(v3.0.4)을 사용한다. $ flutter pub add webview_flutter:^3.0.4 설치 후 pubspec.yaml 파일에 아래와 같이 보인다면 정상적으로 설치에 성공한 것이다. /* pubspec.yaml */ ... dependencies: ... webview_flutter: ^3.0...

Flutter 개발을 하던 중, 여러 위젯들과 ListView.builder로 구성된 body를 전체스크롤이 가능하도록 수정하고싶어 body 전체를 SingleChildScrollView로 감싸준 후 실행을 했다. ... body: SingleChildScrollView( child: Column( childeren: [ Container: ( ... ), Expanded( child: ListView.builder( itemBuilder: (context, i) { ... }, ), ), ], ), ) 실행을 해보니 Exception caught by rendering library 오류가 발생했다. 해당 오류는 ListView(SingleChildScrollView) 내부에 ListView를 중첩으로..

AdMob(Advertising on Mobile)이란, 구글에서 제공하는 모바일 광고 네트워크 및 수익 창출 플랫폼이다. AdMob에서는 앱 오프닝 광고, 배너 광고, 전면 광고, 네이티브 광고, 보상형 광고 등을 지원한다. 1. 먼저 터미널 창에 아래 명령어를 입력하여 패키지를 설치한다. (참고: https://pub.dev/packages/google_mobile_ads/install) $ flutter pub add google_mobile_ads //작성일 기준 버전 3.0.0 설치 후 pubspec.yaml 파일에 아래와 같이 보인다면 정상적으로 설치에 성공한 것이다. /* pubspec.yaml */ ... dependencies: ... google_mobile_ads: ^3.0.0 //버..

먼저, API(Application Programming Interface)란 다른 사람들이 내 컴퓨터에 있는 데이터에 접근할 수 있도록 만들어둔 기능이다. API를 사용하기에 앞서, 비동기 개념에 대해 먼저 알아야한다. 네트워크 요청, 데이터베이스 접근 등과 같이 시간이 오래 걸리는 작업은 비동기 동작으로 처리를 하는것이 좋다. 비동기 동작이란, 하나의 일이 끝나기 전에 동시에 다른 일을 병행하는 방식을 말한다. 비동기 방식을 사용할 때 주의할 점이 있다. 예를 들어 HTTP 요청을 보낸 뒤 응답 받은 결과를 화면에 보여주는 코드를 비동기 방식으로 작성한다고 할 때, 응답을 받기 전에 결과를 보여주려고한다면 에러가 발생할 것이다. 요청을 보내기만하면 끝인 코드라면 비동기 방식으로 처리를 해도되지만, 위..

단순 CRUD(Create, Read, Update, Delete) 기능만을 구현했다면, 데이터가 RAM(휘발성 메모리)에 저장되기 때문에 앱을 재시작하면 데이터가 전부 사라진다. 이를 해결하기 위한 방법 중, shared_preferences 패키지에 대해 알아보자. shared_preferences 패키지는 별도의 데이터베이스 없이 기기에 파일 형태로 데이터를 저장하고 앱을 재시작할 때 파일을 읽어오는 방식으로 사용된다. 1. 먼저 터미널 창에 아래 명령어를 입력하여 패키지를 설치한다. (참고: https://pub.dev/packages/shared_preferences/install) $ flutter pub add shared_preferences //작성일 기준 버전 2.2.0 설치 후 pub..

provider 패키지를 설명하기에 앞서, Flutter의 두가지 위젯에 대해 먼저 알아야한다. Flutter의 위젯은 크게 StatelessWidget과 StatefulWidget으로 나눌 수 있다. StatelessWidget은 상태 변화가 없기 때문에 화면을 새로고침 할 필요가 없다. 즉, build 함수를 한번만 호출하면 된다. 반면 StatefulWidget은 상태 변화가 있기 때문에 화면을 새로고침 해야한다. 즉, build 함수를 여러번 호출해야 한다. StatelessWidget과 StatefulWidget의 기본 구조는 아래와 같다. //StatelessWidget 기본 구조 class MyApp extends StatelessWidget { MyApp(); //생성자 @override ..

코드를 작성하다보면 버튼이 아닌 위젯을 버튼처럼 사용하고싶을 때가 있다. 그 때 GestureDetector 를 사용하면 버튼처럼 사용할 수 있다. 또한 Flutter에서는 각 화면을 라우트(Route)라고 부르는데 화면을 이동할 때 Navigator를 사용한다. 아래 코드는 버튼이 아닌 위젯을 클릭했을 때 화면을 이동하는 코드이다. "페이지 이동" 이라고 적힌 Text를 GestureDetector로 감싼 후, onTap() 안에 SecondPage로 이동하는 코드를 작성한다. GestureDetector( onTap: () { Navigator.push( context, MaterialPageRoute( builder: (context) => SecondPage(), ), ); }, child: Te..

Flutter 개발은 Dart 라는 언어를 사용한다. Dart로 상수를 선언할 때 사용하는 키워드로는 const와 final이 있다. 먼저 상수란, 한 번 값을 대입하면 변경할 수 없는 값을 말한다. const는 컴파일 타임에 값이 초기화되는 반면, final은 실행 중(런타임)에 값이 초기화된다는 차이점이 있다. 가장 많이 사용하는 예시로 DateTime.now() 를 활용한 코드가 있다. //DateTime.now()는 실행되는 시간을 출력할 때 사용 //final은 실행 중 값이 초기화. 정상 출력 final finalLog = DateTime.now() //const는 컴파일 시 값이 초기화. 실행을 언제할지 모르기 때문에 컴파일 시간은 담을 수 없음. 에러 발생 const constLog = D..