首页手记 Flutter系列（四）——H...

Flutter系列（四）——HelloWorld

标签：

Java Android Html5

想学Flutter，就请关注这个专栏
Flutter系列（一）——详细介绍
 Flutter系列（二）——与React Native进行对比
 Flutter系列（三）——环境搭建（Windows）
Flutter系列（四）——HelloWorld
Dart语言详解（一）——详细介绍
 Dart语言详解（二）——基本语法
 Dart语法详解（三）——进阶篇

文档归档：
https://github.com/yang0range/flutterfile

这是第「39篇」分享

创建的第一个Demo

上一篇文章，详细的介绍了Flutter的环境搭建，搭建完成之后，自然迫不及待看看如何创建我们的第一个Demo。

打开Android Studio

可以看到，可以看见有四个选项。

那么这四个选项有什么区别呢？

Flutter Application
Flutter标准引用程序

Flutter Plugin
Flutter封装的Native工程的基础插件

Flutter Package
纯Dart库工程

Flutter Modue
作为已有工程的一个Module

这里，我们需要创建一个Flutter Application项目。

工程目录结构

这里，我们首先可以看到三个比较重要的目录，分别是android，ios还有lib。

android
顾名思义，就是写Android平台相关代码的地方。

ios
和上面类似，这就就是写ios平台相关代码的地方。

lib
这里才是我们真正写flutter相关代码的地方。

这里还有一个十分重要的文件，

pubspec.yaml
这个文件是我们flutter的配置文件，比如三方的依赖都在这里，最重要的是这里还要写一些资源文件，比如图片等等，后面我们会详细介绍。

从上面目录结构大致可以理解为，整理的flutter的工程结构为。

运行官方Demo

先把官方Demo运行起来。

运行不起来

我们第一次运行官方Demo的时候，可能会有运行不来，一直卡在
Running Gradle task ‘assembleDebug’…
的情况，这里是因为Gradle的Maven仓库在国外，因为众所周知的问题，无法加载。

解决办法

这里，我们就可以使用阿里云的镜像地址，来解决这个问题。
打开如下目录，修改的地方。

也可以直接复制如下代码。

buildscript {  
  ext.kotlin\_version = '1.3.50'  
  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' }  
 }  
  dependencies {  
  classpath 'com.android.tools.build:gradle:3.5.0'  
  classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin\_version"  
  }  
}  
  
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' }  
 }}

接着打开flutter.gradle文件，路径在
…\fluttersdk\flutter\packages\flutter_tools\gradle下，修改内容

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' }
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.5.0'
    }
}

再重新运行，就成功了！