docs: 新增技能文档
- 新增Skills.md技能说明 - 新增skills/技能文档目录 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
20
skills/bottom-navigation.md
Normal file
20
skills/bottom-navigation.md
Normal file
@@ -0,0 +1,20 @@
|
||||
# Skill:底部导航栏(Tab 栏)
|
||||
|
||||
与具体业务无关的底部 Tab 栏设计:显示条件、实现方式与选中态。
|
||||
|
||||
---
|
||||
|
||||
## 显示条件
|
||||
|
||||
- 仅在部分主 Tab 页显示:如会话列表、回忆录、我的(以 `Screen.ConversationList`、`Screen.MyMemoir`、`Screen.Profile` 等当前路由判断)。
|
||||
- 子页(如设置、关于、FAQ)不显示底部栏。
|
||||
|
||||
## 实现
|
||||
|
||||
- 在 `Scaffold.bottomBar` 中按 `currentRoute` 条件渲染底部栏;使用 `Surface` + `windowInsetsPadding(WindowInsets.navigationBars)` 避免与系统导航栏重叠。
|
||||
- 底部项使用 **AppDestinations** 枚举(如 CHAT、MEMOIR、PROFILE),每项含 label、icon;点击时 `navController.navigate(对应 Screen.route)` 并配合 `popUpTo` 控制返回栈。
|
||||
|
||||
## 选中态
|
||||
|
||||
- 通过 `currentDestination` 与当前路由同步(`LaunchedEffect(currentRoute)`),保证高亮与实际页面一致。
|
||||
- 可选:选中缩放/按下缩放等动画(如 `BottomNavItem` 中的 `animateFloatAsState`)。
|
||||
Reference in New Issue
Block a user