Flutter初学之路<2>

作者: 白晓明 | 来源:发表于2019-04-25 07:48 被阅读0次

    FlutterDart 语言的移动应用框架,runApp 函数就是Flutter框架的入口。

    void main() => runApp(Widget app);
    

    使用runApp函数可以将给定的根组件填满整个屏幕。我们可以通过设定 Widget 来构建我们的UI,我们可以使用布局组件来设定组件的位置,比如希望组件与屏幕的一侧对齐,我们可以使用Align widget

    //修改main.dart 文件代码
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Hello World!',
          theme: ThemeData(
            primaryColor: Colors.red,
          ),
          home: Scaffold(
            appBar: AppBar(
              title: Text('Welcome to Fultter'),
            ),
            body: Center(
              child: Container(
                height: 100.0,
                width: 100.0,
                color: Colors.black,
                child: Align(
                  alignment: FractionalOffset(0.2, 0.2),
                  child: Container(
                    height: 40.0,
                    width: 40.0,
                    color: Colors.amber,
                  ),
                ),
              ),
            ),
          ),
        );
      }
    }
    //我们会看到一个黑色居中的小块中有一个黄色的小块居上居左0.2
    

    相关文章

      网友评论

        本文标题:Flutter初学之路<2>

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