c94b9e5e58
Co-Authored-By: Claude Code <noreply@anthropic.com>
84 lines
3.6 KiB
Dart
84 lines
3.6 KiB
Dart
/// UI-01 设计令牌(方案 §3.1/§3.2):色彩、间距、圆角、动效时长。
|
||
///
|
||
/// - 语义色(成功/等待/错误)不占用 Material ColorScheme 角色(secondary
|
||
/// 虽承载等待色,但组件层统一走令牌),浅色值为方案基准;深色场景用
|
||
/// `*Dark` 变体——深色表面上直接使用浅色基准会跌破对比度目标,组件按
|
||
/// [Brightness] 选择(见 StateBadge)。
|
||
/// - 间距 4/8/12/16/24/32;页面左右默认 [kSpace16]。
|
||
/// - 圆角:卡片 16 / 输入框与按钮 12 / 小标签 8,避免全部做成胶囊。
|
||
/// - 动效:轻量状态 [kMotionFast]、轮播/照片过渡 [kMotionCarousel];
|
||
/// 系统「减少动态效果」开启时 [motion] 统一归零(禁用非必要动效)。
|
||
library;
|
||
|
||
import 'package:flutter/material.dart';
|
||
|
||
// ── 语义色(浅色基准,方案 §3.1)──────────────────────────────────────────
|
||
|
||
/// 成功:已上传等完成事实(#16794B)。
|
||
const Color kColorSuccess = Color(0xFF16794B);
|
||
|
||
/// 等待:等待网络、等待调度(#996300)。
|
||
const Color kColorWaiting = Color(0xFF996300);
|
||
|
||
/// 错误:需要用户处理的失败(#B42318)。
|
||
const Color kColorError = Color(0xFFB42318);
|
||
|
||
/// 信息:中性提示(与主色一致,#1A73E8)。
|
||
const Color kColorInfo = Color(0xFF1A73E8);
|
||
|
||
/// 分隔线:轻分隔,不用粗边框(#E5EAF1)。
|
||
const Color kColorDivider = Color(0xFFE5EAF1);
|
||
|
||
/// 次文字:时间、地点、说明(#5E6878)。
|
||
const Color kColorTextSecondary = Color(0xFF5E6878);
|
||
|
||
// ── 语义色(深色变体:深色表面对应提亮值)──────────────────────────────
|
||
|
||
/// 成功(深色表面用)。
|
||
const Color kColorSuccessDark = Color(0xFF34D399);
|
||
|
||
/// 等待(深色表面用)。
|
||
const Color kColorWaitingDark = Color(0xFFFCD34D);
|
||
|
||
/// 错误(深色表面用)。
|
||
const Color kColorErrorDark = Color(0xFFF87171);
|
||
|
||
/// 信息(深色表面用,与深色主色一致)。
|
||
const Color kColorInfoDark = Color(0xFF8AB4F8);
|
||
|
||
/// 次文字(深色表面用)。
|
||
const Color kColorTextSecondaryDark = Color(0xFFA6B0C0);
|
||
|
||
// ── 间距(4/8/12/16/24/32)───────────────────────────────────────────────
|
||
|
||
const double kSpace4 = 4.0;
|
||
const double kSpace8 = 8.0;
|
||
const double kSpace12 = 12.0;
|
||
const double kSpace16 = 16.0;
|
||
const double kSpace24 = 24.0;
|
||
const double kSpace32 = 32.0;
|
||
|
||
// ── 圆角(卡片 16 / 输入框与按钮 12 / 小标签 8)────────────────────────
|
||
|
||
const double kRadiusCard = 16.0;
|
||
const double kRadiusInput = 12.0;
|
||
const double kRadiusBadge = 8.0;
|
||
|
||
// ── 动效时长(轻量 150-220ms / 轮播 250-350ms)────────────────────────
|
||
|
||
/// 轻量状态过渡(选中态、chip 切换等)。
|
||
const Duration kMotionFast = Duration(milliseconds: 180);
|
||
|
||
/// 轮播/照片过渡。
|
||
const Duration kMotionCarousel = Duration(milliseconds: 300);
|
||
|
||
/// 「减少动态效果」开启时的时长(等价禁用非必要动效)。
|
||
const Duration kMotionReduce = Duration.zero;
|
||
|
||
/// 当前上下文的动效时长:默认 [kMotionFast],`carousel: true` 取
|
||
/// [kMotionCarousel];系统「减少动态效果」开启时一律 [kMotionReduce]。
|
||
Duration motion(BuildContext context, {bool carousel = false}) {
|
||
if (MediaQuery.disableAnimationsOf(context)) return kMotionReduce;
|
||
return carousel ? kMotionCarousel : kMotionFast;
|
||
}
|