Flutter代码不要严格执行缩进,比如C++那种。。
入职两周,写的第一个需求就是做几个简单的页面以及一些参数的传递,难度是不难的。但代码被同学们吐槽太长 太臃肿,比如下面这个样子:
几个页面一共写了1000多行,严格按照缩进来的(之前写c++写惯了,不缩进浑身难受)
然后模仿工程里别的同学写的代码,自己写了一个简单的测试页面。套路就是在build函数里先命名一个Widget xxx,这个组件应当是最内部的组件。然后从里往外逐层套,比如下面HomePage的build函数里写的:
import "package:flutter/material.dart"; void main() => runApp(MyApp()); class MyApp extends StatelessWidget{ @override Widget build(BuildContext context) { return MaterialApp( title: "这是titile", initialRoute: 'sasa', theme: ThemeData( primarySwatch: Colors.green, ), home: MyHomePage(), color: Colors.black, ); } } TextStyle ts = TextStyle(fontSize: 30, decoration: TextDecoration.none); class MyHomePage extends StatelessWidget{ Widget build( BuildContext context) { Widget current = Text('TESTTESTTEST', style: ts,); current = Column( mainAxisAlignment: MainAxisAlignment.center, children: (){ var children = <Widget> []; for(int i = 0; i < 10; ++i) { var t = <Widget> []; t.add(Spacer(flex: 1,)); t.add(current); t.add(Spacer(flex: 1,)); children.add(Row(children: t,)); } return children;}(), ); current = Container (color: Colors.red, child: current, alignment: Alignment.center,); var button = Container(alignment: Alignment.center, color: Colors.white, child: MaterialButton(child: Text('点我点我'),textColor: Colors.black, color: Colors.blue, onPressed: (){show(context);},)); current = Column(mainAxisAlignment: MainAxisAlignment.end, children: <Widget>[Container(child: button, color: Colors.white, height: 80, width: double.infinity,), current,],); current = Material(color: Colors.green, child: current,); return current; } Future<void> show (BuildContext context) async { showDialog(context: context, builder: (context) => SecondPage(),); } } class SecondPage extends StatefulWidget{ SecondPage({Key key}): super(key:key); Future<void> show (BuildContext context) async{ showDialog(context: context, builder: (context) {return ThirdPage();}); } @override State<StatefulWidget> createState() => SecondPageState(); } class SecondPageState extends State<SecondPage>{ @override bool click = false; @override Widget build(BuildContext context) { return Center( child: Container( width: double.infinity, height: double.infinity, color: Colors.white, alignment: Alignment.center, child: GestureDetector( onTap: () { setState(() { click = !click; }); }, child: AnimatedContainer( height: click ? 200 : 100, width: click ? 200 : 100, color: Colors.blue, duration: Duration(seconds: 3), alignment: Alignment.center, child: MaterialButton( color: Colors.green, child: Text('点我跳到thirdpage',style: TextStyle(fontSize: 10),), onPressed: () {widget.show(context);}, ) ), ), ), ); } } class ThirdPage extends StatelessWidget{ Widget build (BuildContext context){ return Scaffold( appBar: AppBar(), body: Container( child: Column( children: <Widget>[ FlatButton(color: Colors.blue,child: Text('短按回到second,长按回到home'), onPressed: () => Navigator.push(context, MaterialPageRoute(builder: (context) => SecondPage(),),), onLongPress:() => Navigator.push(context, MaterialPageRoute(builder: (context) => MyHomePage(),),),), Text('好好学习天天向上', style: ts,), ], ), ), ); } }
进击的小🐴农