iT邦幫忙

2021 iThome 鐵人賽

DAY 11
0
Mobile Development

30天 - Flutter 日常系列 第 11

[Day11] Flutter - StatelessWidget & StatfulWidget 差別

  • 分享至 

  • xImage
  •  

前言

Hi, 我是魚板伯爵今天要講 StatelessWidget & StatfulWidget差別,讓大家可以對這兩種部件有一點概念。

完整程式碼

StatelessWidget

StatelessWidget 的意思是沒有狀態的 widget,也就是說不能改變內容。

class DemoStateless extends StatelessWidget {
  const DemoStateless({ Key? key }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      
    );
  }
}

StatfulWidget

StatefulWidgetcreateState將可變的狀態存放在裡面,以app點擊畫面當作範例,可以搭配setState來標記要更新的UI,當下次build的時候就會重新刷新。


class DemoStatful extends StatefulWidget {
  const DemoStatful({Key? key}) : super(key: key);

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

class _DemoStatfulState extends State<DemoStatful> {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

創建一個專案時的範例就使用StatfulWidget來更新數字的。


上一篇
[Day10] Flutter - 文字輸入元件 ( TextField )
下一篇
[Day12] Flutter - 場景路徑與轉換 ( Auto Router )
系列文
30天 - Flutter 日常30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言