美文网首页
3、Flutter开发-创建第一个Flutter应用

3、Flutter开发-创建第一个Flutter应用

作者: 全栈程序猿 | 来源:发表于2020-10-25 09:40 被阅读0次

1、打开Android Studio,所以在窗口选择Start a new Flutter project(如果没有这个选项,需要安装Flutter,步骤看上一章节)


image.png

2、选择Flutter Application,点击Next


image.png
3、Project name输入项目名称,Flutter SDK path选择第一章节中安装的Flutter目录,Project location选择项目代码存放目录,Description填写描述信息,勾选上Create project offline,然后点击Next。
image.png

4、Package Name输入代码的包名,下面默认勾选即可,点击Finish。


image.png
5、至此,第一个Flutter创建成功,在代码编辑界面,右下角有错误提示,KOTLIN_BUNDLED is undefined. 直接点击后面的Fix it即可。
image.png
6、因为Flutter项目是通过Gradle构建的,运行时下载依赖更新速度非常慢,甚至连接不上,这里将其修改为阿里的镜像地址。编辑项目里面android/build.gradle文件,将google(),jcenter()注释掉,添加阿里云的地址,如下所示
buildscript {
ext.kotlin_version = '1.3.50'
    repositories {
//        google()
//        jcenter()
        maven { url 'http://maven.aliyun.com/nexus/content/groups/public/' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/jcenter' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/google' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/gradle-plugin' }
    }
    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 'http://maven.aliyun.com/nexus/content/groups/public/' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/jcenter' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/google' }
        maven { url 'http://maven.aliyun.com/nexus/content/repositories/gradle-plugin' }
    }
}

7、运行第一个Flutter项目,在上面的菜单列表<no devices>选择Open Android Emulator:Pixel...,会打开手机模拟器,然后点击后面的debugger按钮,会在手机模拟器中运行我们新建的Flutter应用。


image.png
image.png

8、至此,第一个Flutter项目就运行起来了,界面效果如下:


image.png

相关文章

网友评论

      本文标题:3、Flutter开发-创建第一个Flutter应用

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