Skip to main content

cupertino-menu-context-menu

Use when implementing iOS-style contextual popup menus and action lists anchored to specific widgets or navigation bar buttons using cupertino_menu.

설치로 이동

소스 정보

저장소
mono0926/cupertino_menu
최근 소스 활동
2026년 9월 9일 03:11
감지된 SKILL.md 언어
영어
스타
3
포크
0

설치 방법

기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.

소스 파일 검토

설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.

SKILL.md 표시 중

SKILL.md
소스 지침 · 읽기 전용 미리보기
name
cupertino_menu-context-menu
description
Use when implementing iOS-style contextual popup menus and action lists anchored to specific widgets or navigation bar buttons using cupertino_menu.
# cupertino_menu Context Menu Guide `cupertino_menu` renders iOS-style contextual pop-up menus (introduced in iOS 14). It opens with smooth scaling transitions anchored directly to the triggering button. ## Guidelines - **Portal Host Requirement**: - `cupertino_menu` relies on `flutter_portal` for rendering overlay portals. Ensure `Portal` wraps your root app widget (e.g. above or inside `MaterialApp` / `CupertinoApp`). - **Triggering Menus**: - Replace standard popup buttons with `CupertinoPopupMenuButton(actions: [...])`. - Provide a list of `CupertinoPopupMenuButtonAction` objects containing titles, optional icons, and `onPressed` callbacks. - **Handling Action Callbacks**: - Each `CupertinoPopupMenuButtonAction.onPressed` is triggered when tapped, and the popup automatically dismisses itself. - **Device Rotation**: - The menu automatically listens to `MediaQuery.of(context).orientation` and dismisses on device rotation to avoid misaligned anchors. ## Examples ### 1. Basic Setup with Root Portal ```dart import 'package:cupertino_menu/cupertino_menu.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter_portal/flutter_portal.dart'; void main() { runApp( const Portal( child: CupertinoApp( home: HomeScreen(), ), ), ); } class HomeScreen extends StatelessWidget { const HomeScreen({super.key}); @override Widget build(BuildContext context) { return CupertinoPageScaffold( navigationBar: CupertinoNavigationBar( middle: const Text('Cupertino Menu'), trailing: CupertinoPopupMenuButton( actions: [ CupertinoPopupMenuButtonAction( title: const Text('View Profile'), onPressed: () => debugPrint('Navigate to profile'), ), CupertinoPopupMenuButtonAction( title: const Text('Settings'), onPressed: () => debugPrint('Navigate to settings'), ), CupertinoPopupMenuButtonAction( title: const Text('Logout', style: TextStyle(color: CupertinoColors.destructiveRed)), onPressed: () => debugPrint('Logout pressed'), ), ], ), ), child: const Center( child: Text('Tap the top-right button for menu'), ), ); } } ``` ## Common Pitfalls & Anti-Patterns - ❌ **Anti-pattern**: Forgetting to add `Portal` in the widget hierarchy, causing `PortalEntry` errors at runtime. - ✔️ **Correct**: Wrap `CupertinoApp` or `MaterialApp` inside `Portal`. - ❌ **Anti-pattern**: Manually calling `Navigator.pop()` inside `CupertinoPopupMenuButtonAction.onPressed`. - ✔️ **Correct**: Do not call `Navigator.pop()`; the button action handles closing the menu internally.
GitHub에서 보기