FLUTTER

以你之姓@ 2024-02-19 14:13 12阅读 0赞

### 安装FLUTTER ###

Flutter中的Dart地址：`.../flutter/bin/cache/dart-sdk`

#### 官方教程： ####

[https://codelabs.flutter-io.cn/codelabs/first-flutter-app-pt1-cn/index.html\#1][https_codelabs.flutter-io.cn_codelabs_first-flutter-app-pt1-cn_index.html_1]  
下载Flutter的SDK（[https://storage.googleapis.com/flutter\_infra/releases/stable/windows/flutter\_windows\_v1.0.0-stable.zip）][https_storage.googleapis.com_flutter_infra_releases_stable_windows_flutter_windows_v1.0.0-stable.zip]  
解压后配置好环境变量即可。

#### 配置IDE（ Android Studio） ####

查看Android Studio的版本：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 1]  
可以看到，这个版本是181开头的，我们去下载对应的flutter和dart插件：  
[https://plugins.jetbrains.com/plugin/9212-flutter][https_plugins.jetbrains.com_plugin_9212-flutter]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 2]  
下载181开头的即可，然后从磁盘安装插件。  
插件安装好后，会有如下展示，能创建flutter工程：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 3]

#### 检查环境 ####

控制台执行：flutter doctor

> flutter doctor
    Doctor summary (to see all details, run flutter doctor -v):
    [√] Flutter (Channel stable, v1.0.0, on Microsoft Windows [Version 10.0.17134.407], locale zh-CN)
    [!] Android toolchain - develop for Android devices (Android SDK 28.0.3)
        X Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
    [√] Android Studio (version 3.2)

可以看到有个X，表示这个是不通过的，可以运行这个命令flutter doctor --android-licenses，然后所有选择都选y通过。  
再执行 flutter doctor 就可以看到如下信息：

flutter doctor
    Doctor summary (to see all details, run flutter doctor -v):
    [√] Flutter (Channel stable, v1.0.0, on Microsoft Windows [Version 10.0.17134.407], locale zh-CN)
    [√] Android toolchain - develop for Android devices (Android SDK 28.0.3)
    [√] Android Studio (version 3.2)

### 新建Flutter项目 ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 4]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 5]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 6]  
下一步后finish即可。

### 运行项目 ###

#### 1.启动虚拟机 ####

#### 2.修改gradle配置文件 ####

修改android目录下的build.gradle文件：

buildscript {
        
       repositories {
        
           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.2.1'
       }
    }
    
    allprojects {
        
       repositories {
        
          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' }
       }
    }
    
    rootProject.buildDir = '../build'
    subprojects {
        
       project.buildDir = "${rootProject.buildDir}/${project.name}"
    }
    subprojects {
        
       project.evaluationDependsOn(':app')
    }
    
    task clean(type: Delete) {
        
       delete rootProject.buildDir
    }

也就是修改对应的repositories中的内容。  
修改flutter解压文件中的flutter\\packages\\flutter\_tools\\gradle\\flutter.gradle中repositories中的内容：

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.2.1'
        }
    }

运行项目即可，即可启动。

[https_codelabs.flutter-io.cn_codelabs_first-flutter-app-pt1-cn_index.html_1]: https://codelabs.flutter-io.cn/codelabs/first-flutter-app-pt1-cn/index.html#1
[https_storage.googleapis.com_flutter_infra_releases_stable_windows_flutter_windows_v1.0.0-stable.zip]: https://storage.googleapis.com/flutter_infra/releases/stable/windows/flutter_windows_v1.0.0-stable.zip%EF%BC%89
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/c8945693319c40a1b0345098e6c8e9af.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/df4187470a5f40b7b5782baf5b03c6b1.png
[https_plugins.jetbrains.com_plugin_9212-flutter]: https://plugins.jetbrains.com/plugin/9212-flutter
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 2]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/a7a80ad3e9f047fd9d12493c557d9c5f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 3]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/92d3f5d6dc734501b7c596fb15eb4b5d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 4]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/9df871dcc1c74f0e977530f190872bcc.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 5]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/17ee0350fd7145f88adedf9608c1faeb.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxMTIyNTE2OTAy_size_16_color_FFFFFF_t_70 6]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/b95d11b406424f67a90a085d453bf8dc.png