[Flutter/Dart] Web Blog App 코딩하기

1. 콜백함수와 웹뷰 위젯

(콜백함수)

Callback 함수는 일정작업이 완료되면 실행되는 함수이다. 함수를 정의해두면, 바로 실행되지 않고, 특정 조건이 성립할 때 비로소 실행된다. 유저가 화면을 터치할 때, 웹뷰의 로딩이 완료되었을 때 등 실행된다.

(웹뷰 위젯)

웹뷰는 프레임워크에 내장된 브라우저를 앱의 네이티브 컴포넌트(component)에 임베딩(embedding)하는 기능이다. 즉 앱에서 웹브라우저 기능을 구현해주는 기술이다. 웹뷰는 네이티브 컴포넌트에 비해 속도가 느리고 애니메이션이 부자연스럽다는 단점이 있다. 그럼에도 웹뷰를 사용하는 이유는 웹사이트를 쉽게 활용할 수 있기 때문이다. 플러터에서도 웹뷰 위젯을 제공하며, 이 위젯을 사용하여 앱에서 브라우저를 실행할 수 있다.

웹뷰 위젯의 속성
속 성	세부내용 (기능)
initialUrl	웹뷰에서 처음 실행할 웹사이트를 String 값으로 제공한다.
javascriptMode	웹뷰에서 자바스크립트 실행을 허용할 지 여부를 결정한다. javascriptMode.unrestricted : 제한없이 실행 javascriptMode.disabled : 자바스크립트 실행불가
onWebViewCreated	웹뷰 위젯이 실행되면 실행할 콜백함수이다. 매개변수로 WebViewController가 주어져 '뒤로가기, 앞으로가기, 새로운 URL 실행하기' 등 기능을 제어할 수 있음
onPageStarted	웹뷰가 처음 생성되거나, 페이지를 이동했을 때, 웹페이지가 로딩되기 시작하면서 실행할 콜백함수를 정의할 수 있다. 함수에는 매개변수로 로딩이 시작된 페이지의 URL이 String형으로 제공된다.
onPageFinished	웹페이지 로딩이 끝나면 실행된다. 로딩이 완료된 페이지의 URL이 String형으로 제공된다.
onProgress	웹페이지가 로딩 중일 때 지속적으로 실행되며 페이지의 로딩이 끝날 대까지 실행된다. 매개변수에 int 값으로 페이지 로딩 상태를 0부터 100 사이의 숫자로 제공해 준다.

2. pubspec.yaml 설정

dependencies:
flutter:
sdk: flutter

cupertino_icons: ^1.0.2
webview_flutter: 4.2.4 (추가)

3. android\app\src\main\AndroidManifest 설정

웹뷰를 실행할 때 인터넷을 사용해야 하니 인터넷 권한을 추가한다.

<manifest xmlns:android="http://schemas.android.com/apk/res/android">
<uses-permission android:name="android.permission.INTERNET" /> (추가)
<application..

</application>
</manifest>

참고로, 플러터 안드로이드에서 자주 사용하는 권한은 다음과 같다.

자주 사용하는 안드로이드 권한
코드	세부내용 (기능)
INTERNET	인터넷 사용 권한
CAMERA	카메라 사용 권한
WRITE_EXTERNAL_STORAGE	앱 외부에 파일을 저장할 수 있는 권한
READ_EXTERNAL_STORAGE	앱 외부의 파일을 읽을 수 있는 권한
VIBRATE	진동을 일으킬 수 있는 권한
ACESS_FINE_LOCATION	GPS와 네트워크를 사용하여 정확한 위치정보를 가져올 수 있는 권한
ACESS_COARSE_LOCATION	네트워크만 사용하여 대략의 위치정보를 가져올 수 있는 권한
ACESS_BACKGROUND_LOCATION	앱이 배경이 있을 때 위치정보를 가져올 수 있는 권한
BILLING	인앱 결제를 할 수 있는 권한
CALL_PHONE	전화기를 사용하지 않고 전화를 할 수 있는 권한
NETWORK_STATE	네트워크 상태를 가져올 수 있는 권한
RECORD_AUDIO	음성을 녹음할 수 있는 권한