fix(flutter): 统一详情页顶部圆形按钮
This commit is contained in:
1 parent
230f16a44a
commit
c1dd033581
4 files changed
+97
-62
No files matched your search
@@ -21,27 +21,31 @@ const Color _darkBackground = Color(0x59000000);
|
||||
const Color _darkShadowColor = Color(0x33000000);
|
||||
const Offset _lightShadowOffset = Offset(0, 2);
|
||||
|
||||
/// 二级页面统一返回按钮,浅色页使用白底描边,深色页使用半透明黑底。
|
||||
class AppSubpageBackButton extends StatelessWidget {
|
||||
const AppSubpageBackButton({
|
||||
/// 二级页面统一圆形操作按钮,返回、分享和更多共用同一尺寸与表面样式。
|
||||
class AppSubpageCircleButton extends StatelessWidget {
|
||||
const AppSubpageCircleButton({
|
||||
super.key,
|
||||
required this.backKey,
|
||||
required this.buttonKey,
|
||||
required this.tooltip,
|
||||
required this.icon,
|
||||
required this.onPressed,
|
||||
this.dark = false,
|
||||
this.onBack,
|
||||
});
|
||||
|
||||
final Key backKey;
|
||||
final Key buttonKey;
|
||||
final String tooltip;
|
||||
final IconData icon;
|
||||
final VoidCallback onPressed;
|
||||
final bool dark;
|
||||
final VoidCallback? onBack;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SizedBox(
|
||||
key: backKey,
|
||||
key: buttonKey,
|
||||
width: _backSize,
|
||||
height: _backSize,
|
||||
child: Tooltip(
|
||||
message: MaterialLocalizations.of(context).backButtonTooltip,
|
||||
message: tooltip,
|
||||
child: DecoratedBox(
|
||||
key: const Key('subpage-back-shadow'),
|
||||
decoration: BoxDecoration(
|
||||
@@ -67,10 +71,10 @@ class AppSubpageBackButton extends StatelessWidget {
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: InkWell(
|
||||
customBorder: const CircleBorder(),
|
||||
onTap: onBack ?? () => Navigator.of(context).maybePop(),
|
||||
onTap: onPressed,
|
||||
child: Center(
|
||||
child: Icon(
|
||||
Icons.chevron_left_rounded,
|
||||
icon,
|
||||
color: dark ? Colors.white : AppColors.onSurface,
|
||||
size: _iconSize,
|
||||
weight: _iconWeight,
|
||||
@@ -84,6 +88,31 @@ class AppSubpageBackButton extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// 二级页面统一返回按钮,浅色页使用白底描边,深色页使用半透明黑底。
|
||||
class AppSubpageBackButton extends StatelessWidget {
|
||||
const AppSubpageBackButton({
|
||||
super.key,
|
||||
required this.backKey,
|
||||
this.dark = false,
|
||||
this.onBack,
|
||||
});
|
||||
|
||||
final Key backKey;
|
||||
final bool dark;
|
||||
final VoidCallback? onBack;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return AppSubpageCircleButton(
|
||||
buttonKey: backKey,
|
||||
tooltip: MaterialLocalizations.of(context).backButtonTooltip,
|
||||
icon: Icons.chevron_left_rounded,
|
||||
dark: dark,
|
||||
onPressed: onBack ?? () => Navigator.of(context).maybePop(),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// 二级页面统一页头:返回按钮、左对齐标题、可选副标题与右侧操作。
|
||||
class AppSubpageHeader extends StatelessWidget {
|
||||
const AppSubpageHeader({
|
||||
|
||||
Reference in new issue
Block a user