Flutter 入门篇章

本篇博客介绍内容如下，跟着我一起学习Flutter吧,转载请标明出处

• Flutter 简介
• Flutter SDK下载和环境搭建
• Flutter插件 基于Studio下载
• Flutter 基于Studio创建Demo工程

Flutter 简介

简单来说Flutter是谷歌新推出的一套跨平台、开源的UI框架可以同时支持ios和Android系统开发

一 、Flutter优势

• 跨平台行
• 高帧率的流畅UI
• 支持开发过程中的热重载
• 高性能

二 、 Flutter 开发语言

• 基于Dart语言开发

Flutter SDK下载和环境搭建

一 、Flutter SDK下载

https://flutter.io/docs/get-started/install/macos

基于此网站下载最新Flutter SDK，下载完成解压SDK zip包

二 、 Flutter 环境搭建

一般在Mac上配置环境变量时经常要创建、编辑 .bash_profile文件。
创建该文件时一般都会选择在当前用户目录下，即Mac下的.bash_profile 文件的路径是 /Users/xxx/.bash_profile (如果该文件已经创建过的话)

• 创建 .bash_profile

 （1） 启动终端 应该默认就在 /Users/xxx目录  

 （2） 或者进入当前用户的home目录： 
        cd ~   或 cd /Users/xxx 

 （3）输入touch .bash_profile 
 

• 查看和编辑 .bash_profile 文件

 （1）终端输入 open .bash_profile 
 
 （2）编辑
  export PATH=${PATH}:{这里填写Flutter SDK的根路径}/flutter/bin

 （3）关闭即可保存修改
 

• 更新配置环境

 输入source .bash_profile

Flutter插件 基于Studio下载

1. 首先有一个Android好的Studio
2. 在Android Studio的 Preferences-Plugins 选项里搜索Flutter并安装
3. 如图

Flutter 基于Studio创建Demo工程

1. 点击File New 选项里面会有一个New Flutter project 选项如图

2.创建成功点击右上角的倒三角运行，
3. 刚运行可能会出现如图下问题

* What went wrong:
A problem occurred configuring root project 'android'.
> Could not resolve all artifacts for configuration ':classpath'.
   > Could not download kotlin-compiler-embeddable.jar (org.jetbrains.kotlin:kotlin-compiler-embeddable:1.2.71)
      > Could not get resource 'https://jcenter.bintray.com/org/jetbrains/kotlin/kotlin-compiler-embeddable/1.2.71/kotlin-compiler-embeddable-1.2.71.jar'.
         > Read timed out
   > Could not download fastutil.jar (it.unimi.dsi:fastutil:7.2.0)
      > Could not get resource 'https://jcenter.bintray.com/it/unimi/dsi/fastutil/7.2.0/fastutil-7.2.0.jar'.
         > Read timed out
 
* 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
 
BUILD FAILED in 5m 32s
Finished with error: Please review ur Gradle project setup in the android/ folder.

4.这个问题产生的原因就新建立的项目无法下载所需的资源这个问题在哪里

• 修改前,我展示问题点的代码其他忽略

buildscript {
    
    repositories {
        google()
        jcenter()
    }
allprojects {
    repositories {
        google()
        jcenter()
    }
}

• 修改后

buildscript {
    repositories {
//        google()
//        jcenter()
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven { url 'https://maven.aliyun.com/repository/jcenter' }
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
    }
allprojects {
    repositories {
//        google()
//        jcenter()
        maven { url 'https://maven.aliyun.com/repository/google' }
        maven { url 'https://maven.aliyun.com/repository/jcenter' }
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
    }
}

5.重新运行即可运行后展示如图

本章到此结束了还有问题的朋友可以给我留言或评论下次文章讲解Dart语言，转载请标出处，谢谢！