本文主要内容：dart的基本语法、了解weight框架、weight状态、weight布局介绍
Dart
1、介绍
-
Dart 支持AOT编译和JIT编译两种方式（在 Release 下是 AOT 模式。）
JIT和AOT
- Dart可以更轻松地创建以60fps运行的流畅动画和转场。
- Dart可以在没有锁的情况下进行对象分配和垃圾回收。
- Dart使Flutter不需要单独的声明式布局语言
- Dart可以在没有锁的情况下进行对象分配和垃圾回收。就像JavaScript一样
- Dart避免了抢占式调度和共享内存（因而也不需要锁）
- 由于Flutter应用程序被编译为本地代码，因此它们不需要在领域之间建立缓慢的桥梁，启动速度也快得多。
2、语法
Dart语言的 API 大部分相同, 可以很快能上手。同时也有kotlin 和 JS 的影子
- 数字类型num ，包含int、double。
num a = 1;
int b = 1;
double c = 1.0;
// String -> int
var one = int.parse('1');
// String -> double
var onePointOne = double.parse('1.1');
// int -> String
String oneAsString = 1.toString();
// double -> String 注意括号中要有小数点位数，否则报错
String piAsString = 3.14159.toStringAsFixed(2);
- bool 布尔类型
- var 可以定义变量，如：var a = "666"
-
没有关键词 public 、private 等修饰符，_下横向直接代表 private ，但是有 @protected 注解。
-
Dart 不需要给变量设置 setter getter 方法， 这和 kotlin 等类似。Dart 中所有的基础类型、类等都继承 Object ，默认值是 NULL， 自带 getter 和 setter ，而如果是 final 或者 const 的话，那么它只有一个 getter 方法。
-
Dart 下 ?? 、??= 属于操作符，如: AA ?? "999" 表示如果 AA 为空，返回99；AA ??= "999" 表示如果 AA 为空，给 AA 设置成 99。
-
num a = 1.0; print("aaaa" + a);//不被允许
a必须.toString -
Dart 中构造函数
class ModelA {
String name;
String tag;
//默认构造方法，赋值给name和tag
ModelA(this.name, this.tag);
//返回一个空的ModelA
ModelA.empty();
//返回一个设置了name的ModelA
ModelA.forName(this.name);
}
- 数组和列表
DART 中数组等于列表，所以 var list = []; 和 List list = new List() 可以简单看做一样。
var vegetables = new List();
// 或者简单的用List来赋值
var fruits = ['apples', 'oranges'];
// 添加元素
fruits.add('kiwis');
// 添加多个元素
fruits.addAll(['grapes', 'bananas']);
// 获取第一个元素
fruits.first;
// 获取元素最后一个元素
fruits.last;
// 查找某个元素的索引号
assert(fruits.indexOf('apples') == 0);
// 删除指定位置的元素，返回删除的元素
fruits.removeAt(index);
// 删除指定元素,成功返回true，失败返回false
fruits.remove('apples');
// 删除最后一个元素，返回删除的元素
fruits.removeLast();
// 删除指定范围元素，含头不含尾，成功返回null
fruits.removeRange(start,end);
// 删除指定条件的元素，成功返回null
fruits.removeWhere((item) => item.length >6)；
// 删除所有的元素
fruits.clear();
// sort()对元素进行排序，传入一个函数作为参数，return <0表示由小到大， >0表示由大到小
fruits.sort((a, b) => a.compareTo(b));
-
条件判断和循环
if...else
for
while do-while
break continue
switch...case (支持 String 类型。) -
函数：同Java形式一样，不过dart 没有 public、private、protected 这些关键字，变量名以"_"开头意味着对它的 lib 是私有的
-
Dart 方法可以设置 参数默认值 和 指定名称 。比如： getDetail(Sting userName, reposName, {branch = "master"}){} 方法，这里 branch 不设置的话，默认是 “master” 。参数类型 可以指定或者不指定。调用效果： getRepositoryDetailDao(“aaa", "bbbb", branch: "dev");
[更多关于Dart]
认识Flutter中Widget
-
在 Flutter 中，一切的显示都是 Widget 。Widget 是一切的基础。
Widget 和 Widget 之间通过 child: 进行嵌套。其中有的 Widget 只能有一个 child，比如下方的 Container ；有的 Widget 可以多个 child ，也就是children:，比如` Column 布局。下方代码便是 Container Widget 嵌套了 Text Widget。 -
通过一个demo了解Widget框架
官网的一个例子，加了很多理解注释，看完差不多就可以对Widget框架有大致的了解
import 'package:flutter/material.dart';
class Product {
const Product({this.name});
final String name;
}
typedef void CartChangedCallback(Product product, bool inCart);
class ShoppingListItem extends StatelessWidget { //无状态widget
ShoppingListItem({Product product, this.inCart, this.onCartChanged})
: product = product,
super(key: new ObjectKey(product));
final Product product;
final bool inCart;
final CartChangedCallback onCartChanged;
Color _getColor(BuildContext context) {
return inCart ? Colors.black54 : Theme.of(context).primaryColor;
}
TextStyle _getTextStyle(BuildContext context) {
if (!inCart) return null;
return new TextStyle(
color: Colors.black54,
decoration: TextDecoration.lineThrough,
);
}
@override
Widget build(BuildContext context) {
return new ListTile(
onTap: () {
onCartChanged(product, !inCart);
},
leading: new CircleAvatar(
backgroundColor: _getColor(context),
child: new Text(product.name[0]),
),
title: new Text(product.name, style: _getTextStyle(context)),
);
}
}
class ShoppingList extends StatefulWidget { //有状态的widget必须实现State
//用大括号包裹参数可选填，但是要指明类型。
ShoppingList({Key key, this.products}) : super(key: key);//可以直接赋值给成员变量
final List<Product> products;
@override
_ShoppingListState createState() => new _ShoppingListState();
}
class _ShoppingListState extends State<ShoppingList> {
Set<Product> _shoppingCart = new Set<Product>();
void _handleCartChanged(Product product, bool inCart) {
setState(() {//修改widget状态，类似Android里View的ondraw()方法
if (inCart)
_shoppingCart.add(product);
else
_shoppingCart.remove(product);
});
}
@override
Widget build(BuildContext context) {//build里堆砌布局 可以持有变量数据widget.。相当于databind在xml中的作用
//不足就是迷之缩进，不过编译器会默认提示代码块的结束节点
return new Scaffold( //Material承载Widget，包含appbar、snackbar、drawer等material design的设定。
appBar: new AppBar(//一般用于Scaffold内 ，内有标题，二级页面返回按键等，不止这些，tabbar等也会需要它 。
title: new Text('Shopping List'),
),
body: new ListView(
padding: new EdgeInsets.symmetric(vertical: 8.0),
children: widget.products.map((Product product) {
return new ShoppingListItem(
product: product,
inCart: _shoppingCart.contains(product),
onCartChanged: _handleCartChanged,
);
}).toList(),
),
);
}
}
void main() { //顶级函数入口
runApp(new MaterialApp(//runApp函数接受给定的Widget并使其成为widget树的根、框架强制根widget覆盖整个屏幕
title: 'Shopping App',//title指定传入的参数
home: new ShoppingList(//widget可以当做参数传递
products: <Product>[
new Product(name: 'Eggs'),
new Product(name: 'Flour'),
new Product(name: 'Chocolate chips'),
],
),
));
}
- Widget 分为 有状态 和 无状态 两种，在 Flutter 中每个页面都是一帧。无状态就是保持在那一帧。而有状态的 Widget 当数据更新时，其实是绘制了新的 Widget，只是 State 实现了跨帧的数据同步保存。
我们可以通过修改数据，再用setState 设置数据，Flutter 会自动通过绑定的数据更新 Widget 。 所以你需要做的就是实现 Widget 界面，并且和数据绑定起来。 - 无状态StatelessWidget
继承 StatelessWidget，通过 build 方法返回一个布局好的控件。相当于一个常量不可以再变。 - 有状态StatefulWidget
需要创建管理的是主要是 State ， 通过 State 的 build 方法去构建控件。在 State 中，可以动态改变数据。类似 MVVM 实现，在 setState 之后，改变的数据会触发 Widget 重新构建刷新。 - 总结：在 build 中堆积你的布局，然后把数据添加到 Widget 中，最后通过 setState 改变数据，从而实现画面变化。
布局
最后看下大神给的widge分类图
网友评论