akhdanre
/
TIF_E41211115_Genso_quiz_app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: adding shimmer loading

This commit is contained in:
akhdanre 2025-05-26 12:24:08 +07:00
parent 43fe1b275a
commit 9a0ccc5c61
9 changed files with 112 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
lib/component/widget/container_skeleton_widget.dart Normal file
View File

@ -0,0 +1,82 @@
import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';
class ContainerSkeleton extends StatelessWidget {
const ContainerSkeleton({super.key});
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(14),
margin: const EdgeInsets.symmetric(vertical: 5),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: const Color(0xFFE1E4E8)),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildBox(width: 50, height: 50, borderRadius: 8),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildBox(width: double.infinity, height: 16, borderRadius: 4),
const SizedBox(height: 6),
_buildBox(width: 100, height: 12, borderRadius: 4),
const SizedBox(height: 10),
Row(
children: [
_buildCircleBox(size: 14),
const SizedBox(width: 6),
_buildBox(width: 60, height: 10, borderRadius: 4),
const SizedBox(width: 12),
_buildCircleBox(size: 14),
const SizedBox(width: 6),
_buildBox(width: 60, height: 10, borderRadius: 4),
],
),
],
),
),
],
),
);
}
Widget _buildBox({
required double width,
required double height,
double borderRadius = 6,
}) {
return Shimmer.fromColors(
baseColor: Colors.grey.shade300,
highlightColor: Colors.grey.shade100,
child: Container(
width: width,
height: height,
decoration: BoxDecoration(
color: Colors.grey,
borderRadius: BorderRadius.circular(borderRadius),
),
),
);
}
Widget _buildCircleBox({required double size}) {
return Shimmer.fromColors(
baseColor: Colors.grey.shade300,
highlightColor: Colors.grey.shade100,
child: Container(
width: size,
height: size,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.grey,
),
),
);
}
}

9
lib/component/widget/recomendation_component.dart
View File

@ -1,6 +1,7 @@
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:quiz_app/component/quiz_container_component.dart';
import 'package:quiz_app/component/widget/container_skeleton_widget.dart';
import 'package:quiz_app/data/models/quiz/quiz_listing_model.dart';
class RecomendationComponent extends StatelessWidget {
@ -25,7 +26,6 @@ class RecomendationComponent extends StatelessWidget {
_buildSectionTitle(context, title),
const SizedBox(height: 10),
datas.isNotEmpty
// ? Text("yeay ${datas.length}")
? ListView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
@ -35,7 +35,12 @@ class RecomendationComponent extends StatelessWidget {
onTap: itemOnTap,
),
)
: SizedBox.shrink()
: ListView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemCount: 3,
itemBuilder: (context, index) => ContainerSkeleton(),
)
],
);
}

2
lib/core/endpoint/api_endpoint.dart
View File

@ -1,5 +1,5 @@
class APIEndpoint {
static const String baseUrl = "http://192.168.1.14:5000";
static const String baseUrl = "http://192.168.1.18:5000";
// static const String baseUrl = "http://103.193.178.121:5000";
static const String api = "$baseUrl/api";

9
lib/feature/history/view/history_view.dart
View File

@ -3,7 +3,7 @@ import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:quiz_app/app/const/colors/app_colors.dart';
import 'package:quiz_app/app/const/text/text_style.dart';
import 'package:quiz_app/component/widget/loading_widget.dart';
import 'package:quiz_app/component/widget/container_skeleton_widget.dart';
import 'package:quiz_app/data/models/history/quiz_history.dart';
import 'package:quiz_app/feature/history/controller/history_controller.dart';
@ -29,8 +29,11 @@ class HistoryView extends GetView<HistoryController> {
const SizedBox(height: 20),
Obx(() {
if (controller.isLoading.value) {
return const Expanded(
child: Center(child: LoadingWidget()),
return ListView.builder(
itemCount: 3,
itemBuilder: (context, index) {
return ContainerSkeleton();
},
);
}

9
lib/feature/library/view/library_view.dart
View File

@ -1,7 +1,7 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:quiz_app/component/widget/loading_widget.dart';
import 'package:quiz_app/component/widget/container_skeleton_widget.dart';
import 'package:quiz_app/data/models/quiz/quiz_listing_model.dart';
import 'package:quiz_app/feature/library/controller/library_controller.dart';
@ -38,7 +38,12 @@ class LibraryView extends GetView<LibraryController> {
Expanded(
child: Obx(() {
if (controller.isLoading.value) {
return LoadingWidget();
return ListView.builder(
itemCount: 3,
itemBuilder: (context, index) {
return ContainerSkeleton();
},
);
}
if (controller.quizs.isEmpty) {

2
lib/feature/profile/controller/profile_controller.dart
View File

@ -67,8 +67,6 @@ class ProfileController extends GetxController {
birthDate.value = _userController.userData?.birthDate ?? "";
phoneNumber.value = _userController.userData?.phone ?? "";
joinDate.value = _userController.userData?.createdAt ?? "";
print(_userController.userData!.toJson());
} catch (e, stackTrace) {
logC.e("Failed to load user profile data: $e", stackTrace: stackTrace);
}

1
lib/feature/quiz_play/view/quiz_play_view.dart
View File

@ -35,7 +35,6 @@ class QuizPlayView extends GetView<QuizPlayController> {
_buildQuestionText(),
const SizedBox(height: 30),
_buildAnswerSection(context),
Spacer(),
_buildNextButton(context),
],
);

8
pubspec.lock
View File

@ -525,6 +525,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "2.4.1"
shimmer:
dependency: "direct main"
description:
name: shimmer
sha256: "5f88c883a22e9f9f299e5ba0e4f7e6054857224976a5d9f839d4ebdc94a14ac9"
url: "https://pub.dev"
source: hosted
version: "3.0.0"
sky_engine:
dependency: transitive
description: flutter

1
pubspec.yaml
View File

@ -48,6 +48,7 @@ dependencies:
connectivity_plus: ^6.1.4
url_launcher: ^6.3.1
wakelock_plus: ^1.3.2
shimmer: ^3.0.0
dev_dependencies:
flutter_test: