import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
    @override
  Widget build(BuildContext context) {
    return AppBarWidget();
  }
}

class AppBarWidget extends StatefulWidget {
    @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return AppBarState();
  }
}

class AppBarState extends State<AppBarWidget> {
    Choice _selectedChoice = choices[0];

    void _select(Choice choice) {
        setState(() {
          _selectedChoice = choice;
        });
    }

    @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
        home: Scaffold(
            appBar: AppBar(
                title: Text("Basic AppBar"),
                actions: <Widget>[
                    IconButton(
                        icon: Icon(choices[0].icon),
                        onPressed: () {
                            _select(choices[0]);
                        },
                    ),
                    IconButton(
                        icon: Icon(choices[1].icon),
                        onPressed: (){
                            _select(choices[1]);
                        },
                    ),
                    PopupMenuButton<Choice>(
                        onSelected: _select,
                        itemBuilder: (context) {
                            return choices.skip(2).map((Choice choice) {
                                return PopupMenuItem<Choice>(
                                    value: choice,
                                    child: Text(choice.title),
                                );
                            }).toList();
                        },
                    ),
                ],
            ),
            body: ChoiceCardWidget(choice: _selectedChoice,),
        ),
    );
  }
}

class Choice {
    final String title;
    final IconData icon;
    const Choice({this.title,this.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 ChoiceCardWidget extends StatelessWidget {
    final Choice choice;
    ChoiceCardWidget({Key key,this.choice}) : super(key : key);

    @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Padding(
        padding: EdgeInsets.all(20.0),
        child: Card(
            color: Colors.white,
            child: Center(
                child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                        Icon(choice.icon,size: 200.0,color: Colors.blue,),
                        Padding(padding: EdgeInsets.only(bottom: 50.0),),
                        Text(choice.title,style: TextStyle(fontSize: 50.0),)
                    ],
                ),
            ),
        ),
    );
  }
}