FunyMeeAI/lib/widgets/pencil_chrome.dart

239 lines
6.9 KiB
Dart
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import '../design/pencil_theme.dart';
/// bi8Au 玻璃方钮 35×35 / blur 半径约 20。
class PencilGlassSquareButton extends StatelessWidget {
const PencilGlassSquareButton({
super.key,
required this.child,
required this.onTap,
this.size = 35,
this.borderRadius = 8,
});
final Widget child;
final VoidCallback onTap;
final double size;
final double borderRadius;
@override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(borderRadius),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
child: Material(
color: PencilTheme.homeGlassFill,
child: InkWell(
onTap: onTap,
child: SizedBox(
width: size,
height: size,
child: Center(child: child),
),
),
),
),
);
}
}
/// bi8Au 积分胶囊:竖向 padding 由外层控制,横向 padding 约 14。
class PencilGlassCreditsPill extends StatelessWidget {
const PencilGlassCreditsPill({
super.key,
required this.amountText,
this.onTap,
});
final String amountText;
final VoidCallback? onTap;
@override
Widget build(BuildContext context) {
final row = Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.diamond_rounded,
size: 18, color: PencilTheme.gemYellow),
const SizedBox(width: 8),
Text(
amountText,
style: GoogleFonts.inter(
fontSize: 15,
fontWeight: FontWeight.w600,
color: PencilTheme.homeTextPrimary,
shadows: PencilTheme.homeCreditsTextShadows,
),
),
],
);
return ClipRRect(
borderRadius: BorderRadius.circular(8),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
child: onTap != null
? Material(
color: PencilTheme.homeGlassFill,
child: InkWell(
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 14),
height: 35,
alignment: Alignment.centerLeft,
child: row,
),
),
)
: Container(
padding: const EdgeInsets.symmetric(horizontal: 14),
color: PencilTheme.homeGlassFill,
height: 35,
child: row,
),
),
);
}
}
/// bi8Au Create Now与 `desgin/funymee_home.pen` [aHMps] 同步(白半透明底、描边、阴影;左黄圆 + 黑加号)。
class PencilCreateNowButton extends StatelessWidget {
const PencilCreateNowButton({super.key, required this.onPressed});
final VoidCallback onPressed;
/// `aHMps` createBtn
static const double _w = 186;
static const double _h = 42;
/// `aHMps` gap横向 padding 22竖直 `(42-24)/2` 以垂直居中 24×24 左标。
static const double _gap = 10;
static const EdgeInsets _padding =
EdgeInsets.symmetric(horizontal: 22, vertical: 9);
/// `aHMps` fill `#FFFFFFA8`(略比 `#FFFFFFB3` 更透);描边 `#FFFFFFCC` 1.5;阴影 `#00000026` y6 blur20。
static const Color _fill = Color(0xA8FFFFFF);
static const Color _stroke = Color(0xCCFFFFFF);
static const Color _shadow = Color(0x26000000);
/// `TAocZ` plusCirc — 实心黄 `#FDE047``9PFVT` 加号 `#000000`。
static const Color _plusDisc = Color(0xFFFDE047);
@override
Widget build(BuildContext context) {
// 勿用 [Ink] 包一层 [BoxDecoration] 圆角底:父级 Material 的墨水层是矩形,半透明会在圆角外露出成「方块」背板。
// 这里用 [Material.shape] + [clipBehavior] 约束底色与水波纹,外圈 [Container] 只负责投影。
return Container(
width: _w,
height: _h,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(999),
boxShadow: const [
BoxShadow(
color: _shadow,
offset: Offset(0, 6),
blurRadius: 20,
),
],
),
child: Material(
color: _fill,
clipBehavior: Clip.antiAlias,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(999),
side: const BorderSide(color: _stroke, width: 1.5),
),
child: InkWell(
onTap: onPressed,
borderRadius: BorderRadius.circular(999),
child: Padding(
padding: _padding,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
DecoratedBox(
decoration: BoxDecoration(
color: _plusDisc,
borderRadius: BorderRadius.circular(20),
),
child: const SizedBox(
width: 24,
height: 24,
child: Icon(
Icons.add_rounded,
size: 12,
color: Colors.black,
),
),
),
const SizedBox(width: _gap),
Text(
'Create Now',
style: GoogleFonts.inter(
fontSize: 16,
fontWeight: FontWeight.w800,
color: PencilTheme.stone900,
letterSpacing: 0.4,
),
),
],
),
),
),
),
);
}
}
/// EYsUi / WBRp4 返回钮(无底色、无描边)。
class PencilRoundBackButton extends StatelessWidget {
const PencilRoundBackButton({super.key, required this.onPressed});
final VoidCallback onPressed;
@override
Widget build(BuildContext context) {
return Material(
color: Colors.transparent,
child: InkWell(
onTap: onPressed,
borderRadius: BorderRadius.circular(14),
child: const SizedBox(
width: 44,
height: 44,
child: Icon(Icons.chevron_left_rounded,
size: 26, color: Color(0xFF374151)),
),
),
);
}
}
/// 5J8Po 关闭钮(无底色、无描边)。
class PencilRoundCloseButton extends StatelessWidget {
const PencilRoundCloseButton({super.key, required this.onPressed});
final VoidCallback onPressed;
@override
Widget build(BuildContext context) {
return Material(
color: Colors.transparent,
child: InkWell(
onTap: onPressed,
borderRadius: BorderRadius.circular(14),
child: const SizedBox(
width: 44,
height: 44,
child: Icon(Icons.close_rounded, size: 24, color: Color(0xFF374151)),
),
),
);
}
}