diff --git a/lib/component/widget/container_skeleton_widget.dart b/lib/component/widget/container_skeleton_widget.dart new file mode 100644 index 0000000..39f96aa --- /dev/null +++ b/lib/component/widget/container_skeleton_widget.dart @@ -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, + ), + ), + ); + } +} diff --git a/lib/component/widget/recomendation_component.dart b/lib/component/widget/recomendation_component.dart index c250a6a..203e461 100644 --- a/lib/component/widget/recomendation_component.dart +++ b/lib/component/widget/recomendation_component.dart @@ -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(), + ) ], ); } diff --git a/lib/core/endpoint/api_endpoint.dart b/lib/core/endpoint/api_endpoint.dart index ee5556b..ab82f99 100644 --- a/lib/core/endpoint/api_endpoint.dart +++ b/lib/core/endpoint/api_endpoint.dart @@ -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"; diff --git a/lib/feature/history/view/history_view.dart b/lib/feature/history/view/history_view.dart index 8e45d24..300787d 100644 --- a/lib/feature/history/view/history_view.dart +++ b/lib/feature/history/view/history_view.dart @@ -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 { 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(); + }, ); } diff --git a/lib/feature/library/view/library_view.dart b/lib/feature/library/view/library_view.dart index aaeeeb5..97bcf53 100644 --- a/lib/feature/library/view/library_view.dart +++ b/lib/feature/library/view/library_view.dart @@ -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 { Expanded( child: Obx(() { if (controller.isLoading.value) { - return LoadingWidget(); + return ListView.builder( + itemCount: 3, + itemBuilder: (context, index) { + return ContainerSkeleton(); + }, + ); } if (controller.quizs.isEmpty) { diff --git a/lib/feature/profile/controller/profile_controller.dart b/lib/feature/profile/controller/profile_controller.dart index 591c0b9..a8cb198 100644 --- a/lib/feature/profile/controller/profile_controller.dart +++ b/lib/feature/profile/controller/profile_controller.dart @@ -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); } diff --git a/lib/feature/quiz_play/view/quiz_play_view.dart b/lib/feature/quiz_play/view/quiz_play_view.dart index 9b9b834..a08be3d 100644 --- a/lib/feature/quiz_play/view/quiz_play_view.dart +++ b/lib/feature/quiz_play/view/quiz_play_view.dart @@ -35,7 +35,6 @@ class QuizPlayView extends GetView { _buildQuestionText(), const SizedBox(height: 30), _buildAnswerSection(context), - Spacer(), _buildNextButton(context), ], ); diff --git a/pubspec.lock b/pubspec.lock index f1c0492..a43198a 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -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 diff --git a/pubspec.yaml b/pubspec.yaml index 8dd467e..6e079a7 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -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: