mobile_skt/lib/widgets/back_decoration.dart

160 lines
6.8 KiB
Dart

import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:sk_base_mobile/app_theme.dart';
import 'package:sk_base_mobile/constants/bg_color.dart';
import 'package:sk_base_mobile/util/screen_adaper_util.dart';
class BackColors extends StatelessWidget {
const BackColors({super.key});
@override
Widget build(BuildContext context) {
final size = MediaQuery.sizeOf(context);
return Container(
color: Colors.white,
margin: EdgeInsets.only(top: ScreenAdaper.height(30)),
child: Stack(
children: [
Positioned(
top: ScreenAdaper.height(100),
child: Container(
height: ScreenAdaper.height(size.height) * 0.5,
width: ScreenAdaper.width(size.width) * 0.5,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30),
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.centerRight,
colors: [
lightOrange.withOpacity(.0),
lightOrange.withOpacity(.1),
lightOrange.withOpacity(.2),
lightOrange.withOpacity(.3),
lightOrange.withOpacity(.4),
lightOrange.withOpacity(.4),
lightOrange.withOpacity(.3),
lightOrange.withOpacity(.2),
lightOrange.withOpacity(.1),
lightOrange.withOpacity(0),
])),
)),
Positioned(
top: ScreenAdaper.height(100),
right: ScreenAdaper.width(-50),
child: Container(
height: ScreenAdaper.height(size.height) * 0.5,
width: ScreenAdaper.width(size.width) * 0.3,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30),
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.centerRight,
colors: [
lightOrange.withOpacity(.0),
lightOrange.withOpacity(.1),
lightOrange.withOpacity(.2),
lightOrange.withOpacity(.3),
lightOrange.withOpacity(.2),
lightOrange.withOpacity(.1),
lightOrange.withOpacity(0),
])),
)),
Positioned(
bottom: ScreenAdaper.height(100),
right: ScreenAdaper.width(-50),
child: Container(
height: ScreenAdaper.height(size.height) * 0.5,
width: ScreenAdaper.width(size.width) * 0.6,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.centerRight,
colors: [
lightAccentBlue.withOpacity(.0),
lightAccentBlue.withOpacity(.1),
lightAccentBlue.withOpacity(.2),
lightAccentBlue.withOpacity(.3),
lightAccentBlue.withOpacity(.4),
lightAccentBlue.withOpacity(.4),
lightAccentBlue.withOpacity(.3),
lightAccentBlue.withOpacity(.2),
lightAccentBlue.withOpacity(.1),
lightAccentBlue.withOpacity(0),
])),
)),
Positioned(
bottom: ScreenAdaper.height(-60),
child: Container(
height: ScreenAdaper.height(size.height) * 0.3,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.centerRight,
colors: [
lightAccentBlue.withOpacity(.0),
lightAccentBlue.withOpacity(.1),
lightAccentBlue.withOpacity(.2),
lightAccentBlue.withOpacity(.3),
lightAccentBlue.withOpacity(.4),
lightAccentBlue.withOpacity(.4),
lightAccentBlue.withOpacity(.3),
lightAccentBlue.withOpacity(.2),
lightAccentBlue.withOpacity(.1),
lightAccentBlue.withOpacity(0),
])),
)),
Positioned(
bottom: 1,
left: 1,
top: !ScreenAdaper.isLandspace()
? ScreenAdaper.height(160)
: ScreenAdaper.height(220),
right: 1,
child: Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.centerRight,
colors: [
for (var i = 0; i <= 4; i += 1)
AppTheme.primaryColorLight.withOpacity(i * 0.1),
for (var i = 4; i >= 0; i -= 1)
AppTheme.primaryColorLight.withOpacity(i * 0.1),
])),
)),
Positioned(
bottom: 1,
right: 1,
child: Container(
height: ScreenAdaper.height(size.height) * 0.3,
width: ScreenAdaper.width(size.width) * 0.6,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.centerRight,
colors: [
for (var i = 0; i <= 4; i += 1)
AppTheme.secondPrimaryColorLight
.withOpacity(i * 0.1),
for (var i = 4; i >= 0; i -= 1)
AppTheme.secondPrimaryColorLight
.withOpacity(i * 0.1),
])),
)),
Positioned.fill(
child: BackdropFilter(
filter: ImageFilter.blur(
sigmaY: ScreenAdaper.height(30),
sigmaX: ScreenAdaper.width(30)),
child: const SizedBox(),
)),
],
),
);
}
}