123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335 |
- /*
- //导入cupertino widget 库
- import 'package:flutter/cupertino.dart';
- void main() {
- runApp(const CupertinoTestRoute());
- }
- class CupertinoTestRoute extends StatelessWidget {
- const CupertinoTestRoute({Key? key}) : super(key: key);
- @override
- Widget build(BuildContext context) {
- return CupertinoPageScaffold(
- navigationBar: const CupertinoNavigationBar(
- middle: Text("Cupertino Demo"),
- ),
- child: Center(
- child: CupertinoButton(
- color: CupertinoColors.activeBlue,
- child: const Text("Press"),
- onPressed: () {}
- ),
- ),
- );
- }
- }
- */
- import 'package:english_words/english_words.dart';
- import 'package:flutter/material.dart';
- void main() {
- runApp(const MyApp());
- }
- class MyApp extends StatelessWidget {
- const MyApp({super.key});
- // This widget is the root of your application.
- @override
- Widget build(BuildContext context) {
- return MaterialApp(
- title: 'Flutter Demo',
- theme: ThemeData(
- // This is the theme of your application.
- //
- // TRY THIS: Try running your application with "flutter run". You'll see
- // the application has a blue toolbar. Then, without quitting the app,
- // try changing the seedColor in the colorScheme below to Colors.green
- // and then invoke "hot reload" (save your changes or press the "hot
- // reload" button in a Flutter-supported IDE, or press "r" if you used
- // the command line to start the app).
- //
- // Notice that the counter didn't reset back to zero; the application
- // state is not lost during the reload. To reset the state, use hot
- // restart instead.
- //
- // This works for code too, not just values: Most code changes can be
- // tested with just a hot reload.
- colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
- useMaterial3: true,
- ),
- home: const MyHomePage(title: 'Flutter Demo Home Page'),
- // home: const CounterWidget(),
- // home: const GetStateObjectRoute(),
- );
- }
- }
- class MyHomePage extends StatefulWidget {
- const MyHomePage({super.key, required this.title});
- // This widget is the home page of your application. It is stateful, meaning
- // that it has a State object (defined below) that contains fields that affect
- // how it looks.
- // This class is the configuration for the state. It holds the values (in this
- // case the title) provided by the parent (in this case the App widget) and
- // used by the build method of the State. Fields in a Widget subclass are
- // always marked "final".
- final String title;
- @override
- State<MyHomePage> createState() => _MyHomePageState();
- }
- class _MyHomePageState extends State<MyHomePage> {
- int _counter = 0;
- void _incrementCounter() {
- setState(() {
- // This call to setState tells the Flutter framework that something has
- // changed in this State, which causes it to rerun the build method below
- // so that the display can reflect the updated values. If we changed
- // _counter without calling setState(), then the build method would not be
- // called again, and so nothing would appear to happen.
- _counter++;
- });
- //导航到新路由
- Navigator.push(
- context,
- MaterialPageRoute(builder: (context) {
- return NewRoute();
- }),
- );
- }
- @override
- Widget build(BuildContext context) {
- // This method is rerun every time setState is called, for instance as done
- // by the _incrementCounter method above.
- //
- // The Flutter framework has been optimized to make rerunning build methods
- // fast, so that you can just rebuild anything that needs updating rather
- // than having to individually change instances of widgets.
- return Scaffold(
- appBar: AppBar(
- // TRY THIS: Try changing the color here to a specific color (to
- // Colors.amber, perhaps?) and trigger a hot reload to see the AppBar
- // change color while the other colors stay the same.
- backgroundColor: Theme.of(context).colorScheme.inversePrimary,
- // Here we take the value from the MyHomePage object that was created by
- // the App.build method, and use it to set our appbar title.
- title: Text(widget.title),
- ),
- body: Center(
- // Center is a layout widget. It takes a single child and positions it
- // in the middle of the parent.
- // child: Column(
- // // Column is also a layout widget. It takes a list of children and
- // // arranges them vertically. By default, it sizes itself to fit its
- // // children horizontally, and tries to be as tall as its parent.
- // //
- // // Column has various properties to control how it sizes itself and
- // // how it positions its children. Here we use mainAxisAlignment to
- // // center the children vertically; the main axis here is the vertical
- // // axis because Columns are vertical (the cross axis would be
- // // horizontal).
- // //
- // // TRY THIS: Invoke "debug painting" (choose the "Toggle Debug Paint"
- // // action in the IDE, or press "p" in the console), to see the
- // // wireframe for each widget.
- // mainAxisAlignment: MainAxisAlignment.center,
- // children: <Widget>[
- // const Text(
- // 'You have pushed the button this many times:',
- // ),
- // Text(
- // '$_counter',
- // style: Theme.of(context).textTheme.headlineMedium,
- // ),
- // ],
- // ),
- child: Column(
- mainAxisAlignment: MainAxisAlignment.center,
- children: <Widget>[
- RandomWordsWidget(),
- ],
- ),
- ),
- floatingActionButton: FloatingActionButton(
- onPressed: _incrementCounter,
- tooltip: 'Increment',
- child: const Icon(Icons.add),
- ), // This trailing comma makes auto-formatting nicer for build methods.
- );
- }
- }
- // 测试无状态工具描述ui
- class Echo extends StatelessWidget {
- const Echo({
- Key? key,
- required this.text,
- this.backgroundColor = Colors.grey, //默认为灰色
- }) : super(key: key);
- final String text;
- final Color backgroundColor;
- @override
- Widget build(BuildContext context) {
- return Center(
- child: Container(
- color: backgroundColor,
- child: Text(text),
- ),
- );
- }
- }
- // 测试State状态生命周期
- class CounterWidget extends StatefulWidget {
- const CounterWidget({Key? key, this.initValue = 0});
- final int initValue;
- @override
- _CounterWidgetState createState() => _CounterWidgetState();
- }
- class _CounterWidgetState extends State<CounterWidget> {
- int _counter = 0;
- @override
- void initState() {
- super.initState();
- //初始化状态
- _counter = widget.initValue;
- print("initState");
- }
- @override
- Widget build(BuildContext context) {
- print("build");
- return Scaffold(
- body: Center(
- child: TextButton(
- child: Text('$_counter'),
- //点击后计数器自增
- onPressed: () => setState(
- () => ++_counter,
- ),
- ),
- ),
- );
- }
- @override
- void didUpdateWidget(CounterWidget oldWidget) {
- super.didUpdateWidget(oldWidget);
- print("didUpdateWidget ");
- }
- @override
- void deactivate() {
- super.deactivate();
- print("deactivate");
- }
- @override
- void dispose() {
- super.dispose();
- print("dispose");
- }
- @override
- void reassemble() {
- super.reassemble();
- print("reassemble");
- }
- @override
- void didChangeDependencies() {
- super.didChangeDependencies();
- print("didChangeDependencies");
- }
- }
- //在 widget 树中获取State对象
- class GetStateObjectRoute extends StatefulWidget {
- const GetStateObjectRoute({Key? key}) : super(key: key);
- @override
- State<GetStateObjectRoute> createState() => _GetStateObjectRouteState();
- }
- class _GetStateObjectRouteState extends State<GetStateObjectRoute> {
- @override
- Widget build(BuildContext context) {
- return Scaffold(
- appBar: AppBar(
- title: Text("子树中获取State对象"),
- ),
- body: Center(
- child: Column(
- children: [
- Builder(builder: (context) {
- return ElevatedButton(
- onPressed: () {
- // // 查找父级最近的Scaffold对应的ScaffoldState对象
- // ScaffoldState _state = context.findAncestorStateOfType<ScaffoldState>()!;
- // // 打开抽屉菜单
- // _state.openDrawer();
- // // 直接通过of静态方法来获取ScaffoldState
- // ScaffoldState _state=Scaffold.of(context);
- // // 打开抽屉菜单
- // _state.openDrawer();
- ScaffoldMessenger.of(context).showSnackBar(
- SnackBar(content: Text("我是SnackBar")),
- );
- },
- child: Text('打开抽屉菜单1'),
- );
- }),
- ],
- ),
- ),
- drawer: Drawer(),
- );
- }
- }
- // 路由管理,就是页面跳转
- class NewRoute extends StatelessWidget {
- @override
- Widget build(BuildContext context) {
- return Scaffold(
- appBar: AppBar(
- title: Text("New route"),
- ),
- body: Center(
- child: Text("This is new route"),
- ),
- );
- }
- }
- class RandomWordsWidget extends StatelessWidget {
- @override
- Widget build(BuildContext context) {
- // 生成随机字符串
- final wordPair = WordPair.random();
- return Padding(
- padding: const EdgeInsets.all(8.0),
- child: Text(wordPair.toString()),
- );
- }
- }
|