fix(client): 账号菜单改 showMenu 等宽触发器 + 向上弹(修菜单溢出盖内容)
上一版用 PopupMenuButton width:218 + offset:-12 反而把菜单外扩、右缘越过侧栏 盖住内容区。改为 GestureDetector + showMenu,菜单宽度 = 用户区实测宽度(自动与 侧栏内容等宽、绝不溢出),底部空间不足 showMenu 自动向上弹、不遮触发器。 加 user_menu_width_test:点开后断言菜单宽≈194、右缘≤218(弹出态回归)。 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01TSKEiHsvauyxYUW2itzUXX
This commit is contained in:
@@ -84,6 +84,34 @@ class _AppShellState extends ConsumerState<AppShell> {
|
||||
bool _forceDialogShown = false;
|
||||
bool _licenseDialogShown = false;
|
||||
final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
|
||||
// 侧栏底部用户区,用于实测宽度让弹出菜单等宽 + 定位(向上弹,不溢出内容区)
|
||||
final GlobalKey _sideUserKey = GlobalKey();
|
||||
|
||||
/// 打开账号菜单(个人设置 / 退出登录)。菜单宽度 = 用户区实测宽度(自动与侧栏
|
||||
/// 内容等宽、绝不溢出到内容区);底部空间不足时 showMenu 自动向上弹。
|
||||
void _openUserMenu(BuildContext context) {
|
||||
final t = context.tokens;
|
||||
final rb = _sideUserKey.currentContext?.findRenderObject() as RenderBox?;
|
||||
final overlay =
|
||||
Overlay.of(context).context.findRenderObject() as RenderBox?;
|
||||
if (rb == null || overlay == null) return;
|
||||
final topLeft = rb.localToGlobal(Offset.zero, ancestor: overlay);
|
||||
final rect = topLeft & rb.size;
|
||||
showMenu<String>(
|
||||
context: context,
|
||||
position: RelativeRect.fromRect(rect, Offset.zero & overlay.size),
|
||||
constraints: BoxConstraints.tightFor(width: rb.size.width),
|
||||
color: t.menuUserBg,
|
||||
elevation: 8,
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)),
|
||||
items: [
|
||||
_userMenuItem('profile', Icons.manage_accounts_outlined, '个人设置', t),
|
||||
_userMenuItem('logout', Icons.logout, '退出登录', t),
|
||||
],
|
||||
).then((v) {
|
||||
if (v == 'logout') _logout();
|
||||
});
|
||||
}
|
||||
|
||||
/// 切换到第 index 个分支;再次点当前栏目则回到该分支初始页。
|
||||
void _goBranch(int index) {
|
||||
@@ -286,24 +314,11 @@ class _AppShellState extends ConsumerState<AppShell> {
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(bottom: 8),
|
||||
child: PopupMenuButton<String>(
|
||||
tooltip: '账号菜单',
|
||||
position: PopupMenuPosition.over,
|
||||
// 菜单与侧栏等宽(218),左对齐到侧栏左缘(抵消侧栏 12 内边距)
|
||||
offset: const Offset(-12, -8),
|
||||
constraints: const BoxConstraints.tightFor(width: 218),
|
||||
shape:
|
||||
RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)),
|
||||
color: t.menuUserBg,
|
||||
elevation: 8,
|
||||
onSelected: (v) {
|
||||
if (v == 'logout') _logout();
|
||||
},
|
||||
itemBuilder: (_) => [
|
||||
_userMenuItem('profile', Icons.manage_accounts_outlined, '个人设置', t),
|
||||
_userMenuItem('logout', Icons.logout, '退出登录', t),
|
||||
],
|
||||
child: GestureDetector(
|
||||
behavior: HitTestBehavior.opaque,
|
||||
onTap: () => _openUserMenu(context),
|
||||
child: Container(
|
||||
key: _sideUserKey,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 9),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
|
||||
Reference in New Issue
Block a user