webview_flutter 4.0버전 사용하기

webview_flutter가 4.0으로 업데이트되면서 많은 부분이 바뀌었다. 하지만 핵심은 선택사항이던 WebViewController를 무조건 사용해야 하는 것이다.

WebView -> WebViewWidget, WebViewController

원래는 WebView 클래스를 사용해 그 안에 컨트롤러를 두거나 자바스크립트를 허용하는 등의 조작을 했었는데, 4.0으로 바뀌면서 WebView 클래스는 사라지고 WebViewController와 WebViewWidget 클래스를 사용해야 한다.

기존 코드 (4.0 이하)

WebView(
	initialUrl: 'https://www.google.com',
    javascriptMode: JavascriptMode.unrestricted,
    onWebViewCreated: (controller) {
    	_webViewController = controller;
    }
);

4.0이상 코드

@override
initState() {
    super.initState();
    controller = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted)
      ..loadRequest(Uri.parse('https://flutter.dev'));
}

@override
Widget build(BuildContext context) {
    return Scaffold(
      body: WebViewWidget(
          controller: controller,
      ),
),

WebViewWidget은 build안에, WebViewController는 build 밖의 initState안에 정의한다.

WebViewWidget에는 controller, gestureDetection, layoutDirection을 정의하고 WebViewController에는 setJavaScriptMode, setBackgroundColor, setNavigationDelegate, loadRequest를 정의한다.

정리하자면, 기존에는 WebView 클래스에 controller 없이 대부분의 webView 작업을 정의할 수 있었지만, 이제는 WebViewWidget과 WebViewController를 사용해야 하고 필요한 작업을 두 클래스를 적절히 사용해야 한다. 사용방법이 달라진 것이지 기능이 사라진 것이 아니기 때문에 어렵지 않게 코드 업데이트를 할 수 있을 것이다.