gpt4 book ai didi

flutter - 如何设置 Flutter showMenu 起点

转载 作者:行者123 更新时间:2023-12-04 12:16:38 42 4
gpt4 key购买 nike

我想知道如何改变popUpMenu的原点,在底部应用栏正上方启动弹出窗口,无论项目数如何。与屏幕右端对齐。类似的东西(例如)

Positioned(right: 0, bottom: bottomAppBarHeight)

这是 popUpMenu的设计布局截图我想实现:

Design

这是 popUpMenu 当前位置的屏幕截图(请忽略其他设计差异,因为它们无关紧要):

Actual

使用的代码如下:

                      onPressed: () {
final RelativeRect position =
buttonMenuPosition(context);
showMenu(context: context, position: position, items: [
PopupMenuItem<int>(
value: 0,
child: Text('Working a lot harder'),
),
PopupMenuItem<int>(
value: 1,
child: Text('Working a lot less'),
),
PopupMenuItem<int>(
value: 1,
child: Text('Working a lot smarter'),
),
]);
},
buttonMenuPosition功能代码:

RelativeRect buttonMenuPosition(BuildContext context) {
final bool isEnglish =
LocalizedApp.of(context).delegate.currentLocale.languageCode == 'en';
final RenderBox bar = context.findRenderObject() as RenderBox;
final RenderBox overlay =
Overlay.of(context).context.findRenderObject() as RenderBox;
const Offset offset = Offset.zero;
final RelativeRect position = RelativeRect.fromRect(
Rect.fromPoints(
bar.localToGlobal(
isEnglish
? bar.size.centerRight(offset)
: bar.size.centerLeft(offset),
ancestor: overlay),
bar.localToGlobal(
isEnglish
? bar.size.centerRight(offset)
: bar.size.centerLeft(offset),
ancestor: overlay),
),
offset & overlay.size,
);
return position;
}

更改偏移量不起作用。

最佳答案

好吧,我无法通过 showMenu 实现它功能,但可以通过使用 PopUpMenuButton 来实现并将其偏移量设置为底部应用栏的高度。

这是一个示例代码:

PopupMenuButton<int>(
offset: const Offset(0, -380),
itemBuilder: (context) => [
PopupMenuItem<int>(
value: 0,
child: PopUpMenuTile(
isActive: true,
icon: Icons.fiber_manual_record,
title:'Stop recording',
)),
PopupMenuItem<int>(
value: 1,
child: PopUpMenuTile(
isActive: true,
icon: Icons.pause,
title: 'Pause recording',
)),
PopupMenuItem<int>(
value: 2,
child: PopUpMenuTile(
icon: Icons.group,
title: 'Members',
)),
PopupMenuItem<int>(
value: 3,
child: PopUpMenuTile(
icon: Icons.person_add,
title: 'Invite members',
)),
],
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Icon(Icons.more_vert,
color: Colors.white60),
Text(translate('more'),
style: Theme.of(context)
.textTheme
.caption)
],
),
)

自定义弹出菜单磁贴的代码如下,即使它与问题无关:

class PopUpMenuTile extends StatelessWidget {
const PopUpMenuTile(
{Key key,
@required this.icon,
@required this.title,
this.isActive = false})
: super(key: key);
final IconData icon;
final String title;
final bool isActive;

@override
Widget build(BuildContext context) {
return Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Icon(icon,
color: isActive
? Theme.of(context).accentColor
: Theme.of(context).primaryColor),
const SizedBox(
width: 8,
),
Text(
title,
style: Theme.of(context).textTheme.headline4.copyWith(
color: isActive
? Theme.of(context).accentColor
: Theme.of(context).primaryColor),
),
],
);
}
}

关于flutter - 如何设置 Flutter showMenu 起点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61756271/

42 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com