in_app_webview_flutter 1.0.0

Inline WebView, headless WebView, and in-app browser for Flutter. Maintained fork of flutter_inappwebview with current Flutter/Dart, SPM-ready iOS deps, and no debug donation console banner.

In-App-Webview-Flutter

in_app_webview_flutter (In-App-Webview-Flutter) is a maintained pub.dev package for embedding an inline WebView, running a headless WebView, and opening an in-app browser — updated for current Flutter/Dart, including Swift Package Manager-ready iOS/macOS platform deps, and without the upstream debug donation console banner.

This package is based on flutter_inappwebview (Apache-2.0) by Lorenzo Pichilli. Pub.dev package names cannot contain hyphens, so the published name is in_app_webview_flutter.

flutter_inappwebview_fx is unlisted. Use this package instead.

Why this package

• Works with Flutter ≥ 3.32 / Dart ≥ 3.8 (tested on Flutter 3.47 / Dart 3.13)
• Pulls platform implementations that include Swift Package Manager support (avoids the flutter_inappwebview_ios SPM warning on modern Flutter)
• Keeps the familiar public API (InAppWebView, HeadlessInAppWebView, InAppBrowser, ChromeSafariBrowser, cookie manager, etc.)
• Adds Linux support via upstream platform packages

Requirements

• Dart SDK: ^3.8.0
• Flutter: >=3.32.0
• Android: minSdkVersion >= 19, AGP >= 7.3.0
• iOS 12.0+, Xcode >= 15.0 (SPM-capable platform package)
• macOS 10.14+, Xcode >= 15.0
• Windows: NuGet CLI on PATH
• Linux: WPE 2.0 WebKit

Installation

dependencies:
  in_app_webview_flutter: ^1.0.0

import 'package:in_app_webview_flutter/flutter_inappwebview.dart';

Migration from flutter_inappwebview or flutter_inappwebview_fx: only the package/import name changes. Widget and class names stay the same.

import 'package:in_app_webview_flutter/flutter_inappwebview.dart';
// or: import 'package:in_app_webview_flutter/in_app_webview_flutter.dart';

Versioning: this package starts at 1.0.0. It is based on upstream flutter_inappwebview 6.2.0-beta.3 — see the CHANGELOG for the upstream base of each release.

Quick example

import 'package:flutter/material.dart';
import 'package:in_app_webview_flutter/flutter_inappwebview.dart';

class SimpleWebView extends StatelessWidget {
  const SimpleWebView({super.key});

  @override
  Widget build(BuildContext context) {
    return InAppWebView(
      initialUrlRequest: URLRequest(url: WebUri('https://flutter.dev')),
    );
  }
}

App shell: making a page feel native

InAppWebViewFx is an opt-in wrapper around InAppWebView that applies a declarative WebAppShell. Plain InAppWebView is untouched, so adopting it is a drop-in change on a per-screen basis.

InAppWebViewFx(
  initialUrlRequest: URLRequest(url: WebUri('https://shop.example.com')),
  shell: WebAppShell(
    // Hide the site's own header, nav and footer — Flutter supplies the chrome.
    hide: ElementHiding.preset(HidePreset.siteChrome)
        .plusSelectors(['.newsletter-popup']),
    // Body text unselectable, no long-press callout, forms still work.
    selection: WebSelection.appLike,
    // No white flash on load; page renders in the app's light/dark variant.
    theme: WebTheme.of(context),
    // Keep sticky bars clear of the home indicator.
    safeArea: WebSafeArea.bottomOnly,
  ),
)

What the shell handles:

• Element hiding. Rules are enforced both as a native css-display-none content blocker (applied before first paint, and unaffected by a strict style-src CSP) and as an injected stylesheet that is re-asserted on DOM mutations and history.pushState route changes, so single-page apps cannot bring hidden elements back.
• Text selection. WebSelection.appLike, .noCallout and .disabled. Editable elements are always exempt, so disabling selection does not break the site's forms.
• Theme integration. A backgroundColor makes the WebView transparent and paints Flutter's colour underneath, removing the white flash during load, and color-scheme is injected so the page picks its own dark variant. forceDarkFallback: true inverts pages that have no dark theme at all, re-inverting images and video.
• Safe areas. env(safe-area-inset-*) reads as zero inside an embedded WebView, so Flutter's real insets are published as --fx-safe-top / --fx-safe-right / --fx-safe-bottom / --fx-safe-left custom properties, which first-party page CSS can also consume directly.
• Error pages. The platform error page is suppressed and replaced with a themed Flutter overlay offering a retry. Pass WebErrorHandling(builder: ...) to supply your own.

Finding selectors

Hard-coding selectors for a site you do not control is the fragile part, so the shell helps on both ends. Turn on the element picker in a debug build and tap whatever you want gone:

InAppWebViewFx(
  elementPickerEnabled: kDebugMode,
  onElementPicked: (controller, element) => debugPrint(element.selector),
  shell: shell,
)

And when a site's markup later drifts, selectors that stop matching are reported rather than failing silently:

onUnmatchedSelectors: (controller, selectors, url) =>
    debugPrint('stale hide rules on $url: $selectors'),

Reporting defaults to on in debug builds; set ElementHiding.reportUnmatchedSelectors to change that.

Reshaping a site you do not own means its markup can change under you, and hiding third-party content may carry terms-of-service implications. Both are worth checking before shipping.

For API corners the wrapper does not expose, drive the shell against a plain InAppWebView yourself with WebAppShell.applyToSettings, WebAppShell.buildUserScript and WebAppShell.inject.

Supported platforms

Android · iOS · macOS · Windows · Linux · Web (via endorsed federated implementations)

Docs & upstream

• Upstream docs: inappwebview.dev/docs
• Upstream API (same surface): pub.dev/documentation/flutter_inappwebview
• Upstream source: github.com/pichillilorenzo/flutter_inappwebview

License

Apache License 2.0 — see LICENSE. Copyright remains with the original authors; this package is an independently published fork for pub.dev naming and Flutter currency.