美文网首页
Flutter 学习 (一)搭建 Flutter 开发环境

Flutter 学习 (一)搭建 Flutter 开发环境

作者: CallMe001 | 来源:发表于2019-11-03 18:08 被阅读0次

    Flutter 官方网
    Flutter 中文网

    Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。

    搭建Flutter开发环境

    在 macOS 上搭建 Flutter 开发环境

    1 获取Flutter SDK

    去 flutter 官网 https://flutter.io/sdk-archive/#macos 下载其最新可用的安装包,解压安装包

    2 配置环境变量
    • 解压包(Flutter SDK)的目录记为 “FLUTTER_PATH”
    • 打开(或创建) $HOME/.bash_profile 如下图,该文件为隐藏文件,可以使用快捷键** ⌘⇧. (Command + Shift + .)** 显示隐藏文件
      • 图片.png
    • 打开 .bash_profile 文件后, 添加如下
    FLUTTER_PATH=/Users/zhangxiaowu/soft/flutter //目录为下载的 Flutter SDK 解压包所在的目录
    export PATH=$PATH:$FLUTTER_PATH/bin
    
    • 验证是否配置成功,启动终端(Command + 空格,输入 terminal.app)输入
    echo $PATH
    

    在 Android Studio 上配置与使用

    • 配置方法同样适用 IntelliJ IDEA
    1 安装 Flutter 和 Dart 插件
    • 启动Android Studio。
    • 打开插件首选项 Preferences > Plugins
      选择 Browse repositories…,选择 flutter 插件并点击 install。
    • 重启Android Studio 即可
    2 用Android Studio创建一个Flutter项目

    使用默认即可

    • 图片.png

    运行新建项目出现的问题

    运行项目时卡在 Initializing gradle…

    可以在项目中的android/gradle/wrapper/gradle-wrapper.properties中查看gradle版本号以及地址, 手动下载然后解压到~/.gradle/wrapper/dists/中。

    运行时会卡在 Running 'gradle assembleDebug,
    • 因为Gradle 的 Maven 仓库在国外, 可以使用阿里云的镜像地址。
    • 修改项目中 android/build.gradle 文件
      • 图片.png
    • 修改 Flutter 的配置文件, 该文件在FlutterSDK 安装目录/packages/flutter_tools/gradle/flutter.gradle
      • 图片.png
    • 重启 AndroidStudio 即可

    相关文章

      网友评论

          本文标题:Flutter 学习 (一)搭建 Flutter 开发环境

          本文链接:https://www.haomeiwen.com/subject/ziihbctx.html