FLUTTER - PopUpMenuButton:-
Source Code:
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
title: 'Pop Up Menu Button',
debugShowCheckedModeBanner: false,
home: MyApp(),
));
}
//ONLY UI Design
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
//I have writen an class with list of courses
class Courses {
const Courses({this.coursesname});
final Text coursesname;
}
const List<Courses> courses = <Courses>[
const Courses(coursesname: Text('All Courses')),
const Courses(coursesname: Text('Favorite Courses')),
const Courses(coursesname: Text('Archived Courses')),
const Courses(coursesname: Text('Offline Ready Courses')),
];
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.red[800],
actions: <Widget>[
Row(
children: <Widget>[
Container(
padding: EdgeInsets.all(15),
child: Text('All Courses',
style: TextStyle(
fontSize: 20.0,
color: Colors.white
),),
),
PopupMenuButton(
icon: Icon(Icons.arrow_drop_down),
itemBuilder: (BuildContext context) {
return courses.map((Courses couses) {
return PopupMenuItem(
value: null,
child: Container(
child: ListTile(
leading: CircleAvatar(
backgroundColor: Colors.red[100],
child: Icon(Icons.brightness_1,
color: Colors.blue,),
),
title: couses.coursesname,
subtitle: Text('Enjoy'),
),
),
);
}).toList();
},
elevation: 1.0,
)
],
)
],
),
backgroundColor: Colors.red,
//body: ,
);
}
}
No comments:
Post a Comment