added loading componant
This commit is contained in:
parent
cecfb294e5
commit
4207e235e5
BIN
assets/logo/loading_logo.png
Normal file
BIN
assets/logo/loading_logo.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 327 KiB |
105
lib/helpers/widgets/my_loading_component.dart
Normal file
105
lib/helpers/widgets/my_loading_component.dart
Normal file
@ -0,0 +1,105 @@
|
|||||||
|
import 'dart:ui';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:loading_animation_widget/loading_animation_widget.dart';
|
||||||
|
import 'package:marco/images.dart';
|
||||||
|
|
||||||
|
class LoadingComponent extends StatelessWidget {
|
||||||
|
final bool isLoading;
|
||||||
|
final Widget child;
|
||||||
|
final Color overlayColor;
|
||||||
|
final double overlayOpacity;
|
||||||
|
final double imageSize;
|
||||||
|
final bool showDots;
|
||||||
|
final String loadingText;
|
||||||
|
|
||||||
|
const LoadingComponent({
|
||||||
|
Key? key,
|
||||||
|
required this.isLoading,
|
||||||
|
required this.child,
|
||||||
|
this.overlayColor = Colors.black,
|
||||||
|
this.overlayOpacity = 0.2,
|
||||||
|
this.imageSize = 100,
|
||||||
|
this.showDots = true,
|
||||||
|
this.loadingText = 'Loading...',
|
||||||
|
}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Stack(
|
||||||
|
children: [
|
||||||
|
child,
|
||||||
|
if (isLoading) _buildLoadingOverlay(),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
Widget _buildLoadingOverlay() {
|
||||||
|
return Positioned.fill(
|
||||||
|
child: Semantics(
|
||||||
|
label: 'Loading...',
|
||||||
|
child: Stack(
|
||||||
|
children: [
|
||||||
|
BackdropFilter(
|
||||||
|
filter: ImageFilter.blur(sigmaX: 5.0, sigmaY: 5.0),
|
||||||
|
child: Container(
|
||||||
|
color: overlayColor.withOpacity(overlayOpacity),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Center(
|
||||||
|
child: _LoadingAnimation(
|
||||||
|
imageSize: imageSize,
|
||||||
|
showDots: showDots,
|
||||||
|
loadingText: loadingText,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class _LoadingAnimation extends StatelessWidget {
|
||||||
|
final double imageSize;
|
||||||
|
final bool showDots;
|
||||||
|
final String loadingText;
|
||||||
|
|
||||||
|
const _LoadingAnimation({
|
||||||
|
Key? key,
|
||||||
|
required this.imageSize,
|
||||||
|
required this.showDots,
|
||||||
|
required this.loadingText,
|
||||||
|
}) : super(key: key);
|
||||||
|
|
||||||
|
static const _textStyle = TextStyle(
|
||||||
|
fontSize: 12,
|
||||||
|
color: Colors.white,
|
||||||
|
);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Column(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: [
|
||||||
|
Image.asset(
|
||||||
|
Images.loadingLogo,
|
||||||
|
height: imageSize,
|
||||||
|
width: imageSize,
|
||||||
|
fit: BoxFit.contain,
|
||||||
|
),
|
||||||
|
const SizedBox(height: 8),
|
||||||
|
Text(
|
||||||
|
loadingText,
|
||||||
|
style: _textStyle,
|
||||||
|
textAlign: TextAlign.center,
|
||||||
|
),
|
||||||
|
const SizedBox(height: 4),
|
||||||
|
if (showDots)
|
||||||
|
LoadingAnimationWidget.waveDots(
|
||||||
|
color: const Color(0xFFEF0000),
|
||||||
|
size: 50,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -10,7 +10,7 @@ class Images {
|
|||||||
static String logoDark = 'assets/logo/logo_dark.png';
|
static String logoDark = 'assets/logo/logo_dark.png';
|
||||||
static String logoDarkSmall = 'assets/logo/logo_dark_small.png';
|
static String logoDarkSmall = 'assets/logo/logo_dark_small.png';
|
||||||
static String authBackground = 'assets/auth_background.jpg';
|
static String authBackground = 'assets/auth_background.jpg';
|
||||||
|
static String loadingLogo = 'assets/logo/loading_logo.png';
|
||||||
static String randomImage(List<String> images) {
|
static String randomImage(List<String> images) {
|
||||||
return images[Random().nextInt(images.length)];
|
return images[Random().nextInt(images.length)];
|
||||||
}
|
}
|
||||||
|
@ -21,6 +21,7 @@ import 'package:marco/helpers/utils/permission_constants.dart';
|
|||||||
import 'package:marco/helpers/utils/attendance_actions.dart';
|
import 'package:marco/helpers/utils/attendance_actions.dart';
|
||||||
import 'package:marco/helpers/widgets/my_refresh_wrapper.dart';
|
import 'package:marco/helpers/widgets/my_refresh_wrapper.dart';
|
||||||
import 'package:marco/model/my_paginated_table.dart';
|
import 'package:marco/model/my_paginated_table.dart';
|
||||||
|
import 'package:marco/helpers/widgets/my_loading_component.dart';
|
||||||
|
|
||||||
class AttendanceScreen extends StatefulWidget {
|
class AttendanceScreen extends StatefulWidget {
|
||||||
const AttendanceScreen({super.key});
|
const AttendanceScreen({super.key});
|
||||||
@ -51,7 +52,10 @@ class _AttendanceScreenState extends State<AttendanceScreen> with UIMixin {
|
|||||||
init: attendanceController,
|
init: attendanceController,
|
||||||
tag: 'attendance_dashboard_controller',
|
tag: 'attendance_dashboard_controller',
|
||||||
builder: (controller) {
|
builder: (controller) {
|
||||||
return Column(
|
return LoadingComponent(
|
||||||
|
isLoading: controller.isLoading.value,
|
||||||
|
loadingText: 'Loading Attendance...',
|
||||||
|
child: Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
Padding(
|
Padding(
|
||||||
@ -194,6 +198,7 @@ class _AttendanceScreenState extends State<AttendanceScreen> with UIMixin {
|
|||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
@ -99,6 +99,7 @@ flutter:
|
|||||||
- assets/coin/
|
- assets/coin/
|
||||||
- assets/dummy/ecommerce/
|
- assets/dummy/ecommerce/
|
||||||
- assets/dummy/single_product/
|
- assets/dummy/single_product/
|
||||||
|
- assets/logo/loading_logo.png
|
||||||
# assets:
|
# assets:
|
||||||
# - images/a_dot_burr.jpeg
|
# - images/a_dot_burr.jpeg
|
||||||
# - images/a_dot_ham.jpeg
|
# - images/a_dot_ham.jpeg
|
||||||
|
Loading…
x
Reference in New Issue
Block a user