# FlutterNote

**Repository Path**: yanpingdong/flutter-note

## Basic Information

- **Project Name**: FlutterNote
- **Description**: flutter笔记
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-08-22
- **Last Updated**: 2021-09-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

Flutter 是谷歌开发的一款开源、免费的、基于 Dart 语言的 UI 框架，它最大特点是跨平台和高性能。全平台的框架支持Web、Android、iOS、(McaOS、Windows、Linux、Fuchsia、嵌入式）（）中的目前是beta版本，并不稳定。

- DartPad: 在线调试dart，也支持flutter2.0。[https://dartpad.cn/?null_safety=true](https://dartpad.cn/?null_safety=true)
- DevTools： 有很多好用的工具。

[https://pub.flutter-io.cn/](https://pub.flutter-io.cn/)是Dart的第三方包管理网站，通过pub来安装。
# 开发环境搭建

一个简单的开发环境

1. flutter包
2. Chrome
3. VScode

如果不需要调试模拟器，以上就够了。

调试Android模拟器
4. Android Studio，主要是用来安装android的SDK

https://developer.android.google.cn/studio/



Flutter中的widget和React的component可以做类比。


如果不需要调试模拟器，以上就够了。

调试Android模拟器
1. Android Studio，主要是用来安装android的SDK,安装连接[android_studio](https://developer.android.google.cn/studio/)


Flutter中的widget和React的component可以做类比。

```sh
$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.2.3, on Linux, locale en_US.UTF-8)
[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2020.3)
[✓] IntelliJ IDEA Community Edition (version 2021.2)
[✓] VS Code (version 1.59.1)
[✓] Connected device (1 available)

• No issues found!
```

# flutter组件

flutter所有的组件都是个类，并且构建过程就是组件之间的嵌套。如果有动态变换的最好是将其封装在一个小范围的组件中，将组件刷新范围缩小，提高效率。

# flutte列表分类

通过ListView来定义列表项，支持垂直和水平方向展示。

1. 垂直列表
2. 垂直图文列表
3. 水平列表
4. 动态列表
5. 矩阵列表
   
# [dart的一些特别语法](dart/README.md)

flutter doctor --android-licenses
Exception in thread "main" java.lang.NoClassDefFoundError: javax/xml/bind/annotation/XmlSchema
	at com.android.repository.api.SchemaModule$SchemaModuleVersion.<init>(SchemaModule.java:156)
安装
File->settings-->Appearance&behavior-->system settings-->android sdk-->SDK tools下载AndroidSDK command-line tools

# VSCode配置
安装Flutter插件

和Java比起来有些特殊的语法和语法糖。针对个人理解来说的。


# 图片加载

1.在根目录创建images目录，并放入图片

![](../flutter-note/ComponentExamplePic/local_image_dir.png)

2. 在pubspec.yaml添加如下配置,配置完成生效不能热加载，需要重新启动。

```yaml
  # To add assets to your application, add an assets section, like this:
  assets:
    - images/independentmind.jpeg
    - images/2.0x/independentmind.jpeg
    - images/3.0x/independentmind.jpeg
    - images/4.0x/independentmind.jpeg
```