From 87400022de5e767377622f28d1a3de5709e0949d Mon Sep 17 00:00:00 2001 From: BallisticSwami Date: Tue, 20 Jul 2021 19:33:41 +0530 Subject: [PATCH] Changed placeholder and errorwidget for Cached Images and tweaked few animations --- lib/components/gen_code_tab.dart | 24 ++++++++-- lib/components/gen_para_tab.dart | 24 ++++++++-- lib/components/image_carousel.dart | 67 ++++++++++++++++++++++----- lib/components/image_viewer.dart | 22 +++++++-- lib/components/side_menu.dart | 1 + lib/screens/details_screen.dart | 12 +++-- lib/screens/fav_screen.dart | 5 +- lib/screens/font_details_screen.dart | 69 ++++++++++++++++++++++------ lib/screens/search_screen.dart | 3 +- lib/screens/splash_screen.dart | 24 ++++++---- 10 files changed, 197 insertions(+), 54 deletions(-) diff --git a/lib/components/gen_code_tab.dart b/lib/components/gen_code_tab.dart index ee4f18a..be686f2 100644 --- a/lib/components/gen_code_tab.dart +++ b/lib/components/gen_code_tab.dart @@ -181,10 +181,26 @@ class _CodeGenState extends State { ), ), ), - placeholder: (context, url) => SizedBox( - height: 50, - child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all( + color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all( + color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ), ); diff --git a/lib/components/gen_para_tab.dart b/lib/components/gen_para_tab.dart index 9a4e0a0..759fc67 100644 --- a/lib/components/gen_para_tab.dart +++ b/lib/components/gen_para_tab.dart @@ -286,10 +286,26 @@ class _ParaGenState extends State { ), ), ), - placeholder: (context, url) => SizedBox( - height: 50, - child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all( + color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all( + color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ), ); diff --git a/lib/components/image_carousel.dart b/lib/components/image_carousel.dart index 5913ab7..930f282 100644 --- a/lib/components/image_carousel.dart +++ b/lib/components/image_carousel.dart @@ -56,10 +56,24 @@ class ImageCarousel extends StatelessWidget { ), ), ), - placeholder: (context, url) => SizedBox( - height: 100, - child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ); }, @@ -106,10 +120,26 @@ class ImageCarousel extends StatelessWidget { ), ), ), - placeholder: (context, url) => SizedBox( - height: 100, - child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: + Border.all(color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: + Border.all(color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ), ); @@ -159,9 +189,24 @@ class HomeImageCarousel extends StatelessWidget { ), ), ), - placeholder: (context, url) => SizedBox( - height: 100, child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ); }, diff --git a/lib/components/image_viewer.dart b/lib/components/image_viewer.dart index 0e012f8..c2b40dd 100644 --- a/lib/components/image_viewer.dart +++ b/lib/components/image_viewer.dart @@ -118,10 +118,24 @@ class _ImageViewerState extends State ), ), ), - placeholder: (context, url) => SizedBox( - height: 100, - child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ), ), diff --git a/lib/components/side_menu.dart b/lib/components/side_menu.dart index 16dfc04..8928372 100644 --- a/lib/components/side_menu.dart +++ b/lib/components/side_menu.dart @@ -23,6 +23,7 @@ class _SideMenuState extends State { return Drawer( elevation: 2, child: SingleChildScrollView( + physics: BouncingScrollPhysics(), child: Padding( padding: EdgeInsets.only(bottom: 30.0), child: Column( diff --git a/lib/screens/details_screen.dart b/lib/screens/details_screen.dart index 18080d4..9292077 100644 --- a/lib/screens/details_screen.dart +++ b/lib/screens/details_screen.dart @@ -91,7 +91,8 @@ class _DetailsScreenState extends State { width: 60, height: 60, child: CircularProgressIndicator( - strokeWidth: 4.0, + color: Colors.black12, + strokeWidth: 2, ), )), ); @@ -115,7 +116,8 @@ class _DetailsScreenState extends State { width: 60, height: 60, child: CircularProgressIndicator( - strokeWidth: 4.0, + color: Colors.black12, + strokeWidth: 2, ), )), ); @@ -138,7 +140,8 @@ class _DetailsScreenState extends State { width: 60, height: 60, child: CircularProgressIndicator( - strokeWidth: 4.0, + color: Colors.black12, + strokeWidth: 2, ), )), ); @@ -171,7 +174,8 @@ class _DetailsScreenState extends State { width: 60, height: 60, child: CircularProgressIndicator( - strokeWidth: 4.0, + color: Colors.black12, + strokeWidth: 2, ), )), ); diff --git a/lib/screens/fav_screen.dart b/lib/screens/fav_screen.dart index ab14836..628d18a 100644 --- a/lib/screens/fav_screen.dart +++ b/lib/screens/fav_screen.dart @@ -23,7 +23,7 @@ class _FavScreenState extends State { late ScrollController _scrollController; - @override + @override void initState() { _scrollController = ScrollController(); super.initState(); @@ -108,7 +108,8 @@ class _FavScreenState extends State { width: 60, height: 60, child: CircularProgressIndicator( - strokeWidth: 4.0, + color: Colors.black12, + strokeWidth: 2, ), )), ); diff --git a/lib/screens/font_details_screen.dart b/lib/screens/font_details_screen.dart index 089e73e..9517c59 100644 --- a/lib/screens/font_details_screen.dart +++ b/lib/screens/font_details_screen.dart @@ -34,7 +34,7 @@ class _FontDetailsScreenState extends State Future onLikeTap(bool x) { var storageController = Get.find(); if (isFav.value) { - storageController.removeFavorite(widget.font); + storageController.removeFavorite(widget.font); } else { storageController.addFavorite(widget.font); } @@ -82,14 +82,14 @@ class _FontDetailsScreenState extends State highlightElevation: 0, shape: CircleBorder(side: BorderSide(color: Colors.black12, width: 1)), child: Obx(() => Padding( - padding: const EdgeInsets.only(left: 3), - child: LikeButton( + padding: const EdgeInsets.only(left: 3), + child: LikeButton( size: 20, animationDuration: Duration(milliseconds: 500), isLiked: isFav.value, onTap: onLikeTap, ), - )), + )), onPressed: () {}, ), body: SafeArea( @@ -98,7 +98,9 @@ class _FontDetailsScreenState extends State child: SingleChildScrollView( physics: BouncingScrollPhysics(), child: Padding( - padding: Responsive.isMobile(context) ? EdgeInsets.all(18.0) : EdgeInsets.all(40.0), + padding: Responsive.isMobile(context) + ? EdgeInsets.all(18.0) + : EdgeInsets.all(40.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ @@ -171,7 +173,10 @@ class _FontDetailsScreenState extends State return Container( height: 100, width: 100, - child: Center(child: CircularProgressIndicator()), + child: Center(child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + )), ); }), SizedBox(height: 20), @@ -209,10 +214,16 @@ class _FontDetailsScreenState extends State return Container( height: 100, width: 100, - child: Center(child: CircularProgressIndicator()), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + )), ); }), - SizedBox(height: 50,) + SizedBox( + height: 50, + ) ], ), ), @@ -270,9 +281,24 @@ class GenImage extends StatelessWidget { ), ), ), - placeholder: (context, url) => SizedBox( - height: 100, child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ), ); @@ -327,9 +353,24 @@ class GenImageCode extends StatelessWidget { ), ), ), - placeholder: (context, url) => SizedBox( - height: 100, child: Center(child: CircularProgressIndicator())), - errorWidget: (context, url, error) => Icon(Icons.error), + placeholder: (context, url) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: CircularProgressIndicator( + color: Colors.black12, + strokeWidth: 2, + ))), + errorWidget: (context, url, error) => Container( + decoration: BoxDecoration( + borderRadius: MyTheme.borderRadius, + border: Border.all(color: Colors.black12, width: 1)), + child: Center( + child: Icon( + Icons.error, + color: Colors.black12, + ))), ), ), ); diff --git a/lib/screens/search_screen.dart b/lib/screens/search_screen.dart index 6c5cd0a..6b8f353 100644 --- a/lib/screens/search_screen.dart +++ b/lib/screens/search_screen.dart @@ -132,7 +132,8 @@ class _SearchScreenState extends State { width: 60, height: 60, child: CircularProgressIndicator( - strokeWidth: 4.0, + color: Colors.black12, + strokeWidth: 2, ), )), ); diff --git a/lib/screens/splash_screen.dart b/lib/screens/splash_screen.dart index f813e46..7485758 100644 --- a/lib/screens/splash_screen.dart +++ b/lib/screens/splash_screen.dart @@ -25,7 +25,7 @@ class _SplashScreenState extends State ); late final Animation _offsetAnimation = Tween( begin: Offset.zero, - end: const Offset(-1.61, 0.0), + end: const Offset(-1.4, 0.0), ).animate(CurvedAnimation( parent: _controller, curve: Curves.easeOutQuart, @@ -62,14 +62,14 @@ class _SplashScreenState extends State Get.off( () => BaseScreen(), transition: Transition.zoom, - duration: Duration(milliseconds: 900), + duration: Duration(milliseconds: 500), curve: Curves.easeOutQuad, ); } else { Get.off( () => NoInternetScreen(), transition: Transition.zoom, - duration: Duration(milliseconds: 900), + duration: Duration(milliseconds: 500), curve: Curves.easeOutBack, ); } @@ -118,7 +118,7 @@ class _SplashScreenState extends State ), ), Padding( - padding: const EdgeInsets.only(left: 30), + padding: const EdgeInsets.only(left: 70), child: AnimatedOpacity( opacity: _textOpacity, curve: Curves.easeIn, @@ -153,10 +153,12 @@ class _SplashScreenState extends State width: 40, child: AnimatedTextKit( repeatForever: true, + pause: Duration(milliseconds: 400), animatedTexts: [ - TyperAnimatedText("."), - TyperAnimatedText(".."), - TyperAnimatedText("..."), + // TyperAnimatedText("."), + // TyperAnimatedText(".."), + TyperAnimatedText("...", + speed: Duration(milliseconds: 400)), ], ), ), @@ -180,10 +182,12 @@ class _SplashScreenState extends State width: 40, child: AnimatedTextKit( repeatForever: true, + pause: Duration(milliseconds: 400), animatedTexts: [ - TyperAnimatedText("."), - TyperAnimatedText(".."), - TyperAnimatedText("..."), + // TyperAnimatedText("."), + // TyperAnimatedText(".."), + TyperAnimatedText("...", + speed: Duration(milliseconds: 400)), ], ), ),