Flutter InAppWebview load css from assets

Plugin: InAppWebview

  • Register css relation path to pubspect.yaml file.
  • Example: assets/css
  • File: custom.css
body {
    color: red;
}
InAppWebView(
    initialUrlRequest:
        URLRequest(url: Uri.parse('https://${your_url}')),
    initialOptions: InAppWebViewGroupOptions(
        crossPlatform: InAppWebViewOptions(),
        android: AndroidInAppWebViewOptions(
        useHybridComposition: true,
        ),
        ios: IOSInAppWebViewOptions(
        allowsInlineMediaPlayback: true,
        ),
    ),
    onWebViewCreated: (InAppWebViewController controller) {

    },
    onLoadStart: (controller, url) {
        controller
                ..injectCSSFileFromAsset(
                    assetFilePath: 'assets/css/custom.css');
    },
    onLoadStop: (controller, url) async {
        controller
                ..injectCSSFileFromAsset(
                    assetFilePath: 'assets/css/custom.css');
    },
    onProgressChanged:
        (InAppWebViewController controller, int progress) {
    },
),

Comments !

Links

Social