kf drawer
flutter side menu (drawer).
getting started
use kfdrawer
widget as scaffold
‘s body with items property (list<kfdraweritem>
)
you should define onpressed on kfdraweritem
kfdrawer
properties
- controller (optional)
- header
- footer
- items (optional if controller defined)
- decoration
or set drawer items with controller (kfdrawercontroller
)
define page property on kfdraweritem
kfdrawercontroller
properties
- initialpage
- items
drawer page widget should extend kfdrawercontent
widget
you can use classbuilder
for string based class init
example
class mainwidget extends statefulwidget {
@override
_mainwidgetstate createstate() => _mainwidgetstate();
}
class _mainwidgetstate extends state<mainwidget> {
kfdrawercontroller _drawercontroller;
@override
void initstate() {
super.initstate();
_drawercontroller = kfdrawercontroller(
initialpage: classbuilder.fromstring('mainpage'),
items: [
kfdraweritem.initwithpage(
text: text('main', style: textstyle(color: colors.white)),
icon: icon(icons.home, color: colors.white),
page: mainpage(),
),
kfdraweritem.initwithpage(
text: text(
'calendar',
style: textstyle(color: colors.white),
),
icon: icon(icons.calendar_today, color: colors.white),
page: calendarpage(),
),
kfdraweritem.initwithpage(
text: text(
'settings',
style: textstyle(color: colors.white),
),
icon: icon(icons.settings, color: colors.white),
page: classbuilder.fromstring('settingspage'),
),
],
);
}
@override
widget build(buildcontext context) {
return scaffold(
body: kfdrawer(
controller: _drawercontroller,
header: align(
alignment: alignment.centerleft,
child: container(
padding: edgeinsets.symmetric(horizontal: 16.0),
width: mediaquery.of(context).size.width * 0.6,
child: image.asset(
'assets/logo.png',
alignment: alignment.centerleft,
),
),
),
footer: kfdraweritem(
text: text(
'sign in',
style: textstyle(color: colors.white),
),
icon: icon(
icons.input,
color: colors.white,
),
onpressed: () {
navigator.of(context).push(cupertinopageroute(
fullscreendialog: true,
builder: (buildcontext context) {
return authpage();
},
));
},
),
decoration: boxdecoration(
gradient: lineargradient(
begin: alignment.topleft,
end: alignment.bottomright,
colors: [color.fromrgbo(255, 255, 255, 1.0), color.fromrgbo(44, 72, 171, 1.0)],
tilemode: tilemode.repeated,
),
),
),
);
}
}
Comments are closed.