fix(design,app-iced): 图标尺寸与禁用 α 收敛到官方字节码,两族拆开(M86)
图标:IconSize::Button 16→18(AAR ButtonDefaults.<clinit> 的 bipush 18);新增 IconSize::SwitchThumb=16(SwitchTokens.Selected/UnselectedIconSize)承接开关滑块,按钮与 滑块不再借同一档;IconSize::Nav 的值不动但文档订正(无消费,官方导航/列表图标是 24)。 ButtonSmallTokens.IconSize=20 在整包 AAR 里零消费(javap 搜 getIconSize 无外部调用), 是死令牌,不再作为取值依据。 禁用 α:官方本来就分两族——按钮容器 0.10(*ButtonTokens.DisabledContainerOpacity)与 面状控件 0.12(chip 描边 / slider 轨道 / switch 轨道)。原来的缺陷是一个全局 12% 同时 服务两族(按钮那半边一直错、另半边一直对),现拆成 disabled_button_colors/…_content 与 disabled_colors/disabled_content_over_role 两个入口;interaction 首次超 400 行, 禁用口径与测试搬到 interaction/disabled.rs。 标题栏 caption 三键:官方 SmallIconButtonTokens.IconSize=24,按用户点名缩到 20 (容器 46×48 不动),登记为项目偏离;icons.rs 加按令牌取尺寸的入口 view_at,按 (种类,尺寸) 分别烘焙 SVG,20px 的 stroke 取 1.8 保视觉线宽 1.5px。
This commit is contained in:
1 parent
c825e1aa3d
commit
b566097107
16 files changed
+664
-175
No files matched your search
@@ -5,7 +5,7 @@
|
||||
//! | 部件 | 参考 | 令牌落点 |
|
||||
//! |---|---|---|
|
||||
//! | 标题栏高度 | 16.2 桌面标题栏 **40**(登记偏离) | `LM.titlebar_height = 48`(M63 §1.4/R13 桌面档,令牌优先) |
|
||||
//! | 标题栏按钮 | 16.5 图标 **24** | `IconSize::Toolbar` + `LM.titlebar_button_width = 46` |
|
||||
//! | 标题栏按钮 | 16.5 官方图标 **24** → 本项目 **20**(M86 项目偏离,用户点名「图标稍大」) | `icons::CAPTION_PX`(令牌 `TITLEBAR_CAPTION_ICON_PX`)+ `LM.titlebar_button_width = 46` |
|
||||
//! | 页头 | 16.1 官方 AppBar **64**;本项目 **56** | `LM.page_header_height = 56`(已有偏离登记) |
|
||||
//! | 卡片 | 3.x Outlined:**Medium(12)**、L0、`OutlineVariant` 1px、`SurfaceContainerLow` | `Component::OutlinedCard.spec()` + `STROKE_PX` |
|
||||
//! | 字级 | 16.4 标题 `TitleLarge`;卡片 `TitleMedium` / `BodySmall` | `Ui::style` / `Ui::emphasized` |
|
||||
@@ -153,9 +153,13 @@ fn titlebar<'a>(ui: &'a Ui, title: &'a str, forced: Option<ForcedState>) -> Elem
|
||||
|
||||
/// 标题栏按钮(自绘最小化/最大化/关闭)。
|
||||
///
|
||||
/// 图标必须**再包一层固定 24×24 的容器**:iced 的 `button` 在 layout 里给内容 Fill 约束,
|
||||
/// 图标必须**再包一层固定尺寸的容器**:iced 的 `button` 在 layout 里给内容 Fill 约束,
|
||||
/// 直接把 `svg(...).width(24)` 塞进 button,usvg 会按 Contain 撑满内区(实测渲染盒 46 → 视觉线宽
|
||||
/// 从 1.5 变 2.9,视觉复审 P2-2)。Container 尊重子元素的 Length,所以这层是「锁尺寸」用的。
|
||||
///
|
||||
/// **图标尺寸 = [`icons::CAPTION_PX`](20,项目偏离;官方 24),容器 46×48 不动**(M86):
|
||||
/// 用户原话是「保持其容器尺寸不变的前提下把图标改小些」,所以缩放只落在图标盒与 SVG 位图上,
|
||||
/// `metrics.titlebar_button_width` / `titlebar_height` 一个都不许跟着改。
|
||||
fn caption<'a>(
|
||||
ui: &'a Ui,
|
||||
kind: IconKind,
|
||||
@@ -163,15 +167,17 @@ fn caption<'a>(
|
||||
forced: Option<ForcedState>,
|
||||
) -> Element<'a, Message> {
|
||||
let metrics = ui.metrics();
|
||||
// 用 `center(Length::Fill)` 而不是只设 `width(24).height(24)`:后者会让容器缩到 24×24 并贴到
|
||||
// 用 `center(Length::Fill)` 而不是只设 `width(20).height(20)`:后者会让容器缩到 20×20 并贴到
|
||||
// button 内容的左上角(button 不居中「收缩后」的内容,r1 实测图标跑到 cell 左上 (left+11.5, 11.5));
|
||||
// `center(Fill)` = 撑满按钮内容区 + 内容居中,字形仍是 24 盒、命中区仍是 46×48。
|
||||
let icon = container(icons::view::<Message>(
|
||||
// `center(Fill)` = 撑满按钮内容区 + **两轴**居中,字形仍是 20 盒、命中区仍是 46×48(Q21:
|
||||
// 只设 `align_y` 不设 `align_x` 会让图标贴左)。
|
||||
let icon = container(icons::view_at::<Message>(
|
||||
kind,
|
||||
ui.color(Role::OnSurfaceVariant),
|
||||
icons::CAPTION_PX,
|
||||
))
|
||||
.width(icons::RENDER_PX)
|
||||
.height(icons::RENDER_PX)
|
||||
.width(icons::CAPTION_PX)
|
||||
.height(icons::CAPTION_PX)
|
||||
.center(Length::Fill);
|
||||
|
||||
button(icon)
|
||||
@@ -346,4 +352,29 @@ mod tests {
|
||||
assert_eq!(crate::shot::flavor_slug(&ui(SchemeFlavor::Light)), "light");
|
||||
assert_eq!(crate::shot::flavor_slug(&ui(SchemeFlavor::Dark)), "dark");
|
||||
}
|
||||
|
||||
/// M86:标题栏 caption 图标缩到 20 后,**容器一个数都没动**(46×48),图标也还在框里。
|
||||
#[test]
|
||||
fn caption_icon_shrinks_without_touching_the_container() {
|
||||
let ui = ui(SchemeFlavor::Light);
|
||||
let metrics = ui.metrics();
|
||||
let caption = icons::CAPTION_PX;
|
||||
assert_eq!(metrics.titlebar_button_width, 46.0, "容器宽不许跟着图标改");
|
||||
assert_eq!(metrics.titlebar_height, 48.0, "容器高不许跟着图标改");
|
||||
assert!(
|
||||
caption < metrics.titlebar_button_width,
|
||||
"图标 {caption} 必须小于按钮宽 {}",
|
||||
metrics.titlebar_button_width
|
||||
);
|
||||
assert!(
|
||||
caption < metrics.titlebar_height,
|
||||
"图标 {caption} 必须小于按钮高 {}",
|
||||
metrics.titlebar_height
|
||||
);
|
||||
// 官方口径 24 仍在令牌里(`IconSize::Toolbar`),偏离只发生在 caption 这一个入口。
|
||||
assert!(
|
||||
caption < unlucky_design::icons::IconSize::Toolbar.px(),
|
||||
"caption 图标必须小于官方 24(缩小是用户点名的)"
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user