我已经有了一个屏幕和一个浮动菜单。
Scaffold(
drawer: SideBar(),
body: isLoading..
..
..
CircularMenuItem(
//icon: Icons.settings,
image: Image.asset(
"assets/images/icons/settings.png",
scale: 13,
),
onTap: () {
//callback
Navigator.of(context)
.push(MaterialPageRoute(builder: (context) => SideBar()));
// toggleSidebar();
},
color: Colors.transparent,
),
..
当从这个浮动菜单中点击一个项目时,我希望一个侧边栏从左到右显示,占据60%的屏幕宽度(一个典型的侧边栏).但是当我这样做的时候,它显示的就像一个页面一样,占据了整个屏幕,没有动画
class SideBar extends StatefulWidget {
@override
State<SideBar> createState() => _SideBarState();
}
class _SideBarState extends State<SideBar> {
// const MyWidget({super.key});
@override
Widget build(BuildContext context) {
final User? user = FirebaseAuth.instance.currentUser;
final screenwidth = MediaQuery.of(context).size.width;
return Drawer(
width: screenwidth * .5,
child: ListView(
children: [
UserAccountsDrawerHeader(
accountName: Text(user?.displayName ?? ''),
accountEmail: Text(user?.email ?? ''),
currentAccountPicture: CircleAvatar(
child: ClipOval(child: Icon(Icons.person)),
),
decoration: BoxDecoration(
color: Colors.blue,
image: DecorationImage(
fit: BoxFit.fill,
image: NetworkImage(
'https://oflutter.com/wp-content/uploads/2021/02/profile-bg3.jpg')),
),
),
],
),
);
}
}
如何正常显示?
1条答案
按热度按时间fkaflof61#
正如@Jay评论的那样,stackoverflow.com/a/57748219/19107084这对我很有效。