关于Widgets必须知道的事

本篇内容简要说明:

• widget 介绍
• widget 对象

Widget 介绍

在flutter的设计哲学中,一切元素和功能都是Widget,比如手势是一个widget,一个文字是一个Widget,以及你看到的所有的可视的内容都是widget

widget 对象

来说一下 widget 对象,在statefulWidget 中 有很多的情景是需要初始数据,如下:

class ShoppingList extends StatefulWidget {
  const ShoppingList({required this.products, Key? key}) : super(key: key);
  // 这里就是我们传递的数据
  final List<Product> products;

  @override
  _ShoppingListState createState() => _ShoppingListState();
}

class _ShoppingListState extends State<ShoppingList> {
  final _shoppingCart = <Product>{};

  void _handleCartChanged(Product product, bool inCart) {
    setState(() {
      if (!inCart) {
        _shoppingCart.add(product);
      } else {
        _shoppingCart.remove(product);
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Shopping List'),
      ),
      body: ListView(
        padding: const EdgeInsets.symmetric(vertical: 8.0),
        // 这里products对象使用,需要通过 widget对象来调用.
        // 所以widget对象在flutter中等同于 其他语言中的this、self等 指向当前的widget
        children: widget.products.map((Product product) {
          return ShoppingListItem(
            product: product,
            inCart: _shoppingCart.contains(product),
            onCartChanged: _handleCartChanged,
          );
        }).toList(),
      ),
    );
  }
}

这里products对象使用,需要通过 widget对象来调用.

所以widget对象在flutter中等同于 其他语言中的this、self等 指向当前的widget