Transform中的Flutter Webview在Android和iOS上的呈现方式有所不同

问题描述

我正在尝试在WebView内部的Container内部使用Transform。我已经尝试使用flutter_webviewflutter_inappwebview来做到这一点。

但是,当涉及到Webview时,转换在Android和iOS上的呈现方式有所不同(而不是Container中包含其他任何内容)。

我想知道是什么原因导致的,以及是否有已知的解决方法。它会影响某些库中的动画,例如previous library-specific question I asked中的动画(似乎受此问题影响)。

一个例子:

import 'package:Flutter/material.dart';
import 'package:Flutter_inappwebview/Flutter_inappwebview.dart';

String html =
    '<!DOCTYPE html><html><body bgcolor="red"><h1>My First heading</h1><p>My first paragraph.</p></body></html>';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',theme: ThemeData(
        primarySwatch: Colors.blue,visualDensity: VisualDensity.adaptivePlatformDensity,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key,this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  InAppWebViewController webView;

  @override
  dispose() {
    webView.stopLoading();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),body: Transform(
          transform: pvMatrix,alignment: FractionalOffset.center,child: Container(
            color: Colors.orange,child: Container(
              child: InAppWebView(
                initialUrl: "",initialHeaders: {},initialOptions: InAppWebViewGroupOptions(
                  crossplatform: InAppWebViewOptions(
                    debuggingEnabled: true,onWebViewCreated: (InAppWebViewController controller) {
                  webView = controller;
                  webView.loadData(data: html);
                },margin: EdgeInsets.all(50),height: 500,));
  }

  final Matrix4 pvMatrix = Matrix4.identity()..setEntry(3,3,1 / 0.9);
}

在Android上:

enter image description here

在iOS上:

enter image description here

非常感谢您的任何想法或见识!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)