Flutter开发常见问题，解决小技巧

置顶怀君

已于 2023-07-05 19:59:05 修改

阅读量3.1k

点赞数 1

分类专栏： flutter 文章标签： flutter android studio 打包

于 2021-05-14 10:11:55 首次发布

本文链接：https://blog.csdn.net/u013290250/article/details/116780918

版权

flutter 专栏收录该内容

27 篇文章 21 订阅

订阅专栏

1.Android Studio 4.0 以上打包编译报错；

Execution failed for task ':app:lintVitalRelease'.
> Could not resolve all artifacts for configuration ':app:debugRuntimeClasspath'.
   > Failed to transform libs.jar to match attributes {artifactType=processed-jar, org.gradle.libraryelements=jar, org.gradle.usage=java-runtime}.
      > Execution failed for JetifyTransform: E:\FlutterSpace\xxxx\build\app\intermediates\flutter\debug\libs.jar.
         > Transform's input file does not exist: E:\FlutterSpace\xxxx\build\app\intermediates\flutter\debug\libs.jar. (See https://issuetracker.google.com/
issues/158753935)

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

1.在子build.gradle添加以下代码：

android{
	lintOptions { checkReleaseBuilds false }
}

解决方案：原文地址：https://my.oschina.net/u/4364921/blog/4725237

2.Exception: Gradle build failed to produce an .apk file. It’s likely that this file was generated under /build, but the tool couldn’t find it.

打包时找不到渠道包名导致；

1.通过VSCode找到项目当中有一 launch.json 文件

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
            {
                    "name": "YOUR_PROJECT_NAME",//你项目的名称
                    "program": "lib/main.dart",
                    "request": "launch",
                    "type": "dart",
                    "args": [
                            "--flavor",
                            "ADD_YOUR_FLAVOR_NAME_HERE" //配置你的渠道包名
                        ]
            }
    ]

2.通过Andorid Studio 找到子build.gradle文件添加渠道配置;

android {
    compileOptions {
        targetCompatibility JavaVersion.VERSION_1_8
        sourceCompatibility JavaVersion.VERSION_1_8
    }

    android.applicationVariants.all {
        variant ->
            variant.outputs.all {
                //在这里修改apk文件名
                outputFileName = "-v${variant.versionName}-${variant.productFlavors[0].name}-release.apk"
            }
    }

    productFlavors {
        pgyer {}   // 蒲公英
        huawei {}       // 华为商店
        baidu {}        // 百度手机助手
        yinyongbao {}   // 应用宝
        xiaomi {}   // 小米
        oppo {}   // OPPO
        vivo {}   // VIVO
        s360 {}   // 360
        lenovo {}   // 联想
        aliuc {}   // 阿里UC
    }

    // 批量渠道包值替换（有些第三方库中需要用到渠道名）
    productFlavors.all { flavor ->
        // 友盟推送渠道包， UMENG_CHANNEL_VALUE 是根据你AndroidManifest.xml来配置的，请看下面。
        flavor.manifestPlaceholders = [UMENG_CHANNEL_VALUE: name]
    }
    //解决打包异常的问题
    lintOptions { checkReleaseBuilds false }
}

解决方案：https://stackoverflow.com/questions/59732883/flutter-gradle-build-failed-to-produce-an-apk-file-its-likely-that-this-file

3._positions.isNotEmpty, ‘ScrollController not attached to any scroll views.’

具体报错问题；

The following assertion was thrown building Swiper(state: _SwiperState#e86c5):
ScrollController not attached to any scroll views.
'package:flutter/src/widgets/scroll_controller.dart':
Failed assertion: line 108 pos 12: '_positions.isNotEmpty'

解决方案：https://blog.csdn.net/youtiankeng/article/details/107419322

4.Android studio Flutter 开发快捷键

https://flutter.cn/docs/development/tools/android-studio

5.Flutter WebView js交互

html 测试代码块

<html>
<head>
    <title>Js调用Flutter</title>
    <script>
     function Close() {
        AppWndClose.postMessage("JS调用了Flutter");
    }
    </script>
</head>

<body>
<br>
<input type="button" value="关闭" onclick="Close()"/>
</body>
</html>

flutter 测试代码块

WebView(
     javascriptChannels: <JavascriptChannel>[ 
        JavascriptChannel(
      name: 'AppWndClose',
      onMessageReceived: (JavascriptMessage message) {
        showToast(message.message);
      })
   ].toSet(),
)

我们要注意的是代码里面使用的都是AppWndClose ；这个是我们要注意到的；
参考地址：https://zhuanlan.zhihu.com/p/124797055

6.Flutter WebView跳转dart界面

通过js的方法进行调用；

class CustomWebViewPage extends StatefulWidget {
  final String url;

  CustomWebViewPage({
    Key key,
    @required this.url,
  });

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

class _PageState extends State<CustomWebViewPage> with WidgetsBindingObserver {
  _PageState();

  FlutterWebviewPlugin _webViewPlugin = FlutterWebviewPlugin();

  double lineProgress = 0.0;

  bool loadError = false;

  HomeModel homeModel;

  initState() {
    super.initState();
    _webViewPlugin.onProgressChanged.listen((progress) {
      print(progress);
      setState(() {
        lineProgress = progress;
      });
    });
    _webViewPlugin.onHttpError.listen((progress) {
      setState(() {
        loadError = true;
      });
    });
    _webViewPlugin.onStateChanged.listen((event) {
      if (event.type == WebViewState.finishLoad) {}
      setState(() {});
    });
    WidgetsBinding.instance.addObserver(this);
    EventBus.getDefault().register(this, (data) {
      if (data is PublishPostsEvent || data == 'tabRankList') {
        _webViewPlugin.evalJavascript("RefreshMissionList()").then((res) {
          print("evaluateJavascript-res: ${res}");
        });
      }
    });
    _wlakPermission(false);
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    print("-didChangeAppLifecycleState-" + state.toString());
    switch (state) {
      case AppLifecycleState.inactive: // 处于这种状态的应用程序应该假设它们可能在任何时候暂停。
        break;
      case AppLifecycleState.resumed: //从后台切换前台，界面可见
        _webViewPlugin.evalJavascript("AppOnShow()").then((res) {
          print("evaluateJavascript-res: ${res}");
        });
        break;
      case AppLifecycleState.paused: // 界面不可见，后台
        _webViewPlugin.evalJavascript("AppOnHide()").then((res) {
          print("evaluateJavascript-res: ${res}");
        });
        ;
        break;
      case AppLifecycleState.detached: // APP结束时调用
        break;
    }
  }

  @override
  Widget build(BuildContext context) {
    homeModel = Provider.of<HomeModel>(context);
    return WebviewScaffold(
        url: widget.url,
        mediaPlaybackRequiresUserGesture: false,
        withZoom: false,
        withJavascript: true,
        clearCookies: true,
        hidden: true,
        javascriptChannels: <JavascriptChannel>[
          JavascriptChannel(
              name: "AppWndClose",
              onMessageReceived: (JavascriptMessage message) {
                NavigatorUtils.goBack(context);
              }),
          _postThread(),
          _partInTopic(),
        ].toSet(),
        initialChild: Container(
          child: Stack(
            children: [
              Center(
                  child: StateLayout(
                type: loadError ? StateType.network : StateType.loading,
              )),
              _setTitle(context),
            ],
          ),
        ));
  }

  _postThread() {
    return JavascriptChannel(
        name: "eventPostThread",
        onMessageReceived: (JavascriptMessage message) {
          _webViewPlugin.hide();
          print("参数： ${message.message}");
          NavigatorUtils.push(context, ProfileRouter.publishPosts)
              .then((value) {
            _webViewPlugin.show();
            _webViewPlugin.evalJavascript("RefreshMissionList()").then((res) {
              print("evaluateJavascript-res: ${res}");
            });
          });
        });
  }


  _partInTopic() {
    return JavascriptChannel(
        name: "eventTaskPartinTopic",
        onMessageReceived: (JavascriptMessage message) {
    // 因为flutter_webview_plugin 是浮在flutterUI上的一层视图，它不在widget树中，跳转到dart页面时，需要隐藏掉web页面
          _webViewPlugin.hide();
          NavigatorUtils.push(context, TopicRouter.topic).then((value) {
          //再跳回来时再显示web页面
            _webViewPlugin.show();
            _webViewPlugin.evalJavascript("RefreshMissionList()").then((res) {
            //同时调用web端接口进行刷新操作；
            });
          });
        });
  }


  _setTitle(context) {
    return Positioned(
      left: 15,
      top: MediaQuery.of(context).padding.top + 5,
      child: BackButton(
        onPressed: () {
          NavigatorUtils.goBack(context);
        },
      ),
    );
  }

  _progressBar(double progress, BuildContext context) {
    return Offstage(
        offstage: progress == 1.0,
        child: Container(
          child: LinearProgressIndicator(
            backgroundColor: Colors.blueAccent.withOpacity(0),
            value: progress == 1.0 ? 0 : progress,
            valueColor: new AlwaysStoppedAnimation<Color>(Colors.lightBlue),
          ),
          height: 2,
        ));
  }

  @override
  void dispose() {
    _webViewPlugin.dispose();
    WidgetsBinding.instance.removeObserver(this);
    EventBus.getDefault().unregister(this);
    super.dispose();
  }
}

通过加载URL的形式进行监听响应跳转；


///省略上面代码；

  @override
  void initState() {
    super.initState();

    flutterWebviewPlugin.onUrlChanged.listen((loadUrl){
      //WebviewScaffold 加载的url变化时触发此方法
      // print('===>>当前 url:$loadUrl');

      // h5 点退出按钮，关闭webView
      if (loadUrl.endsWith('/backapp')){
        flutterWebviewPlugin.close();
        pop();
      }
      // 跳转到dart页面
      else if (loadUrl.endsWith('/policy')){
        // 因为flutter_webview_plugin 是浮在flutterUI上的一层视图，它不在widget树中，跳转到dart页面时，需要隐藏掉web页面，再跳回来时再显示web页面
        flutterWebviewPlugin.hide(); 
        routePush(ClassRoomPage()).then((value) {
          flutterWebviewPlugin.show();
          flutterWebviewPlugin.reloadUrl(widget.url);
        });

//跳转到dart页面时，也可以关闭掉web页面，再跳回来时再创建一个web页面
        // flutterWebviewPlugin.close();
        // routePush(ClassRoomPage()).then((value){
        //   flutterWebviewPlugin.launch(widget.url,
        //     rect: new Rect.fromLTWH( // 设置web页面的尺寸
        //       0.0,
        //       _navBarHeight,
        //       MediaQuery.of(_context).size.width,
        //       MediaQuery.of(_context).size.height-_navBarHeight,
        //     ),
        //   );
        // });
      }
    });

    //加载错误时监听
    // flutterWebviewPlugin.onHttpError.listen((error){
    //   print('加载错误:${error.code}  ${error.url}');
    // });

    //加载状态变化监听
    // flutterWebviewPlugin.onStateChanged.listen((state){
    //   print('状态监听:${state.type.toString()}');
    // });
  }

参考文章：flutter_webview_plugin 与dart页面跳转使用

7. cmdline-tools component is missing Run `path/to/sdkmanager --install "cmdline-tools;latest"`

参考文章：https://blog.csdn.net/weixin_41824429/article/details/118942087

8.android studio安装和flutter project创建卡住问题解决

参考文章：https://blog.csdn.net/lucynie/article/details/106928231

9. Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses

参考文章：https://www.jianshu.com/p/4feeec038482

10.Flutter Getx 结合 TabView

参考文章：https://stackoverflow.com/questions/63924491/how-to-build-a-tabview-using-flutter-getx

11. Flutter 项目window应用鼠标无法滚动


const Set<PointerDeviceKind> _kTouchLikeDeviceTypes = <PointerDeviceKind>{
  PointerDeviceKind.touch,
  PointerDeviceKind.mouse,
  PointerDeviceKind.stylus,
  PointerDeviceKind.invertedStylus,
  PointerDeviceKind.unknown
};

MaterialApp(
    ...
    scrollBehavior: const MaterialScrollBehavior().copyWith(
      scrollbars: true,
      dragDevices: _kTouchLikeDeviceTypes
    ),
    ...
);

//如果你使用的是Getx框架同上，有相同的属性；scrollBehavior

参考文章：https://www.cnblogs.com/yangyxd/p/15080537.html

12. Flutter 项目window应用运行异常

问题：

CMake Error at CMakeLists.txt:2 (project):
  Generator

    Visual Studio 16 2019

  could not find any instance of Visual Studio.

具体解决方法：

https://stackoverflow.com/questions/69944913/cmake-error-while-running-flutter-desktop-application/69951396#69951396 。 Flutter 2.9 版支持 VS 2022，而您使用的 2.8.1 版仅支持 VS 2019。只需安装 2019 并试一试。
如果你想在 2.8.1 版本中使用 VS 2022，这里是解决方法。 stackoverflow.com/a/69951396/6566310 我想这个解决方法是值得的。
感谢您提供这两种解决方案。但我确实选择了第一个，现在它正在工作。

解决方案：https://www.likecs.com/ask-5954170.html