diff --git a/README.md b/README.md index cc61de1..43c1518 100644 --- a/README.md +++ b/README.md @@ -1,31 +1,29 @@ -# Flutter Complete e-commerce Application UI Design and Animation +## Flutter e-commerce Application UI Design and Animation -Flutter Complete e-commerce Application UI Design and Animation - day 16 Flutter Animation and UI Design. +A part of #flutter100daysofcode. Let's create a beautiful and animated e-commerce UI with Flutter. -This repository is a part of the 100-day design in Flutter. +[Watch it on Youtube](https://youtu.be/_10i7_xsthM) -In this video we use, Flutter Animation, Fade, BoxShadow, TextField, Gradient, LinearGradient and so on in the one-speed video. -[Youtube Video](https://youtu.be/_10i7_xsthM) +## Previous Designs +[Checkout my Youtube channel](https://youtube.com/afgprogrammer) -## Last Design -- [UI Design- Day 1](https://github.com/afgprogrammer/flutter-inspiration-app-ui) -- [UI Design- Day 2](https://github.com/afgprogrammer/Flutter-trip-app-ui) -- [UI Design- Day 3](https://github.com/afgprogrammer/Flutter-food-delivery-app-ui) -- [UI Design- Day 4](https://github.com/afgprogrammer/Flutter-actors-profile-app-ui) -- [UI Design- Day 5](https://github.com/afgprogrammer/Flutter-ripple-map-application) -- [UI Design- Day 6](https://github.com/afgprogrammer/Flutter-page-transition-animation) -- [UI Design- Day 7](https://github.com/afgprogrammer/Flutter-button-animation) -- [UI Design- Day 8](https://github.com/afgprogrammer/Flutter-Splash-Screen-Animation) -- [UI Design- Day 9](https://github.com/afgprogrammer/Flutter-Party-Event-Application) -- [UI Design- Day 10](https://github.com/afgprogrammer/Flutter-GridView-Example-UI) -- [UI Design- Day 11](https://github.com/afgprogrammer/Flutter-Travel-Application) -- [UI Design- Day 12](https://github.com/afgprogrammer/Flutter-Login-Page-UI) -- [UI Design- Day 13](https://github.com/afgprogrammer/Flutter-Login-Page-Design) -- [UI Design- Day 14](https://github.com/afgprogrammer/Flutter-Login-Page-3) -- [UI Design- Day 15](https://github.com/afgprogrammer/Flutter-Shoes-Shop-App) +
+ +## Development Setup +Clone the repository and run the following commands: +``` +flutter pub get +flutter run +``` ## ScreenShot   +## Links + +* [Website](https://afgprogrammer.com) +* [Youtube channel](https://youtube.com/afgprogrammer) +* [Twitter](https://twitter.com/afgprogrammer) +* [Instagram](https://instagram.com/afgprogrammer) \ No newline at end of file diff --git a/assets/images/background.jpg b/assets/images/background.jpg index 6c56edb..b476457 100644 Binary files a/assets/images/background.jpg and b/assets/images/background.jpg differ diff --git a/assets/images/beauty-1.jpg b/assets/images/beauty-1.jpg index 4c66513..c5cbf78 100644 Binary files a/assets/images/beauty-1.jpg and b/assets/images/beauty-1.jpg differ diff --git a/assets/images/beauty.jpg b/assets/images/beauty.jpg index 4b583a1..4930bb8 100644 Binary files a/assets/images/beauty.jpg and b/assets/images/beauty.jpg differ diff --git a/assets/images/clothes-1.jpg b/assets/images/clothes-1.jpg index 100af92..cbdea44 100644 Binary files a/assets/images/clothes-1.jpg and b/assets/images/clothes-1.jpg differ diff --git a/assets/images/clothes.jpg b/assets/images/clothes.jpg index 1e8c2c7..3b37e1a 100644 Binary files a/assets/images/clothes.jpg and b/assets/images/clothes.jpg differ diff --git a/assets/images/glass.jpg b/assets/images/glass.jpg index 2ca5ed9..5785163 100644 Binary files a/assets/images/glass.jpg and b/assets/images/glass.jpg differ diff --git a/assets/images/perfume.jpg b/assets/images/perfume.jpg index 1d15c89..f8297dc 100644 Binary files a/assets/images/perfume.jpg and b/assets/images/perfume.jpg differ diff --git a/assets/images/person.jpg b/assets/images/person.jpg index ac53bd7..ecc5f70 100644 Binary files a/assets/images/person.jpg and b/assets/images/person.jpg differ diff --git a/assets/images/splash-1.jpg b/assets/images/splash-1.jpg index 4f8d38f..216d95a 100644 Binary files a/assets/images/splash-1.jpg and b/assets/images/splash-1.jpg differ diff --git a/assets/images/splash.jpg b/assets/images/splash.jpg index 3ab144f..e73d8a3 100644 Binary files a/assets/images/splash.jpg and b/assets/images/splash.jpg differ diff --git a/assets/images/tech-1.jpg b/assets/images/tech-1.jpg index 37b221f..d85b059 100644 Binary files a/assets/images/tech-1.jpg and b/assets/images/tech-1.jpg differ diff --git a/assets/images/tech.jpg b/assets/images/tech.jpg index 0486509..d74634d 100644 Binary files a/assets/images/tech.jpg and b/assets/images/tech.jpg differ diff --git a/assets/images/watch.jpg b/assets/images/watch.jpg index b28ba62..94f0eae 100644 Binary files a/assets/images/watch.jpg and b/assets/images/watch.jpg differ diff --git a/ios/Flutter/AppFrameworkInfo.plist b/ios/Flutter/AppFrameworkInfo.plist index 6b4c0f7..4f8d4d2 100644 --- a/ios/Flutter/AppFrameworkInfo.plist +++ b/ios/Flutter/AppFrameworkInfo.plist @@ -21,6 +21,6 @@ CFBundleVersion 1.0 MinimumOSVersion - 8.0 + 11.0 diff --git a/ios/Runner.xcodeproj/project.pbxproj b/ios/Runner.xcodeproj/project.pbxproj index bdb0755..8943078 100644 --- a/ios/Runner.xcodeproj/project.pbxproj +++ b/ios/Runner.xcodeproj/project.pbxproj @@ -3,17 +3,13 @@ archiveVersion = 1; classes = { }; - objectVersion = 46; + objectVersion = 54; objects = { /* Begin PBXBuildFile section */ 1498D2341E8E89220040F4C2 /* GeneratedPluginRegistrant.m in Sources */ = {isa = PBXBuildFile; fileRef = 1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */; }; 3B3967161E833CAA004F5970 /* AppFrameworkInfo.plist in Resources */ = {isa = PBXBuildFile; fileRef = 3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */; }; - 3B80C3941E831B6300D905FE /* App.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 3B80C3931E831B6300D905FE /* App.framework */; }; - 3B80C3951E831B6300D905FE /* App.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 3B80C3931E831B6300D905FE /* App.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; }; 74858FAF1ED2DC5600515810 /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74858FAE1ED2DC5600515810 /* AppDelegate.swift */; }; - 9705A1C61CF904A100538489 /* Flutter.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 9740EEBA1CF902C7004384FC /* Flutter.framework */; }; - 9705A1C71CF904A300538489 /* Flutter.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 9740EEBA1CF902C7004384FC /* Flutter.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; }; 9740EEB41CF90195004384FC /* Debug.xcconfig in Resources */ = {isa = PBXBuildFile; fileRef = 9740EEB21CF90195004384FC /* Debug.xcconfig */; }; 97C146FC1CF9000F007C117D /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FA1CF9000F007C117D /* Main.storyboard */; }; 97C146FE1CF9000F007C117D /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FD1CF9000F007C117D /* Assets.xcassets */; }; @@ -27,8 +23,6 @@ dstPath = ""; dstSubfolderSpec = 10; files = ( - 3B80C3951E831B6300D905FE /* App.framework in Embed Frameworks */, - 9705A1C71CF904A300538489 /* Flutter.framework in Embed Frameworks */, ); name = "Embed Frameworks"; runOnlyForDeploymentPostprocessing = 0; @@ -39,13 +33,11 @@ 1498D2321E8E86230040F4C2 /* GeneratedPluginRegistrant.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = GeneratedPluginRegistrant.h; sourceTree = ""; }; 1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = GeneratedPluginRegistrant.m; sourceTree = ""; }; 3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = AppFrameworkInfo.plist; path = Flutter/AppFrameworkInfo.plist; sourceTree = ""; }; - 3B80C3931E831B6300D905FE /* App.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = App.framework; path = Flutter/App.framework; sourceTree = ""; }; 74858FAD1ED2DC5600515810 /* Runner-Bridging-Header.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = "Runner-Bridging-Header.h"; sourceTree = ""; }; 74858FAE1ED2DC5600515810 /* AppDelegate.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = ""; }; 7AFA3C8E1D35360C0083082E /* Release.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; name = Release.xcconfig; path = Flutter/Release.xcconfig; sourceTree = ""; }; 9740EEB21CF90195004384FC /* Debug.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; name = Debug.xcconfig; path = Flutter/Debug.xcconfig; sourceTree = ""; }; 9740EEB31CF90195004384FC /* Generated.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; name = Generated.xcconfig; path = Flutter/Generated.xcconfig; sourceTree = ""; }; - 9740EEBA1CF902C7004384FC /* Flutter.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = Flutter.framework; path = Flutter/Flutter.framework; sourceTree = ""; }; 97C146EE1CF9000F007C117D /* Runner.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = Runner.app; sourceTree = BUILT_PRODUCTS_DIR; }; 97C146FB1CF9000F007C117D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = ""; }; 97C146FD1CF9000F007C117D /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = ""; }; @@ -58,8 +50,6 @@ isa = PBXFrameworksBuildPhase; buildActionMask = 2147483647; files = ( - 9705A1C61CF904A100538489 /* Flutter.framework in Frameworks */, - 3B80C3941E831B6300D905FE /* App.framework in Frameworks */, ); runOnlyForDeploymentPostprocessing = 0; }; @@ -69,9 +59,7 @@ 9740EEB11CF90186004384FC /* Flutter */ = { isa = PBXGroup; children = ( - 3B80C3931E831B6300D905FE /* App.framework */, 3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */, - 9740EEBA1CF902C7004384FC /* Flutter.framework */, 9740EEB21CF90195004384FC /* Debug.xcconfig */, 7AFA3C8E1D35360C0083082E /* Release.xcconfig */, 9740EEB31CF90195004384FC /* Generated.xcconfig */, @@ -148,7 +136,7 @@ 97C146E61CF9000F007C117D /* Project object */ = { isa = PBXProject; attributes = { - LastUpgradeCheck = 1020; + LastUpgradeCheck = 1430; ORGANIZATIONNAME = "The Chromium Authors"; TargetAttributes = { 97C146ED1CF9000F007C117D = { @@ -193,20 +181,23 @@ /* Begin PBXShellScriptBuildPhase section */ 3B06AD1E1E4923F5004D2608 /* Thin Binary */ = { isa = PBXShellScriptBuildPhase; + alwaysOutOfDate = 1; buildActionMask = 2147483647; files = ( ); inputPaths = ( + "${TARGET_BUILD_DIR}/${INFOPLIST_PATH}", ); name = "Thin Binary"; outputPaths = ( ); runOnlyForDeploymentPostprocessing = 0; shellPath = /bin/sh; - shellScript = "/bin/sh \"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh\" thin"; + shellScript = "/bin/sh \"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh\" embed_and_thin"; }; 9740EEB61CF901F6004384FC /* Run Script */ = { isa = PBXShellScriptBuildPhase; + alwaysOutOfDate = 1; buildActionMask = 2147483647; files = ( ); @@ -255,7 +246,6 @@ /* Begin XCBuildConfiguration section */ 249021D3217E4FDB00AE95B9 /* Profile */ = { isa = XCBuildConfiguration; - baseConfigurationReference = 7AFA3C8E1D35360C0083082E /* Release.xcconfig */; buildSettings = { ALWAYS_SEARCH_USER_PATHS = NO; CLANG_ANALYZER_NONNULL = YES; @@ -295,7 +285,7 @@ GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; GCC_WARN_UNUSED_FUNCTION = YES; GCC_WARN_UNUSED_VARIABLE = YES; - IPHONEOS_DEPLOYMENT_TARGET = 8.0; + IPHONEOS_DEPLOYMENT_TARGET = 11.0; MTL_ENABLE_DEBUG_INFO = NO; SDKROOT = iphoneos; TARGETED_DEVICE_FAMILY = "1,2"; @@ -331,7 +321,6 @@ }; 97C147031CF9000F007C117D /* Debug */ = { isa = XCBuildConfiguration; - baseConfigurationReference = 9740EEB21CF90195004384FC /* Debug.xcconfig */; buildSettings = { ALWAYS_SEARCH_USER_PATHS = NO; CLANG_ANALYZER_NONNULL = YES; @@ -377,7 +366,7 @@ GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; GCC_WARN_UNUSED_FUNCTION = YES; GCC_WARN_UNUSED_VARIABLE = YES; - IPHONEOS_DEPLOYMENT_TARGET = 8.0; + IPHONEOS_DEPLOYMENT_TARGET = 11.0; MTL_ENABLE_DEBUG_INFO = YES; ONLY_ACTIVE_ARCH = YES; SDKROOT = iphoneos; @@ -387,7 +376,6 @@ }; 97C147041CF9000F007C117D /* Release */ = { isa = XCBuildConfiguration; - baseConfigurationReference = 7AFA3C8E1D35360C0083082E /* Release.xcconfig */; buildSettings = { ALWAYS_SEARCH_USER_PATHS = NO; CLANG_ANALYZER_NONNULL = YES; @@ -427,7 +415,7 @@ GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE; GCC_WARN_UNUSED_FUNCTION = YES; GCC_WARN_UNUSED_VARIABLE = YES; - IPHONEOS_DEPLOYMENT_TARGET = 8.0; + IPHONEOS_DEPLOYMENT_TARGET = 11.0; MTL_ENABLE_DEBUG_INFO = NO; SDKROOT = iphoneos; SWIFT_OPTIMIZATION_LEVEL = "-Owholemodule"; diff --git a/ios/Runner.xcodeproj/project.xcworkspace/contents.xcworkspacedata b/ios/Runner.xcodeproj/project.xcworkspace/contents.xcworkspacedata index 1d526a1..919434a 100644 --- a/ios/Runner.xcodeproj/project.xcworkspace/contents.xcworkspacedata +++ b/ios/Runner.xcodeproj/project.xcworkspace/contents.xcworkspacedata @@ -2,6 +2,6 @@ + location = "self:"> diff --git a/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme b/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme index a28140c..b52b2e6 100644 --- a/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme +++ b/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme @@ -1,6 +1,6 @@ UIViewControllerBasedStatusBarAppearance + CADisableMinimumFrameDurationOnPhone + + UIApplicationSupportsIndirectInputEvents + diff --git a/lib/Animation/FadeAnimation.dart b/lib/Animation/FadeAnimation.dart deleted file mode 100644 index 055a9af..0000000 --- a/lib/Animation/FadeAnimation.dart +++ /dev/null @@ -1,33 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:simple_animations/simple_animations.dart'; - -class FadeAnimation extends StatelessWidget { - final double delay; - final Widget child; - - FadeAnimation(this.delay, this.child); - - @override - Widget build(BuildContext context) { - final tween = MultiTrackTween([ - Track("opacity").add(Duration(milliseconds: 500), Tween(begin: 0.0, end: 1.0)), - Track("translateY").add( - Duration(milliseconds: 500), Tween(begin: -30.0, end: 0.0), - curve: Curves.easeOut) - ]); - - return ControlledAnimation( - delay: Duration(milliseconds: (500 * delay).round()), - duration: tween.duration, - tween: tween, - child: child, - builderWithChild: (context, child, animation) => Opacity( - opacity: animation["opacity"], - child: Transform.translate( - offset: Offset(0, animation["translateY"]), - child: child - ), - ), - ); - } -} \ No newline at end of file diff --git a/lib/Pages/CategoryPage.dart b/lib/Pages/CategoryPage.dart index 92bc87e..b44b3b8 100644 --- a/lib/Pages/CategoryPage.dart +++ b/lib/Pages/CategoryPage.dart @@ -1,12 +1,12 @@ -import 'package:day16_shopping/Animation/FadeAnimation.dart'; +import 'package:animate_do/animate_do.dart'; import 'package:flutter/material.dart'; class CategoryPage extends StatefulWidget { - final String title; - final String image; - final String tag; + final String? title; + final String? image; + final String? tag; - const CategoryPage({Key key, this.title, this.image, this.tag}) : super(key: key); + const CategoryPage({Key? key, this.title, this.image, this.tag}) : super(key: key); @override _CategoryPageState createState() => _CategoryPageState(); @@ -21,13 +21,13 @@ class _CategoryPageState extends State { child: Column( children: [ Hero( - tag: widget.tag, + tag: widget.tag!, child: Material( child: Container( - height: 250, + height: 360, decoration: BoxDecoration( image: DecorationImage( - image: AssetImage(widget.image), + image: AssetImage(widget.image!), fit: BoxFit.cover ) ), @@ -57,13 +57,13 @@ class _CategoryPageState extends State { Row( mainAxisAlignment: MainAxisAlignment.end, children: [ - FadeAnimation(1.2, IconButton( + FadeInUp(duration: Duration(milliseconds: 1200), child: IconButton( icon: Icon(Icons.search, color: Colors.white,), onPressed: () {}, )), - FadeAnimation(1.2, IconButton( + FadeInUp(duration: Duration(milliseconds: 1200), child: IconButton( icon: Icon(Icons.favorite, color: Colors.white,), onPressed: () {}, )), - FadeAnimation(1.3, IconButton( + FadeInUp(duration: Duration(milliseconds: 1300), child: IconButton( icon: Icon(Icons.shopping_cart, color: Colors.white,), onPressed: () {}, )), ], @@ -73,7 +73,7 @@ class _CategoryPageState extends State { SizedBox( height: 40, ), - FadeAnimation(1.2, Text(widget.title, style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 40),)) + FadeInUp(duration: Duration(milliseconds: 1200), child: Text(widget.title!, style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 40),)) ], ), ), @@ -84,7 +84,7 @@ class _CategoryPageState extends State { padding: EdgeInsets.all(20), child: Column( children: [ - FadeAnimation(1.4, Row( + FadeInUp(duration: Duration(milliseconds: 1400), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text("New Product", style: TextStyle(color: Colors.black, fontSize: 18, fontWeight: FontWeight.bold),), @@ -98,11 +98,11 @@ class _CategoryPageState extends State { ], )), SizedBox(height: 20,), - FadeAnimation(1.5, makeProduct(image: 'assets/images/beauty-1.jpg', title: 'Beauty', price: '100\$')), - FadeAnimation(1.6, makeProduct(image: 'assets/images/clothes-1.jpg', title: 'Clothes', price: '100\$')), - FadeAnimation(1.7, makeProduct(image: 'assets/images/glass.jpg', title: 'Glass', price: '100\$')), - FadeAnimation(1.8, makeProduct(image: 'assets/images/perfume.jpg', title: 'Perfume', price: '100\$')), - FadeAnimation(1.9, makeProduct(image: 'assets/images/person.jpg', title: 'Person', price: '100\$')), + FadeInUp(duration: Duration(milliseconds: 1500), child: makeProduct(image: 'assets/images/beauty-1.jpg', title: 'Beauty', price: '100\$')), + FadeInUp(duration: Duration(milliseconds: 1600), child: makeProduct(image: 'assets/images/clothes-1.jpg', title: 'Clothes', price: '100\$')), + FadeInUp(duration: Duration(milliseconds: 1700), child: makeProduct(image: 'assets/images/glass.jpg', title: 'Glass', price: '100\$')), + FadeInUp(duration: Duration(milliseconds: 1800), child: makeProduct(image: 'assets/images/perfume.jpg', title: 'Perfume', price: '100\$')), + FadeInUp(duration: Duration(milliseconds: 1900), child: makeProduct(image: 'assets/images/person.jpg', title: 'Person', price: '100\$')), ], ), ) @@ -140,7 +140,7 @@ class _CategoryPageState extends State { crossAxisAlignment: CrossAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - FadeAnimation(1.4, Align( + FadeInUp(duration: Duration(milliseconds: 1400), child: Align( alignment: Alignment.topRight, child: Icon(Icons.favorite_border, color: Colors.white,), )), @@ -151,11 +151,11 @@ class _CategoryPageState extends State { Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - FadeAnimation(1.5, Text(title, style: TextStyle(color: Colors.white, fontSize: 20),)), - FadeAnimation(1.6, Text(price, style: TextStyle(color: Colors.white, fontSize: 30, fontWeight: FontWeight.bold),)), + FadeInUp(duration: Duration(milliseconds: 1500), child: Text(title, style: TextStyle(color: Colors.white, fontSize: 20),)), + FadeInUp(duration: Duration(milliseconds: 1500), child: Text(price, style: TextStyle(color: Colors.white, fontSize: 30, fontWeight: FontWeight.bold),)), ], ), - FadeAnimation(2, Container( + FadeInUp(duration: Duration(milliseconds: 2000), child: Container( width: 40, height: 40, margin: EdgeInsets.only(bottom: 10), diff --git a/lib/Pages/ShopPage.dart b/lib/Pages/ShopPage.dart index 48ca75e..c50f717 100644 --- a/lib/Pages/ShopPage.dart +++ b/lib/Pages/ShopPage.dart @@ -1,4 +1,4 @@ -import 'package:day16_shopping/Animation/FadeAnimation.dart'; +import 'package:animate_do/animate_do.dart'; import 'package:day16_shopping/Pages/CategoryPage.dart'; import 'package:flutter/material.dart'; @@ -14,7 +14,7 @@ class _ShopPageState extends State { body: SingleChildScrollView( child: Column( children: [ - FadeAnimation(1, Container( + FadeInUp(duration: Duration(milliseconds: 1000), child: Container( height: 500, decoration: BoxDecoration( image: DecorationImage( @@ -41,10 +41,10 @@ class _ShopPageState extends State { Row( mainAxisAlignment: MainAxisAlignment.end, children: [ - FadeAnimation(1.2, IconButton( + FadeInUp(duration: Duration(milliseconds: 1200), child: IconButton( icon: Icon(Icons.favorite, color: Colors.white,), onPressed: () {}, )), - FadeAnimation(1.3, IconButton( + FadeInUp(duration: Duration(milliseconds: 1300), child: IconButton( icon: Icon(Icons.shopping_cart, color: Colors.white,), onPressed: () {}, )), ], @@ -54,9 +54,9 @@ class _ShopPageState extends State { child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - FadeAnimation(1.5, Text("Our New Products", style: TextStyle(color: Colors.white, fontSize: 30, fontWeight: FontWeight.bold),)), + FadeInUp(duration: Duration(milliseconds: 1500), child: Text("Our New Products", style: TextStyle(color: Colors.white, fontSize: 30, fontWeight: FontWeight.bold),)), SizedBox(height: 15,), - FadeAnimation(1.7, Row( + FadeInUp(duration: Duration(milliseconds: 1700), child: Row( children: [ Text("VIEW MORE", style: TextStyle(color: Colors.white, fontWeight: FontWeight.w600),), SizedBox(width: 5,), @@ -72,7 +72,7 @@ class _ShopPageState extends State { ), ), )), - FadeAnimation(1.4, Container( + FadeInUp(duration: Duration(milliseconds: 1400), child: Container( padding: EdgeInsets.all(20), child: Column( children: [ @@ -117,7 +117,8 @@ class _ShopPageState extends State { makeBestCategory(image: 'assets/images/glass.jpg', title: 'Glass'), ], ), - ) + ), + SizedBox(height: 80,), ], ), )) diff --git a/lib/main.dart b/lib/main.dart index 1e12ac9..4a997e5 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,4 +1,4 @@ -import 'package:day16_shopping/Animation/FadeAnimation.dart'; +import 'package:animate_do/animate_do.dart'; import 'package:day16_shopping/Pages/ShopPage.dart'; import 'package:flutter/material.dart'; import 'package:page_transition/page_transition.dart'; @@ -16,8 +16,8 @@ class HomePage extends StatefulWidget { } class _HomePageState extends State with TickerProviderStateMixin { - AnimationController _scaleController; - Animation _scaleAnimation; + late AnimationController _scaleController; + late Animation _scaleAnimation; bool hide = false; @@ -69,9 +69,9 @@ class _HomePageState extends State with TickerProviderStateMixin { crossAxisAlignment: CrossAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.end, children: [ - FadeAnimation(1, Text("Brand New Perspective", style: TextStyle(color: Colors.white, fontSize: 40, fontWeight: FontWeight.bold),)), + FadeInUp(duration: Duration(milliseconds: 1000), child: Text("Brand New Perspective", style: TextStyle(color: Colors.white, fontSize: 40, fontWeight: FontWeight.bold),)), SizedBox(height: 20,), - FadeAnimation(1.3, Text("Let's start with our summer collection.", style: TextStyle(color: Colors.white, fontSize: 20),)), + FadeInUp(duration: Duration(milliseconds: 1300), child: Text("Let's start with our summer collection.", style: TextStyle(color: Colors.white, fontSize: 20),)), SizedBox(height: 100,), InkWell( onTap: () { @@ -84,7 +84,7 @@ class _HomePageState extends State with TickerProviderStateMixin { animation: _scaleController, builder: (context, child) => Transform.scale( scale: _scaleAnimation.value, - child: FadeAnimation(1.5, Container( + child: FadeInUp(duration: Duration(milliseconds: 1500), child: Container( height: 50, decoration: BoxDecoration( color: Colors.white, @@ -98,7 +98,7 @@ class _HomePageState extends State with TickerProviderStateMixin { ), ), SizedBox(height: 20,), - FadeAnimation(1.7, Container( + FadeInUp(duration: Duration(milliseconds: 1700), child: Container( height: 50, decoration: BoxDecoration( border: Border.all(color: Colors.white), diff --git a/pubspec.lock b/pubspec.lock index 7f65dc4..6901e4c 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -1,41 +1,70 @@ # Generated by pub # See https://dart.dev/tools/pub/glossary#lockfile packages: + animate_do: + dependency: "direct main" + description: + name: animate_do + sha256: "91b3e0306ba2096c7a7e1ee1ba96f491e25e92034c215f4bf8de6a7251c4bef1" + url: "https://pub.dev" + source: hosted + version: "3.1.2" async: dependency: transitive description: name: async - url: "https://pub.dartlang.org" + sha256: "947bfcf187f74dbc5e146c9eb9c0f10c9f8b30743e341481c1e2ed3ecc18c20c" + url: "https://pub.dev" source: hosted - version: "2.3.0" + version: "2.11.0" boolean_selector: dependency: transitive description: name: boolean_selector - url: "https://pub.dartlang.org" + sha256: "6cfb5af12253eaf2b368f07bacc5a80d1301a071c73360d746b7f2e32d762c66" + url: "https://pub.dev" source: hosted - version: "1.0.5" - charcode: + version: "2.1.1" + characters: dependency: transitive description: - name: charcode - url: "https://pub.dartlang.org" + name: characters + sha256: "04a925763edad70e8443c99234dc3328f442e811f1d8fd1a72f1c8ad0f69a605" + url: "https://pub.dev" source: hosted - version: "1.1.2" + version: "1.3.0" + clock: + dependency: transitive + description: + name: clock + sha256: cb6d7f03e1de671e34607e909a7213e31d7752be4fb66a86d29fe1eb14bfb5cf + url: "https://pub.dev" + source: hosted + version: "1.1.1" collection: dependency: transitive description: name: collection - url: "https://pub.dartlang.org" + sha256: f092b211a4319e98e5ff58223576de6c2803db36221657b46c82574721240687 + url: "https://pub.dev" source: hosted - version: "1.14.11" + version: "1.17.2" cupertino_icons: dependency: "direct main" description: name: cupertino_icons - url: "https://pub.dartlang.org" + sha256: d57953e10f9f8327ce64a508a355f0b1ec902193f66288e8cb5070e7c47eeb2d + url: "https://pub.dev" source: hosted - version: "0.1.2" + version: "1.0.6" + fake_async: + dependency: transitive + description: + name: fake_async + sha256: "511392330127add0b769b75a987850d136345d9227c6b94c96a04cf4a391bf78" + url: "https://pub.dev" + source: hosted + version: "1.3.1" flutter: dependency: "direct main" description: flutter @@ -50,51 +79,42 @@ packages: dependency: transitive description: name: matcher - url: "https://pub.dartlang.org" + sha256: "1803e76e6653768d64ed8ff2e1e67bea3ad4b923eb5c56a295c3e634bad5960e" + url: "https://pub.dev" + source: hosted + version: "0.12.16" + material_color_utilities: + dependency: transitive + description: + name: material_color_utilities + sha256: "9528f2f296073ff54cb9fee677df673ace1218163c3bc7628093e7eed5203d41" + url: "https://pub.dev" source: hosted - version: "0.12.5" + version: "0.5.0" meta: dependency: transitive description: name: meta - url: "https://pub.dartlang.org" + sha256: "3c74dbf8763d36539f114c799d8a2d87343b5067e9d796ca22b5eb8437090ee3" + url: "https://pub.dev" source: hosted - version: "1.1.7" + version: "1.9.1" page_transition: dependency: "direct main" description: name: page_transition - url: "https://pub.dartlang.org" + sha256: dee976b1f23de9bbef5cd512fe567e9f6278caee11f5eaca9a2115c19dc49ef6 + url: "https://pub.dev" source: hosted - version: "1.1.4" + version: "2.1.0" path: dependency: transitive description: name: path - url: "https://pub.dartlang.org" + sha256: "8829d8a55c13fc0e37127c29fedf290c102f4e40ae94ada574091fe0ff96c917" + url: "https://pub.dev" source: hosted - version: "1.6.4" - pedantic: - dependency: transitive - description: - name: pedantic - url: "https://pub.dartlang.org" - source: hosted - version: "1.8.0+1" - quiver: - dependency: transitive - description: - name: quiver - url: "https://pub.dartlang.org" - source: hosted - version: "2.0.5" - simple_animations: - dependency: "direct main" - description: - name: simple_animations - url: "https://pub.dartlang.org" - source: hosted - version: "1.3.3" + version: "1.8.3" sky_engine: dependency: transitive description: flutter @@ -104,57 +124,65 @@ packages: dependency: transitive description: name: source_span - url: "https://pub.dartlang.org" + sha256: "53e943d4206a5e30df338fd4c6e7a077e02254531b138a15aec3bd143c1a8b3c" + url: "https://pub.dev" source: hosted - version: "1.5.5" + version: "1.10.0" stack_trace: dependency: transitive description: name: stack_trace - url: "https://pub.dartlang.org" + sha256: c3c7d8edb15bee7f0f74debd4b9c5f3c2ea86766fe4178eb2a18eb30a0bdaed5 + url: "https://pub.dev" source: hosted - version: "1.9.3" + version: "1.11.0" stream_channel: dependency: transitive description: name: stream_channel - url: "https://pub.dartlang.org" + sha256: "83615bee9045c1d322bbbd1ba209b7a749c2cbcdcb3fdd1df8eb488b3279c1c8" + url: "https://pub.dev" source: hosted - version: "2.0.0" + version: "2.1.1" string_scanner: dependency: transitive description: name: string_scanner - url: "https://pub.dartlang.org" + sha256: "556692adab6cfa87322a115640c11f13cb77b3f076ddcc5d6ae3c20242bedcde" + url: "https://pub.dev" source: hosted - version: "1.0.5" + version: "1.2.0" term_glyph: dependency: transitive description: name: term_glyph - url: "https://pub.dartlang.org" + sha256: a29248a84fbb7c79282b40b8c72a1209db169a2e0542bce341da992fe1bc7e84 + url: "https://pub.dev" source: hosted - version: "1.1.0" + version: "1.2.1" test_api: dependency: transitive description: name: test_api - url: "https://pub.dartlang.org" + sha256: "75760ffd7786fffdfb9597c35c5b27eaeec82be8edfb6d71d32651128ed7aab8" + url: "https://pub.dev" source: hosted - version: "0.2.5" - typed_data: + version: "0.6.0" + vector_math: dependency: transitive description: - name: typed_data - url: "https://pub.dartlang.org" + name: vector_math + sha256: "80b3257d1492ce4d091729e3a67a60407d227c27241d6927be0130c98e741803" + url: "https://pub.dev" source: hosted - version: "1.1.6" - vector_math: + version: "2.1.4" + web: dependency: transitive description: - name: vector_math - url: "https://pub.dartlang.org" + name: web + sha256: dc8ccd225a2005c1be616fe02951e2e342092edf968cf0844220383757ef8f10 + url: "https://pub.dev" source: hosted - version: "2.0.8" + version: "0.1.4-beta" sdks: - dart: ">=2.2.2 <3.0.0" + dart: ">=3.1.3 <4.0.0" diff --git a/pubspec.yaml b/pubspec.yaml index cc5391a..811cf24 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -14,17 +14,17 @@ description: A new Flutter project. version: 1.0.0+1 environment: - sdk: ">=2.1.0 <3.0.0" + sdk: '>=3.1.3 <4.0.0' dependencies: flutter: sdk: flutter - page_transition: ^1.1.4 - simple_animations: ^1.3.3 + page_transition: ^2.1.0 # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. - cupertino_icons: ^0.1.2 + cupertino_icons: ^1.0.2 + animate_do: ^3.1.2 dev_dependencies: flutter_test: