どうも、ちょげ(@chogetarou)です。
webview_flutterパッケージのWebViewのサイズを変える方法を紹介します。
方法

WebViewのサイズを変えるには、Containerを使います。
まず、WebViewをContainerでラップします。
そして、Containerの引数「height」に高さ、引数「width」に横幅を指定します。
Container(
height: 高さ,
width: 横幅,
child: WebView(・・・),
),
Containerの引数「height」と引数「width」に指定したサイズが、WebViewのサイズになります。
使用例

class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var _isLoading = false;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('WebView Sample'),
),
body: Stack(
children: [
Align(
alignment: Alignment.center,
child: Container(
height: 500,
width: 300,
child: WebView(
initialUrl: 'https://www.choge-blog.com',
onPageStarted: (url) {
setState(() {
_isLoading = true;
});
},
onPageFinished: (url) {
setState(() {
_isLoading = false;
});
},
javascriptMode: JavascriptMode.unrestricted,
),
),
),
if (_isLoading)
Align(
alignment: Alignment.center,
child: CircularProgressIndicator(),
),
],
),
);
}
}
コメント