设计概述 — 继承与覆盖

Navi+ 使用三层样式系统。

三层结构

┌─────────────────────────────────────────────────────┐
│  第 1 级  (设计 → 第 1 级)                        │
│  应用于所有顶级菜单项                               │
└───────────────────┬─────────────────────────────────┘
                    │  为空时第 2-3 级继承
┌───────────────────▼─────────────────────────────────┐
│  第 2-3 级  (设计 → 第 2-3 级)                    │
│  应用于子菜单 / 下拉菜单                            │
│  空 = 与第 1 级相同                                 │
└───────────────────┬─────────────────────────────────┘
                    │  单项覆盖所有内容
┌───────────────────▼─────────────────────────────────┐
│  单项  (编辑项 → 界面)                            │
│  完全覆盖第 1 级和第 2-3 级                         │
└─────────────────────────────────────────────────────┘

继承规则

第 2-3 级对所有空字段从第 1 级继承:

第 2-3 级字段 从第 1 级继承
Text Color Text Color
Font Size Font Size
Font Weight Font Weight
Icon Color Icon Color
Icon Size Icon Size
Display Layout Display Layout
Align Align
Divider Color Divider(全局)

单项覆盖

编辑项 → 界面中的设置仅对该项覆盖第 1 级和第 2-3 级。清除字段可移除覆盖。

示例

目标:所有 5 个项目白色文本,”促销”除外 = 红色。

  1. 设计 → 第 1 级 → Text Color = #FFFFFF
  2. 编辑项 → “促销” → 界面 → Text Color = #FF0000

移动端 | 桌面端语法

8 16 8 16 → 两个设备相同 8 8 8 8 | 12 24 12 24 → 左:移动端,右:桌面端