美文网首页
Flutter-Widget

Flutter-Widget

作者: JerrySi | 来源:发表于2019-08-01 09:39 被阅读0次

    Widget有无状态和有状态2种Widget。

    无状态

    StatelessWidgets:其实就是静态页面

    Demo
    class SampleApp extends StatelessWidget {
      // This widget is the root of your application.
      @override
      Widget build(BuildContext context) {
        return new MaterialApp(
          title: 'Sample App',
          theme: new ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: new SampleAppPage(),
        );
      }
    }
    

    有状态

    StatefulWidget:动态页面,需要配合State使用,State负责页面构建。

    Demo
    class SampleAppPage extends StatefulWidget {
      SampleAppPage({Key key}) : super(key: key);
    
      @override
      _SampleAppPageState createState() => new _SampleAppPageState();
    }
    
    class _SampleAppPageState extends State<SampleAppPage> {
      // Default placeholder text
      String textToShow = "I Like Flutter";
    
      void _updateText() {
        setState(() {
          // update the text
          textToShow = "Flutter is Awesome!";
        });
      }
    
      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          appBar: new AppBar(
            title: new Text("Sample App"),
          ),
          body: new Center(child: new Text(textToShow)),
          floatingActionButton: new FloatingActionButton(
            onPressed: _updateText,
            tooltip: 'Update Text',
            child: new Icon(Icons.update),
          ),
        );
      }
    }
    

    相关文章

      网友评论

          本文标题:Flutter-Widget

          本文链接:https://www.haomeiwen.com/subject/vxttdctx.html