wangjia
526e7f2f33
基于 design/flutter/ 起步包在 client/ 下建立 Flutter 工程：
- pubspec.yaml：flutter_svg / lucide_icons / google_fonts 依赖；
SVG 资产注册；字体由 google_fonts 运行时加载，无需本地 ttf
- lib/pangolin_theme.dart：完整设计令牌（色阶 / 间距 / 圆角 /
动效 / 文字阶），PangolinText 改用 GoogleFonts getter，
PangolinTheme.light / .dark 开箱即用
- lib/main.dart：runApp + 明暗主题 + 登录 → 引导 → 主框架 RootFlow
- lib/widgets/：全套组件雏形
pangolin_icons Lucide 图标映射
pangolin_button 胶囊按钮四态
country_code 国家码块 + 信号条
status_pill 色点胶囊
connect_button 核心连接键三态（off/connecting/on + 动画）
server_tile 服务器列表行
plan_card 套餐卡（专业版渐变高亮）
auth_screen 登录 / 注册（邮箱验证码 + 设密码）
onboarding_screen 首次引导 PageView（3 屏可滑动 + 进度点）
home_shell 底部 4 Tab（连接/节点/统计/账户 + 状态机）
account_screens 套餐选择 / 设备管理 / 兑换 / 联系我们
pangolin_logo PangolinMark / BrandLockup / AppIcon（SVG）
- assets/：logo-mark / logo-mark-white / logo-wordmark / app-icon（SVG）
- android/：Kotlin 主 Activity + Manifest + Gradle 配置
- ios/：Runner.xcodeproj + xcscheme + Podfile + AppDelegate + storyboard
运行方式（cd client/）：
flutter pub get && flutter run
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
45 lines
1.6 KiB
Dart
45 lines
1.6 KiB
Dart
// status_pill.dart — 状态胶囊(色点 + 文字)
|
|
import 'package:flutter/material.dart';
|
|
import '../pangolin_theme.dart';
|
|
|
|
enum PangolinStatus { connected, connecting, error, neutral, pro }
|
|
|
|
class StatusPill extends StatelessWidget {
|
|
const StatusPill({super.key, required this.label, this.status = PangolinStatus.neutral});
|
|
final String label;
|
|
final PangolinStatus status;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final c = context.pangolin;
|
|
late final Color bg, fg, dot;
|
|
bool showDot = true;
|
|
switch (status) {
|
|
case PangolinStatus.connected:
|
|
bg = c.successSubtle; fg = c.success; dot = c.success; break;
|
|
case PangolinStatus.connecting:
|
|
bg = c.warningSubtle; fg = c.warning; dot = c.warning; break;
|
|
case PangolinStatus.error:
|
|
bg = c.dangerSubtle; fg = c.danger; dot = c.danger; break;
|
|
case PangolinStatus.pro:
|
|
bg = c.accent; fg = c.fgOnAccent; dot = c.fgOnAccent; showDot = false; break;
|
|
case PangolinStatus.neutral:
|
|
bg = c.bgSubtle; fg = c.fg2; dot = c.fg3; break;
|
|
}
|
|
return Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
|
decoration: BoxDecoration(color: bg, borderRadius: BorderRadius.circular(PangolinRadius.full)),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
if (showDot) ...[
|
|
Container(width: 7, height: 7, decoration: BoxDecoration(color: dot, shape: BoxShape.circle)),
|
|
const SizedBox(width: 7),
|
|
],
|
|
Text(label, style: PangolinText.caption.copyWith(color: fg, fontWeight: FontWeight.w600)),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|