Flutter learning (a)

Directory
Flutter learning (a)
Flutter Learning (II) -FlutterGo learning

concept

In Flutter, almost all are widget, comprising alignment (Alignment), padding (padding) and layout (layout). The main work of a widget is to provide a build () method to describe how to display themselves in accordance with other lower-level widgets.
In response Flutter-style framework, calls setState () will trigger the build () method for the State objects, resulting in an update to the UI

pubspec.yaml Profile Description

Similar android development in AndroidManifest.xml, Gradle profile, pubspec.yaml file in the root directory is Flutter Flutter project configuration file.
Although there are mobile profile in development, but the difference is still getting bigger.
In Flutter, there Gradle files although Android Flutter project file in the folder, but only use these files when you add relevant required platform dependencies. Otherwise, you should use pubspec.yaml statement for Flutter external dependencies.
Complete profile

    #name很重要，如果修改了name所有的dart的文件的import前引用的本地的文件啊的包名都需要修改
    name: flutterdemo
    description: A new Flutter application.
     
    dependencies:
      flutter:
        sdk: flutter
     
     #添加依赖packages ^表示适配和当前大版本一致的版本，~表示适配和当前小版本一致的版本
      cupertino_icons: ^0.1.2
      english_words: ^3.1.0
     # image_picker: ^0.4.8
     
    dev_dependencies:
      flutter_test:
        sdk: flutter
     
      #启用国际化
      flutter_localizations:
        sdk: flutter
     
    #定义常量
     
    #数组
    server:
        - aaaaaa
        - bbbbbb
    	- dddddd
    #常量
    age: 22         # int
    boolitem: true  #定义一个boolean值
    name: 'hello'   #定义一个string
     
     
    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:
      #添加资源，不单单是图片，images是个和pubspec.yaml配置文件同级的目录，如果不同级，需要添加..
      assets:
            - images/park.jpg
            - images/lake.jpg
            - images/touxiang.jpg
      #  - images/a_dot_burr.jpeg
      #  - images/a_dot_ham.jpeg
       #字体设置
       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

name: this should be called the package name.
If the modified configuration file name (flutterdemo -flutterdemo111), following the local file package former references need to be modified: import 'package: flutterdemo / FourPage.dart ';

The introduction of graphic assets:
Assets: // pictures introducing resources required to identify the application asset, can any folder, Flutter the asset is placed into a special archive called asset bundle, it is possible that pictures, text, and other resources.

- images/park.jpg
- images/lake.jpg

Pictures of different sizes resources wording:

…/my_icon.png
…/2.0x/my_icon.png
…/3.0x/my_icon.png

Text reads:

import 'package:flutter/services.dart' show rootBundle;
Future<String> loadAsset() async {
//读取文件是的路径，就是assets下配置的 
return await rootBundle.loadString('assets/config.json');
}

Use Picture:

//图片路径的配置
new AssetImage('graphics/background.png'),

: Load dependencies in the picture
when // Configure name of the role, you need to read the resources under other external package

new AssetImage('icons/heart.png', package: 'my_icons')

Here the way to update the application's own icon, only need to be updated in accordance with the android, Ios own specifications:
Fonts: Support font settings, you can use a custom font.
Setting way:

- family: Schyler
fonts:
- asset: fonts/Schyler-Regular.ttf
- asset: fonts/Schyler-Italic.ttf
style: italic

Use:

style: new TextStyle( fontFamily: 'Schyler', fontSize: 24.0, ),

Enabling internationalization, materialDesign:

 flutter_localizations:
sdk: flutter

flutter:
uses-material-design: true

Reference: Flutter development documents
Flutter pubspec.yaml Profile Description