fix：按照shadcn_ui对着demo_shadcn对齐

2026-06-05 15:04:39 +08:00
parent 9727b906c6
commit c5288f397d
29 changed files with 1425 additions and 642 deletions
@@ -1,6 +1,6 @@
 import 'package:flutter/material.dart';
+import 'package:shadcn_ui/shadcn_ui.dart';

-import '../theme/yanting_text.dart';
 import '../theme/yanting_tokens.dart';

 class AppButton extends StatelessWidget {
@@ -21,48 +21,84 @@ class AppButton extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
-    final colors = switch (kind) {
-      AppButtonKind.primary => (
-        YantingColors.primary,
-        YantingColors.primaryForeground,
-        Colors.transparent,
+    final leading = icon == null ? null : Icon(icon, size: 16);
+    final width = expand ? double.infinity : null;
+    final child = Text(label);
+
+    return switch (kind) {
+      AppButtonKind.primary => ShadButton(
+        width: width,
+        onPressed: onPressed,
+        leading: leading,
+        child: child,
      ),
-      AppButtonKind.dark => (
-        YantingColors.foreground,
-        YantingColors.background,
-        Colors.transparent,
+      AppButtonKind.dark => ShadButton(
+        width: width,
+        onPressed: onPressed,
+        leading: leading,
+        backgroundColor: YantingColors.foreground,
+        foregroundColor: YantingColors.background,
+        hoverBackgroundColor: YantingColors.foreground.withValues(alpha: 0.9),
+        child: child,
      ),
-      AppButtonKind.accent => (
-        YantingColors.brandSoft,
-        YantingColors.primaryForeground,
-        Colors.transparent,
+      AppButtonKind.accent => ShadButton.secondary(
+        width: width,
+        onPressed: onPressed,
+        leading: leading,
+        backgroundColor: YantingColors.brandSoft,
+        foregroundColor: YantingColors.primaryForeground,
+        hoverBackgroundColor: YantingColors.brandSoftBorder,
+        child: child,
      ),
-      AppButtonKind.ghost => (
-        YantingColors.background,
-        YantingColors.foreground,
-        YantingColors.border,
+      AppButtonKind.ghost => ShadButton.outline(
+        width: width,
+        onPressed: onPressed,
+        leading: leading,
+        child: child,
      ),
    };
-    final child = FilledButton.icon(
-      onPressed: onPressed,
-      icon: icon == null ? const SizedBox.shrink() : Icon(icon, size: 18),
-      label: Text(label),
-      style: FilledButton.styleFrom(
-        backgroundColor: colors.$1,
-        foregroundColor: colors.$2,
-        disabledBackgroundColor: YantingColors.border,
-        disabledForegroundColor: YantingColors.mutedForeground,
-        minimumSize: Size(expand ? double.infinity : 0, 44),
-        textStyle: YantingText.body.copyWith(fontWeight: FontWeight.w600),
-        side: colors.$3 == Colors.transparent
-            ? BorderSide.none
-            : BorderSide(color: colors.$3),
-        shape: RoundedRectangleBorder(
-          borderRadius: BorderRadius.circular(YantingRadius.md),
-        ),
+  }
+}
+
+class AppIconButton extends StatelessWidget {
+  const AppIconButton({
+    required this.icon,
+    required this.onPressed,
+    this.kind = AppButtonKind.ghost,
+    super.key,
+  });
+
+  final IconData icon;
+  final VoidCallback? onPressed;
+  final AppButtonKind kind;
+
+  @override
+  Widget build(BuildContext context) {
+    final iconWidget = Icon(icon, size: 16);
+    return switch (kind) {
+      AppButtonKind.primary => ShadIconButton(
+        onPressed: onPressed,
+        icon: iconWidget,
      ),
-    );
-    return expand ? SizedBox(width: double.infinity, child: child) : child;
+      AppButtonKind.dark => ShadIconButton(
+        onPressed: onPressed,
+        backgroundColor: YantingColors.foreground,
+        foregroundColor: YantingColors.background,
+        hoverBackgroundColor: YantingColors.foreground.withValues(alpha: 0.9),
+        icon: iconWidget,
+      ),
+      AppButtonKind.accent => ShadIconButton.secondary(
+        onPressed: onPressed,
+        backgroundColor: YantingColors.brandSoft,
+        foregroundColor: YantingColors.primaryForeground,
+        hoverBackgroundColor: YantingColors.brandSoftBorder,
+        icon: iconWidget,
+      ),
+      AppButtonKind.ghost => ShadIconButton.outline(
+        onPressed: onPressed,
+        icon: iconWidget,
+      ),
+    };
  }
 }