shadcn_ui-icon-button

用途

ShadIconButton 用于显示一个图标按钮（icon button），适合在界面中添加不带文字、仅以图标表达操作的按钮。

主要能力

提供五种变体：

默认（primary）
ShadIconButton.secondary
ShadIconButton.destructive
ShadIconButton.outline
ShadIconButton.ghost

使用 icon 与 onPressed 参数；可选 iconSize、padding；并支持渐变（gradient）与阴影（shadows）。

使用方式

各变体示例：

ShadIconButton(
  onPressed: () => print('Primary'),
  icon: const Icon(LucideIcons.rocket),
)

ShadIconButton.secondary(icon: const Icon(LucideIcons.rocket), onPressed: () {})

ShadIconButton.destructive(icon: const Icon(LucideIcons.rocket), onPressed: () {})

ShadIconButton.outline(icon: const Icon(LucideIcons.rocket), onPressed: () {})

ShadIconButton.ghost(icon: const Icon(LucideIcons.rocket), onPressed: () {})

加载状态

将一个小的 CircularProgressIndicator 作为 icon 使用：

ShadIconButton(
  icon: SizedBox.square(
    dimension: 16,
    child: CircularProgressIndicator(
      strokeWidth: 2,
      color: ShadTheme.of(context).colorScheme.primaryForeground,
    ),
  ),
)

渐变与阴影

ShadIconButton(
  gradient: const LinearGradient(colors: [Colors.cyan, Colors.indigo]),
  shadows: [
    BoxShadow(
      color: Colors.blue.withValues(alpha: .4),
      spreadRadius: 4,
      blurRadius: 10,
      offset: const Offset(0, 2),
    ),
  ],
  icon: const Icon(LucideIcons.rocket),
)

适用场景

当需要添加仅图标按钮（icon-only buttons）时使用。

限制

资料未提供收费、价格、平台、效果等更多信息。