Open ericltw opened 5 years ago
Introduction
在Flutter中,widget視覺元件(visual component),當需要在Flutter中建構與佈局直接或間接相關的內容時,就是透過widget。
每個widget都有一個對應的context,而一個context也僅屬於一個widget。context代表著widget在widget tree中所在的位置。Context object實際上就是Element object,Context存在的目的其中一部份我認為是優化Flutter的渲染效能。
Stateless Widget
這些元件除了本身的配置信息,不依賴任何其他的信息,而配置信息來自父元件建構時所提供。這些元件只能在建構時會繪製一次,這些元件無法自己重新建構。
Stateful Widget
這些元件除了本身的配置信息,還能依據本身的內部數據在元件的生命週期內重新建構。從本質上來看,Stateful Widget其實就是一個Stateless Widget加上一個State object。
initState()
此方法是在創建State object後要調用的第一個方法(在構造函數後),此方法被覆寫通常的狀況為需要做一些animation / controller的初始化。在這個方法,無法直接使用Context,因為Flutter尚未將State object與Context完全關聯。此State object將在他的生命週期內不會再調用這個方法。
didChangeDependencies()
此方法是在創建State object後要調用的第二個方法,在這個階段,可以直接使用Context。這個方法通常覆寫基於Context連接到Inherited Widget / Listner的初始化。當父元件發生改變需要重新建構此元件,則會調用此方法。
build()
此方法在didChangeDependencies()之後調用,每當State object更改時,或Inherited Widget通知已註冊元件,都會調用此方法。
dispose()
當元件將被丟棄時,會調用此方法。
此元件允許有效地在Widget tree中傳播訊息。將Inherited Widget放至於父級,子級的任何元件將能夠與Inherited Widget公開的數據進行交互。
Registration of a Widget for later notifications
當子元件調用MyInheritedWidget.of(context)時,同時傳遞了自己的上下文給父元件,除了返回State object,父元件還會將子元件訂閱到更改通知。
static MyInheritedWidgetState of(BuildContext context) { return (context.inheritFromWidgetOfExactType(_MyInherited) as _MyInherited).data; }
A widget in Flutter represents an immutable description of part of the user interface.
Widget
Introduction
在Flutter中,widget視覺元件(visual component),當需要在Flutter中建構與佈局直接或間接相關的內容時,就是透過widget。
BuildContext
Introduction
每個widget都有一個對應的context,而一個context也僅屬於一個widget。context代表著widget在widget tree中所在的位置。Context object實際上就是Element object,Context存在的目的其中一部份我認為是優化Flutter的渲染效能。
Type of Widgets
Stateless Widget
這些元件除了本身的配置信息,不依賴任何其他的信息,而配置信息來自父元件建構時所提供。這些元件只能在建構時會繪製一次,這些元件無法自己重新建構。
Stateful Widget
這些元件除了本身的配置信息,還能依據本身的內部數據在元件的生命週期內重新建構。從本質上來看,Stateful Widget其實就是一個Stateless Widget加上一個State object。
Relation between a State and a Context
Stateful Widget lifecycle
initState()
此方法是在創建State object後要調用的第一個方法(在構造函數後),此方法被覆寫通常的狀況為需要做一些animation / controller的初始化。在這個方法,無法直接使用Context,因為Flutter尚未將State object與Context完全關聯。此State object將在他的生命週期內不會再調用這個方法。
didChangeDependencies()
此方法是在創建State object後要調用的第二個方法,在這個階段,可以直接使用Context。這個方法通常覆寫基於Context連接到Inherited Widget / Listner的初始化。當父元件發生改變需要重新建構此元件,則會調用此方法。
build()
此方法在didChangeDependencies()之後調用,每當State object更改時,或Inherited Widget通知已註冊元件,都會調用此方法。
dispose()
當元件將被丟棄時,會調用此方法。
Inherited Widget
Introduction
此元件允許有效地在Widget tree中傳播訊息。將Inherited Widget放至於父級,子級的任何元件將能夠與Inherited Widget公開的數據進行交互。
Registration of a Widget for later notifications
當子元件調用MyInheritedWidget.of(context)時,同時傳遞了自己的上下文給父元件,除了返回State object,父元件還會將子元件訂閱到更改通知。