用Flutter 写一个简单页面

// 创建一个继承自Stateless的Widget

class QiStatelessApp extends StatelessWidget {

  // 重写build 方法，build 方法返回值为Widget类型，返回内容为屏幕上显示内容。

  @override

  Widget build(BuildContext context) {

    // MaterialApp 控制界面风格为安卓风格

    // CupertinoApp 界面风格为iOS 风格

    return MaterialApp(

      title: '安卓切换任务管理时任务名',

      // debugShowCheckedModeBanner: false,

      // Scaffold：脚手架 用于展示基础框架结构，如appBar、body、bottomNavigationBar

      home: Scaffold(

        // AppBar：相当于iOS 的导航栏

        appBar: AppBar(

          // AppBar上的显示内容

          // Text 用于展示文本内容，相当于iOS中的UILabel

          title: Text('App Bar 展示内容'),

        ),

        // body：AppBar及BottomNavigationBar之间展示的内容

        // Center 是用于把子Widget 居中的Widget

        body: Center(

          child: Text('Hello World'),

        ),

        // 相当于iOS 中的UITabBar

        bottomNavigationBar: BottomNavigationBar(

          type: BottomNavigationBarType.fixed,

          items: [

            BottomNavigationBarItem(icon: Icon(Icons.work), title: Text('工作')),

            BottomNavigationBarItem(

                icon: Icon(Icons.security), title: Text('安全')),

          ],

          onTap: (tappedIndex) {

            print('tappedIndex：$tappedIndex');

          },

        ),

      ),

    );

  }

}