编写第一个flutter的安卓app_vscode 创建一个flutter安卓应用

1 创建flutter应用

在某个盘下边创建一个android_workspace的目录，之后创建app都在这个目录下
进入android_workspace目录，鼠标右键打开git bash，键入创建flutter app命令：

flutter create demo_app
1

2 使用vscode编写flutter应用

使用vscode打开文件夹，文件夹选择 E:\android_workspace\demo_app，如下：

2.1 vscode连接夜神模拟器

启动夜神模拟器，vscode会自动连接，如下：

如果没有自动连接，需要将安卓sdk中的adb.exe拷贝到夜神模拟器的bin目录下

2.2 运行flutter应用

在vscode中打开终端，键入flutter run ，如下：

如上，表示启动成功，查看夜神模拟器如下：

2.3 flutter应用目录讲解

默认结构如下：
我们接下来的开发代码主要写在lib目录下
我们接下来引入第三方的包、本地的图片配置等都需要修改 pubspec.yaml

项目中结构如下：

assets中存放我们的本地资源，如图片、字体等
config中存放全局变量，比如请求后台的接口地址、全局的颜色主题配置等
html中存放flutter中调用或展示的html页面
pages中存放我们编写的flutter应用页面
provider中存放我们编写的状态管理（也可以叫变量管理）
routers中存放我们的路由

pubspec.yaml如下：

name: flutter_demo
description: A new Flutter project.

# The following line prevents the package from being accidentally published to
# pub.dev using `pub publish`. This is preferred for private packages.
publish_to: "none" # Remove this line if you wish to publish to pub.dev

# The following defines the version and build number for your application.
# A version number is three numbers separated by dots, like 1.2.43
# followed by an optional build number separated by a +.
# Both the version and the builder number may be overridden in flutter
# build by specifying --build-name and --build-number, respectively.
# In Android, build-name is used as versionName while build-number used as versionCode.
# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
# In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
# Read more about iOS versioning at
# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
version: 1.0.0+1

environment:
  sdk: ">=2.7.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter

  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^0.1.3
  provider: ^4.3.2+2
  fluro: ^1.7.4
  orientation: ^1.2.0
  signature: ^3.2.0
  fluttertoast: ^7.1.1
  shared_preferences: ^0.5.12
  flutter_easyrefresh: ^2.1.5
  camera: ^0.5.8+8
  path_provider: ^1.6.18
  # 默认视频播放器
  video_player: 0.10.12+5
  # 视频播放器
  chewie: ^0.9.10
  url_launcher: ^5.7.6
  # 内嵌js，js回调
  flutter_webview_plugin: ^0.3.11
  # 极光推送
  jpush_flutter: 0.6.0
  # 指纹识别登录
  # local_auth: 0.4.0+1
  local_auth: ^0.6.3+3
  # 手势密码
  gesture_recognition: ^1.0.1
  dio: ^3.0.10

dev_dependencies:
  flutter_test:
    sdk: flutter

# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec

# The following section is specific to Flutter.
flutter:
  # The following line ensures that the Material Icons font is
  # included with your application, so that you can use the icons in
  # the material Icons class.
  uses-material-design: true
  # To add assets to your application, add an assets section, like this:
  assets:
    #   - images/a_dot_burr.jpeg
    #   - images/a_dot_ham.jpeg
    - assets/images/2.0x/switch_on.png
    - assets/images/2.0x/switch_off.png
    - assets/images/switch_on.png
    - assets/images/switch_off.png
  # An image asset can refer to one or more resolution-specific "variants", see
  # https://flutter.dev/assets-and-images/#resolution-aware.
  # For details regarding adding assets from package dependencies, see
  # https://flutter.dev/assets-and-images/#from-packages
  # To add custom fonts to your application, add a fonts section here,
  # in this "flutter" section. Each entry in this list should have a
  # "family" key with the font family name, and a "fonts" key with a
  # list giving the asset and other descriptors for the font. For
  # example:
  # fonts:
  #   - family: Schyler
  #     fonts:
  #       - asset: fonts/Schyler-Regular.ttf
  #       - asset: fonts/Schyler-Italic.ttf
  #         style: italic
  #   - family: Trajan Pro
  #     fonts:
  #       - asset: fonts/TrajanPro.ttf
  #       - asset: fonts/TrajanPro_Bold.ttf
  #         weight: 700
  #
  # For details regarding fonts from package dependencies,
  # see https://flutter.dev/custom-fonts/#from-packages

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99

至此，第一个app完成