mirror of
https://github.com/R0m1k3/xtremflow.git
synced 2026-10-11 17:30:00 +02:00
feat: add mobile scaffold layout and dedicated mobile video player implementation
This commit is contained in:
1 parent
36a7658cf9
commit
ddb8110c40
3 files changed
+201
-244
No files matched your search
@@ -55,56 +55,61 @@ class GlassContainer extends StatelessWidget {
|
||||
final finalBgColor = backgroundColor ?? AppColors.glassBackground;
|
||||
final finalBorderColor = borderColor ?? AppColors.glassBorder;
|
||||
|
||||
// BackdropFilter is extremely expensive in Flutter Web on mobile Safari.
|
||||
// On mobile web (width < 600), skip the blur entirely.
|
||||
final screenWidth = MediaQuery.of(context).size.width;
|
||||
final useBlur = blur > 0 && !(Theme.of(context).platform == TargetPlatform.iOS && screenWidth < 600);
|
||||
|
||||
final inner = Container(
|
||||
padding: padding,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(borderRadius),
|
||||
gradient: showGradient
|
||||
? LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [
|
||||
finalBgColor.withOpacity(finalOpacity * 1.2),
|
||||
finalBgColor.withOpacity(finalOpacity * 0.6),
|
||||
],
|
||||
)
|
||||
: null,
|
||||
color: showGradient ? null : finalBgColor.withOpacity(finalOpacity),
|
||||
border: hasBorder
|
||||
? Border.all(color: finalBorderColor, width: borderWidth)
|
||||
: null,
|
||||
boxShadow: showShadow
|
||||
? [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.15),
|
||||
blurRadius: 24,
|
||||
spreadRadius: -6,
|
||||
offset: const Offset(0, 8),
|
||||
),
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.08),
|
||||
blurRadius: 12,
|
||||
spreadRadius: -3,
|
||||
offset: const Offset(0, 4),
|
||||
),
|
||||
]
|
||||
: [],
|
||||
),
|
||||
child: child,
|
||||
);
|
||||
|
||||
return Container(
|
||||
width: width,
|
||||
height: height,
|
||||
margin: margin,
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(borderRadius),
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: blur, sigmaY: blur),
|
||||
child: Container(
|
||||
padding: padding,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(borderRadius),
|
||||
// Subtle gradient overlay for depth
|
||||
gradient: showGradient
|
||||
? LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [
|
||||
finalBgColor.withOpacity(finalOpacity * 1.2),
|
||||
finalBgColor.withOpacity(finalOpacity * 0.6),
|
||||
],
|
||||
)
|
||||
: null,
|
||||
border: hasBorder
|
||||
? Border.all(
|
||||
color: finalBorderColor,
|
||||
width: borderWidth,
|
||||
)
|
||||
: null,
|
||||
// Premium shadow
|
||||
boxShadow: showShadow
|
||||
? [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.15),
|
||||
blurRadius: 24,
|
||||
spreadRadius: -6,
|
||||
offset: const Offset(0, 8),
|
||||
),
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.08),
|
||||
blurRadius: 12,
|
||||
spreadRadius: -3,
|
||||
offset: const Offset(0, 4),
|
||||
),
|
||||
]
|
||||
: [],
|
||||
),
|
||||
child: child,
|
||||
),
|
||||
),
|
||||
child: useBlur
|
||||
? BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: blur, sigmaY: blur),
|
||||
child: inner,
|
||||
)
|
||||
: inner,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import 'dart:ui';
|
||||
import '../../core/theme/app_colors.dart';
|
||||
|
||||
class MobileScaffold extends ConsumerWidget {
|
||||
@@ -42,12 +41,9 @@ class MobileScaffold extends ConsumerWidget {
|
||||
child,
|
||||
],
|
||||
),
|
||||
bottomNavigationBar: ClipRRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||
child: Container(
|
||||
bottomNavigationBar: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.surface.withOpacity(0.9),
|
||||
color: AppColors.surface,
|
||||
border: const Border(
|
||||
top: BorderSide(
|
||||
color: AppColors.border,
|
||||
@@ -90,8 +86,6 @@ class MobileScaffold extends ConsumerWidget {
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user