iT邦幫忙

2023 iThome 鐵人賽

DAY 8
0

昨天最後講到RootWidget帶入我們設計的widget當做child後被inflate into RootElement append到 Element tree的root上,並且透過element.updateChild對child widget inflat into element並mount到rootElement底下,假設我們設計的widget非常單純,只放了一個Container widget並且在child裡面又放了一個Text widget,那framework又會如何把他們轉換成element並append到tree上呢?
https://ithelp.ithome.com.tw/upload/images/20230923/201471508TJuCW6NEa.png
代碼長這樣~

https://ithelp.ithome.com.tw/upload/images/20230923/20147150FwJc7RxswR.pnghttps://ithelp.ithome.com.tw/upload/images/20230923/20147150gXQu8Ac4m4.png
Container繼承StatelessWidget又Container.createElement == StatelessWidget.createElement inflate into StatelessElement 又StatelessElement繼承ComponentElement , StatelessElement.mount == ComponentElement.mount

https://ithelp.ithome.com.tw/upload/images/20230923/20147150K89uRfbaZb.png
我們看到ComponentElement.mount中呼叫了super.mount,到這邊Container正式被mount到RootElement底下成為element tree一員,那麼問題來了...它的child也就是Text widget呢?我想大家一定都猜到一定是某個地方會呼叫到updateChild並把text widget在丟進去對吧?
我們明天就來看看巴~


上一篇
第七夜,Flutter的核心(六)
下一篇
第九夜,Flutter的核心(八)
系列文
Flutter你不知道又不可不知道的核心概念10
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言