1_flutter_snackBar,Drawer(抽屉),AppBar(应用栏)

拼搏现实的明天。 2022-01-19 02:19 300阅读 0赞

# 1\_snackBar #

--------------------

import 'package:flutter/material.dart';
    
    void main() => runApp(SnackBarDemo());
    
    class SnackBarDemo extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text('SnackBar Demo'),
            ),
            body: SnackBarPage(),
          ),
        );
      }
    }
    
    class SnackBarPage extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Center(
          child: RaisedButton(
            onPressed: () {
              final snackBar = SnackBar(content: Text('成功'),);
              Scaffold.of(context).showSnackBar(snackBar);
            },
            child: Text('按钮点击'),
          ),
        );
      }
    }
    复制代码

# 2\_Drawer(抽屉) #

--------------------

import 'package:flutter/material.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      final appTitle = 'Drawer Demo';
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: appTitle,
          home: MyHomePage(title: appTitle),
        );
      }
    }
    
    class MyHomePage extends StatelessWidget {
      final String title;
    
      MyHomePage({Key key, this.title}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(title: Text(title)),
          body: Center(child: Text('My Page!')),
          drawer: Drawer(
            child: ListView(
              padding: EdgeInsets.zero,
              children: <Widget>[
                DrawerHeader(
                  child: Text('Drawer Header'),
                  decoration: BoxDecoration(
                    color: Colors.blue,
                  ),
                ),
                ListTile(
                  title: Text('Item 1'),
                  onTap: () {
                    Navigator.pop(context);
                  },
                ),
                ListTile(
                  title: Text('Item 2'),
                  onTap: () {
                    Navigator.pop(context);
                  },
                ),
              ],
            ),
          ),
        );
      }
    }
    复制代码

# 3\_AppBar(应用栏) #

--------------------

import 'package:flutter/material.dart';
    
    // This app is a stateful, it tracks the user's current choice.
    class BasicAppBarSample extends StatefulWidget {
      @override
      _BasicAppBarSampleState createState() =>_BasicAppBarSampleState();
    }
    
    class _BasicAppBarSampleState extends State<BasicAppBarSample> {
      Choice _selectedChoice = choices[0]; // The app's "state".
    
      void _select(Choice choice) {
        setState(() { // Causes the app to rebuild with the new _selectedChoice.
          _selectedChoice = choice;
        });
      }
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            appBar:AppBar(
              title: const Text('Basic AppBar'),
              actions: <Widget>[
                IconButton( // action button
                  icon:Icon(choices[0].icon),
                  onPressed: () { _select(choices[0]); },
                ),
                IconButton( // action button
                  icon:Icon(choices[1].icon),
                  onPressed: () { _select(choices[1]); },
                ),
                PopupMenuButton<Choice>( // overflow menu
                  onSelected: _select,
                  itemBuilder: (BuildContext context) {
                    return choices.skip(2).map((Choice choice) {
                      return PopupMenuItem<Choice>(
                        value: choice,
                        child: Text(choice.title),
                      );
                    }).toList();
                  },
                ),
              ],
            ),
            body: Padding(
              padding: const EdgeInsets.all(16.0),
              child:  ChoiceCard(choice: _selectedChoice),
            ),
          ),
        );
      }
    }
    
    class Choice {
      const Choice({ this.title, this.icon });
      final String title;
      final IconData icon;
    }
    
    const List<Choice> choices = const <Choice>[
      const Choice(title: 'Car', icon: Icons.directions_car),
      const Choice(title: 'Bicycle', icon: Icons.directions_bike),
      const Choice(title: 'Boat', icon: Icons.directions_boat),
      const Choice(title: 'Bus', icon: Icons.directions_bus),
      const Choice(title: 'Train', icon: Icons.directions_railway),
      const Choice(title: 'Walk', icon: Icons.directions_walk),
    ];
    
    class ChoiceCard extends StatelessWidget {
      const ChoiceCard({ Key key, this.choice }) : super(key: key);
    
      final Choice choice;
    
      @override
      Widget build(BuildContext context) {
        final TextStyle textStyle = Theme.of(context).textTheme.display1;
        return Card(
          color: Colors.white,
          child:  Center(
            child:  Column(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Icon(choice.icon, size: 128.0, color: textStyle.color),
                Text(choice.title, style: textStyle),
              ],
            ),
          ),
        );
      }
    }
    
    void main() {
      runApp(BasicAppBarSample());
    }
    复制代码

转载于:https://juejin.im/post/5c68d88f5188256283254895