diff --git a/src/chapter2/first_flutter_app.md b/src/chapter2/first_flutter_app.md index 2e3ff4b1..24eb690d 100644 --- a/src/chapter2/first_flutter_app.md +++ b/src/chapter2/first_flutter_app.md @@ -24,27 +24,28 @@ ```dart import 'package:flutter/material.dart'; -void main() => runApp(new MyApp()); +void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { + const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { - return new MaterialApp( + return MaterialApp( title: 'Flutter Demo', - theme: new ThemeData( + theme: ThemeData( primarySwatch: Colors.blue, ), - home: new MyHomePage(title: 'Flutter Demo Home Page'), + home: const MyHomePage(title: 'Flutter Demo Home Page'), ); } } class MyHomePage extends StatefulWidget { - MyHomePage({Key key, this.title}) : super(key: key); + const MyHomePage({Key? key, required this.title}) : super(key: key); final String title; @override - _MyHomePageState createState() => new _MyHomePageState(); + State createState() => _MyHomePageState(); } class _MyHomePageState extends State { @@ -58,28 +59,28 @@ class _MyHomePageState extends State { @override Widget build(BuildContext context) { - return new Scaffold( - appBar: new AppBar( - title: new Text(widget.title), + return Scaffold( + appBar: AppBar( + title: Text(widget.title), ), - body: new Center( - child: new Column( + body: Center( + child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ - new Text( + const Text( 'You have pushed the button this many times:', ), - new Text( + Text( '$_counter', style: Theme.of(context).textTheme.headline4, ), ], ), ), - floatingActionButton: new FloatingActionButton( + floatingActionButton: FloatingActionButton( onPressed: _incrementCounter, tooltip: 'Increment', - child: new Icon(Icons.add), + child: const Icon(Icons.add), ), // This trailing comma makes auto-formatting nicer for build methods. ); } @@ -100,7 +101,7 @@ class _MyHomePageState extends State { 2. 应用入口。 ```dart - void main() => runApp(MyApp()); + void main() => runApp(const MyApp()); ``` - 与C/C++、Java类似,Flutter 应用中`main`函数为应用程序的入口。`main`函数中调用了`runApp` 方法,它的功能是启动Flutter应用。`runApp`它接受一个`Widget`参数,在本示例中它是一个`MyApp`对象,`MyApp()`是Flutter应用的根组件。 @@ -110,17 +111,18 @@ class _MyHomePageState extends State { ```dart class MyApp extends StatelessWidget { + const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { - return new MaterialApp( + return MaterialApp( //应用名称 title: 'Flutter Demo', - theme: new ThemeData( + theme: ThemeData( //蓝色主题 primarySwatch: Colors.blue, ), //应用首页路由 - home: new MyHomePage(title: 'Flutter Demo Home Page'), + home: const MyHomePage(title: 'Flutter Demo Home Page'), ); } } @@ -140,10 +142,10 @@ class _MyHomePageState extends State { ```dart class MyHomePage extends StatefulWidget { - MyHomePage({Key key, this.title}) : super(key: key); + MyHomePage({Key? key, required this.title}) : super(key: key); final String title; @override - _MyHomePageState createState() => new _MyHomePageState(); + State createState() => _MyHomePageState(); } class _MyHomePageState extends State { @@ -191,28 +193,28 @@ class _MyHomePageState extends State { ```dart Widget build(BuildContext context) { - return new Scaffold( - appBar: new AppBar( - title: new Text(widget.title), + return Scaffold( + appBar: AppBar( + title: Text(widget.title), ), - body: new Center( - child: new Column( + body: Center( + child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ - new Text( + const Text( 'You have pushed the button this many times:', ), - new Text( + Text( '$_counter', style: Theme.of(context).textTheme.headline4, ), ], ), ), - floatingActionButton: new FloatingActionButton( + floatingActionButton: FloatingActionButton( onPressed: _incrementCounter, tooltip: 'Increment', - child: new Icon(Icons.add), + child: const Icon(Icons.add), ), ); } diff --git a/src/chapter2/flutter_router.md b/src/chapter2/flutter_router.md index 0391da55..77652026 100644 --- a/src/chapter2/flutter_router.md +++ b/src/chapter2/flutter_router.md @@ -61,7 +61,7 @@ `MaterialPageRoute`继承自`PageRoute`类,`PageRoute`类是一个抽象类,表示占有整个屏幕空间的一个模态路由页面,它还定义了路由构建及切换时过渡动画的相关接口及属性。`MaterialPageRoute` 是Material组件库提供的组件,它可以针对不同平台,实现与平台页面切换动画风格一致的路由切换动画: - 对于Android,当打开新页面时,新的页面会从屏幕底部滑动到屏幕顶部;当关闭页面时,当前页面会从屏幕顶部滑动到屏幕底部后消失,同时上一个页面会显示到屏幕上。 -- 对于iOS,当打开页面时,新的页面会从屏幕右侧边缘一致滑动到屏幕左边,直到新页面全部显示到屏幕上,而上一个页面则会从当前屏幕滑动到屏幕左侧而消失;当关闭页面时,正好相反,当前页面会从屏幕右侧滑出,同时上一个页面会从屏幕左侧滑入。 +- 对于iOS,当打开新页面时,新的页面会从屏幕右侧一直滑动,直到新页面全部显示到屏幕上,而上一个页面则会从当前屏幕滑动到屏幕左侧而消失;当关闭页面时,正好相反,当前页面会从屏幕右侧滑出,同时上一个页面会从屏幕左侧滑入。 下面我们介绍一下`MaterialPageRoute` 构造函数的各个参数的意义: @@ -117,7 +117,7 @@ Navigator类中第一个参数为context的**静态方法**都对应一个Naviga class TipRoute extends StatelessWidget { TipRoute({ Key key, - @required this.text, // 接收一个text参数 + required this.text, // 接收一个text参数 }) : super(key: key); final String text; @@ -353,4 +353,5 @@ MaterialApp( 综上所述,笔者比较建议使用命名路由,当然这并不是什么金科玉律,读者可以根据自己偏好或实际情况来决定。 -另外,还有一些关于路由管理的内容我们没有介绍,比如路由MaterialApp中还有`navigatorObservers`和`onUnknownRoute`两个回调属性,前者可以监听所有路由跳转动作,后者在打开一个不存在的命名路由时会被调用,由于这些功能并不常用,而且也比较简单,我们便不再花费篇幅来介绍了,读者可以自行查看API文档。 \ No newline at end of file +另外,还有一些关于路由管理的内容我们没有介绍,比如路由MaterialApp中还有`navigatorObservers`和`onUnknownRoute`两个回调属性,前者可以监听所有路由跳转动作,后者在打开一个不存在的命名路由时会被调用,由于这些功能并不常用,而且也比较简单,我们便不再花费篇幅来介绍了,读者可以自行查看API文档。 +