├── ios ├── Runner │ ├── Runner-Bridging-Header.h │ ├── Assets.xcassets │ │ ├── LaunchImage.imageset │ │ │ ├── LaunchImage.png │ │ │ ├── LaunchImage@2x.png │ │ │ ├── LaunchImage@3x.png │ │ │ ├── README.md │ │ │ └── Contents.json │ │ └── AppIcon.appiconset │ │ │ ├── Icon-App-20x20@1x.png │ │ │ ├── Icon-App-20x20@2x.png │ │ │ ├── Icon-App-20x20@3x.png │ │ │ ├── Icon-App-29x29@1x.png │ │ │ ├── Icon-App-29x29@2x.png │ │ │ ├── Icon-App-29x29@3x.png │ │ │ ├── Icon-App-40x40@1x.png │ │ │ ├── Icon-App-40x40@2x.png │ │ │ ├── Icon-App-40x40@3x.png │ │ │ ├── Icon-App-60x60@2x.png │ │ │ ├── Icon-App-60x60@3x.png │ │ │ ├── Icon-App-76x76@1x.png │ │ │ ├── Icon-App-76x76@2x.png │ │ │ ├── Icon-App-1024x1024@1x.png │ │ │ ├── Icon-App-83.5x83.5@2x.png │ │ │ └── Contents.json │ ├── AppDelegate.swift │ ├── Base.lproj │ │ ├── Main.storyboard │ │ └── LaunchScreen.storyboard │ └── Info.plist ├── Flutter │ ├── Debug.xcconfig │ ├── Release.xcconfig │ └── AppFrameworkInfo.plist ├── Runner.xcodeproj │ ├── project.xcworkspace │ │ ├── contents.xcworkspacedata │ │ └── xcshareddata │ │ │ ├── WorkspaceSettings.xcsettings │ │ │ └── IDEWorkspaceChecks.plist │ └── xcshareddata │ │ └── xcschemes │ │ └── Runner.xcscheme ├── Runner.xcworkspace │ ├── contents.xcworkspacedata │ └── xcshareddata │ │ ├── WorkspaceSettings.xcsettings │ │ └── IDEWorkspaceChecks.plist ├── .gitignore └── Podfile ├── assets ├── email.png ├── stop-man.png ├── dancing-man.gif ├── no-connection.gif ├── screenshots │ ├── expenses.png │ ├── learning.png │ ├── movies.png │ ├── stocks.png │ ├── tea-page.png │ ├── wallet.png │ ├── helicopter.png │ ├── login-page.png │ ├── squid-game.png │ ├── dancing-man.png │ ├── design-tools.png │ ├── discover-page.png │ ├── light-switch.png │ ├── no-connection.png │ ├── product-card.png │ ├── verification.png │ ├── bordered-button.png │ ├── collection-page.png │ ├── concentric-page.jpg │ ├── fade-animation.png │ ├── github-users-page.png │ ├── odometer-example.jpg │ ├── skeleton-loading.png │ ├── staggered-gridview.png │ ├── register-with-phone.png │ ├── vertical-card-pager.png │ └── bottom-navigation-bar.png └── google_fonts │ ├── RobotoSlab-Black.ttf │ ├── RobotoSlab-Bold.ttf │ ├── RobotoSlab-Light.ttf │ ├── RobotoSlab-Medium.ttf │ ├── RobotoSlab-Thin.ttf │ ├── RobotoSlab-Regular.ttf │ ├── RobotoSlab-SemiBold.ttf │ ├── RobotoSlab-ExtraBold.ttf │ └── RobotoSlab-ExtraLight.ttf ├── web ├── favicon.png ├── icons │ ├── Icon-192.png │ └── Icon-512.png ├── manifest.json └── index.html ├── android ├── gradle.properties ├── app │ ├── src │ │ ├── main │ │ │ ├── res │ │ │ │ ├── mipmap-hdpi │ │ │ │ │ └── ic_launcher.png │ │ │ │ ├── mipmap-mdpi │ │ │ │ │ └── ic_launcher.png │ │ │ │ ├── mipmap-xhdpi │ │ │ │ │ └── ic_launcher.png │ │ │ │ ├── mipmap-xxhdpi │ │ │ │ │ └── ic_launcher.png │ │ │ │ ├── mipmap-xxxhdpi │ │ │ │ │ └── ic_launcher.png │ │ │ │ ├── drawable │ │ │ │ │ └── launch_background.xml │ │ │ │ ├── drawable-v21 │ │ │ │ │ └── launch_background.xml │ │ │ │ ├── values │ │ │ │ │ └── styles.xml │ │ │ │ └── values-night │ │ │ │ │ └── styles.xml │ │ │ ├── kotlin │ │ │ │ └── com │ │ │ │ │ └── example │ │ │ │ │ └── example │ │ │ │ │ └── MainActivity.kt │ │ │ └── AndroidManifest.xml │ │ ├── debug │ │ │ └── AndroidManifest.xml │ │ └── profile │ │ │ └── AndroidManifest.xml │ └── build.gradle ├── gradle │ └── wrapper │ │ └── gradle-wrapper.properties ├── .gitignore ├── settings.gradle └── build.gradle ├── .metadata ├── lib ├── main.dart ├── fade_animation.dart └── pages │ ├── squid_game.dart │ ├── button.dart │ ├── odometer_example.dart │ ├── animated_buttons.dart │ ├── concentric_transition.dart │ ├── github_users.dart │ ├── salomon_bottom_bar.dart │ ├── liquid_swipe_example.dart │ ├── play_video.dart │ ├── animated_container.dart │ ├── no_connection.dart │ ├── skeleton_loading.dart │ ├── vartical_card_pager.dart │ ├── dancing_man.dart │ ├── loading.dart │ ├── bottom_navy_bar.dart │ ├── bouncing_widget.dart │ ├── dream_job.dart │ ├── learn_flutter.dart │ ├── bottom_navigation_bar.dart │ ├── light_switch.dart │ ├── tea_page.dart │ ├── helicopter.dart │ ├── new_collection.dart │ ├── product_card.dart │ ├── awesome_dropdown_example.dart │ ├── design_tools.dart │ ├── register_with_phone.dart │ ├── furnitures.dart │ ├── verification.dart │ ├── login.dart │ ├── movies.dart │ └── stocks.dart ├── .gitignore ├── test └── widget_test.dart ├── README.md ├── pubspec.yaml └── LICENSE /ios/Runner/Runner-Bridging-Header.h: -------------------------------------------------------------------------------- 1 | #import "GeneratedPluginRegistrant.h" 2 | -------------------------------------------------------------------------------- /assets/email.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/email.png -------------------------------------------------------------------------------- /web/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/web/favicon.png -------------------------------------------------------------------------------- /assets/stop-man.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/stop-man.png -------------------------------------------------------------------------------- /assets/dancing-man.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/dancing-man.gif -------------------------------------------------------------------------------- /web/icons/Icon-192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/web/icons/Icon-192.png -------------------------------------------------------------------------------- /web/icons/Icon-512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/web/icons/Icon-512.png -------------------------------------------------------------------------------- /assets/no-connection.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/no-connection.gif -------------------------------------------------------------------------------- /android/gradle.properties: -------------------------------------------------------------------------------- 1 | org.gradle.jvmargs=-Xmx1536M 2 | android.useAndroidX=true 3 | android.enableJetifier=true 4 | -------------------------------------------------------------------------------- /assets/screenshots/expenses.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/expenses.png -------------------------------------------------------------------------------- /assets/screenshots/learning.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/learning.png -------------------------------------------------------------------------------- /assets/screenshots/movies.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/movies.png -------------------------------------------------------------------------------- /assets/screenshots/stocks.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/stocks.png -------------------------------------------------------------------------------- /assets/screenshots/tea-page.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/tea-page.png -------------------------------------------------------------------------------- /assets/screenshots/wallet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/wallet.png -------------------------------------------------------------------------------- /assets/screenshots/helicopter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/helicopter.png -------------------------------------------------------------------------------- /assets/screenshots/login-page.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/login-page.png -------------------------------------------------------------------------------- /assets/screenshots/squid-game.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/squid-game.png -------------------------------------------------------------------------------- /assets/screenshots/dancing-man.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/dancing-man.png -------------------------------------------------------------------------------- /assets/screenshots/design-tools.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/design-tools.png -------------------------------------------------------------------------------- /assets/screenshots/discover-page.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/discover-page.png -------------------------------------------------------------------------------- /assets/screenshots/light-switch.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/light-switch.png -------------------------------------------------------------------------------- /assets/screenshots/no-connection.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/no-connection.png -------------------------------------------------------------------------------- /assets/screenshots/product-card.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/product-card.png -------------------------------------------------------------------------------- /assets/screenshots/verification.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/verification.png -------------------------------------------------------------------------------- /assets/screenshots/bordered-button.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/bordered-button.png -------------------------------------------------------------------------------- /assets/screenshots/collection-page.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/collection-page.png -------------------------------------------------------------------------------- /assets/screenshots/concentric-page.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/concentric-page.jpg -------------------------------------------------------------------------------- /assets/screenshots/fade-animation.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/fade-animation.png -------------------------------------------------------------------------------- /ios/Flutter/Debug.xcconfig: -------------------------------------------------------------------------------- 1 | #include? "Pods/Target Support Files/Pods-Runner/Pods-Runner.debug.xcconfig" 2 | #include "Generated.xcconfig" 3 | -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-Black.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-Black.ttf -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-Bold.ttf -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-Light.ttf -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-Medium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-Medium.ttf -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-Thin.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-Thin.ttf -------------------------------------------------------------------------------- /assets/screenshots/github-users-page.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/github-users-page.png -------------------------------------------------------------------------------- /assets/screenshots/odometer-example.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/odometer-example.jpg -------------------------------------------------------------------------------- /assets/screenshots/skeleton-loading.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/skeleton-loading.png -------------------------------------------------------------------------------- /assets/screenshots/staggered-gridview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/staggered-gridview.png -------------------------------------------------------------------------------- /ios/Flutter/Release.xcconfig: -------------------------------------------------------------------------------- 1 | #include? "Pods/Target Support Files/Pods-Runner/Pods-Runner.release.xcconfig" 2 | #include "Generated.xcconfig" 3 | -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-Regular.ttf -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-SemiBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-SemiBold.ttf -------------------------------------------------------------------------------- /assets/screenshots/register-with-phone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/register-with-phone.png -------------------------------------------------------------------------------- /assets/screenshots/vertical-card-pager.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/vertical-card-pager.png -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-ExtraBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-ExtraBold.ttf -------------------------------------------------------------------------------- /assets/google_fonts/RobotoSlab-ExtraLight.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/google_fonts/RobotoSlab-ExtraLight.ttf -------------------------------------------------------------------------------- /assets/screenshots/bottom-navigation-bar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/assets/screenshots/bottom-navigation-bar.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-hdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/android/app/src/main/res/mipmap-hdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-mdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/android/app/src/main/res/mipmap-mdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@2x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@3x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@1x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@1x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@2x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-20x20@3x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@1x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@1x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@2x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-29x29@3x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@1x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@1x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@2x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-40x40@3x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@2x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60@3x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@1x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@1x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-76x76@2x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-1024x1024@1x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-1024x1024@1x.png -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-83.5x83.5@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/afgprogrammer/Flutter-examples/HEAD/ios/Runner/Assets.xcassets/AppIcon.appiconset/Icon-App-83.5x83.5@2x.png -------------------------------------------------------------------------------- /android/app/src/main/kotlin/com/example/example/MainActivity.kt: -------------------------------------------------------------------------------- 1 | package com.example.example 2 | 3 | import io.flutter.embedding.android.FlutterActivity 4 | 5 | class MainActivity: FlutterActivity() { 6 | } 7 | -------------------------------------------------------------------------------- /ios/Runner.xcodeproj/project.xcworkspace/contents.xcworkspacedata: -------------------------------------------------------------------------------- 1 | 2 | 4 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /ios/Runner.xcworkspace/contents.xcworkspacedata: -------------------------------------------------------------------------------- 1 | 2 | 4 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /android/gradle/wrapper/gradle-wrapper.properties: -------------------------------------------------------------------------------- 1 | #Fri Jun 23 08:50:38 CEST 2017 2 | distributionBase=GRADLE_USER_HOME 3 | distributionPath=wrapper/dists 4 | zipStoreBase=GRADLE_USER_HOME 5 | zipStorePath=wrapper/dists 6 | distributionUrl=https\://services.gradle.org/distributions/gradle-6.7-all.zip 7 | -------------------------------------------------------------------------------- /ios/Runner.xcworkspace/xcshareddata/WorkspaceSettings.xcsettings: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | PreviewsEnabled 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /ios/Runner.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | IDEDidComputeMac32BitWarning 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /android/.gitignore: -------------------------------------------------------------------------------- 1 | gradle-wrapper.jar 2 | /.gradle 3 | /captures/ 4 | /gradlew 5 | /gradlew.bat 6 | /local.properties 7 | GeneratedPluginRegistrant.java 8 | 9 | # Remember to never publicly share your keystore. 10 | # See https://flutter.dev/docs/deployment/android#reference-the-keystore-from-the-app 11 | key.properties 12 | -------------------------------------------------------------------------------- /ios/Runner.xcodeproj/project.xcworkspace/xcshareddata/WorkspaceSettings.xcsettings: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | PreviewsEnabled 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /ios/Runner.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | IDEDidComputeMac32BitWarning 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /.metadata: -------------------------------------------------------------------------------- 1 | # This file tracks properties of this Flutter project. 2 | # Used by Flutter tool to assess capabilities and perform upgrades etc. 3 | # 4 | # This file should be version controlled and should not be manually edited. 5 | 6 | version: 7 | revision: d79295af24c3ed621c33713ecda14ad196fd9c31 8 | channel: stable 9 | 10 | project_type: app 11 | -------------------------------------------------------------------------------- /android/app/src/debug/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 3 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /android/app/src/profile/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 3 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/LaunchImage.imageset/README.md: -------------------------------------------------------------------------------- 1 | # Launch Screen Assets 2 | 3 | You can customize the launch screen with your own desired assets by replacing the image files in this directory. 4 | 5 | You can also do it by opening your Flutter project's Xcode project with `open ios/Runner.xcworkspace`, selecting `Runner/Assets.xcassets` in the Project Navigator and dropping in the desired images. -------------------------------------------------------------------------------- /ios/Runner/AppDelegate.swift: -------------------------------------------------------------------------------- 1 | import UIKit 2 | import Flutter 3 | 4 | @UIApplicationMain 5 | @objc class AppDelegate: FlutterAppDelegate { 6 | override func application( 7 | _ application: UIApplication, 8 | didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? 9 | ) -> Bool { 10 | GeneratedPluginRegistrant.register(with: self) 11 | return super.application(application, didFinishLaunchingWithOptions: launchOptions) 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /android/settings.gradle: -------------------------------------------------------------------------------- 1 | include ':app' 2 | 3 | def localPropertiesFile = new File(rootProject.projectDir, "local.properties") 4 | def properties = new Properties() 5 | 6 | assert localPropertiesFile.exists() 7 | localPropertiesFile.withReader("UTF-8") { reader -> properties.load(reader) } 8 | 9 | def flutterSdkPath = properties.getProperty("flutter.sdk") 10 | assert flutterSdkPath != null, "flutter.sdk not set in local.properties" 11 | apply from: "$flutterSdkPath/packages/flutter_tools/gradle/app_plugin_loader.gradle" 12 | -------------------------------------------------------------------------------- /android/app/src/main/res/drawable/launch_background.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 12 | 13 | -------------------------------------------------------------------------------- /android/app/src/main/res/drawable-v21/launch_background.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 12 | 13 | -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/LaunchImage.imageset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "universal", 5 | "filename" : "LaunchImage.png", 6 | "scale" : "1x" 7 | }, 8 | { 9 | "idiom" : "universal", 10 | "filename" : "LaunchImage@2x.png", 11 | "scale" : "2x" 12 | }, 13 | { 14 | "idiom" : "universal", 15 | "filename" : "LaunchImage@3x.png", 16 | "scale" : "3x" 17 | } 18 | ], 19 | "info" : { 20 | "version" : 1, 21 | "author" : "xcode" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /web/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "example", 3 | "short_name": "example", 4 | "start_url": ".", 5 | "display": "standalone", 6 | "background_color": "#0175C2", 7 | "theme_color": "#0175C2", 8 | "description": "A new Flutter project.", 9 | "orientation": "portrait-primary", 10 | "prefer_related_applications": false, 11 | "icons": [ 12 | { 13 | "src": "icons/Icon-192.png", 14 | "sizes": "192x192", 15 | "type": "image/png" 16 | }, 17 | { 18 | "src": "icons/Icon-512.png", 19 | "sizes": "512x512", 20 | "type": "image/png" 21 | } 22 | ] 23 | } 24 | -------------------------------------------------------------------------------- /android/build.gradle: -------------------------------------------------------------------------------- 1 | buildscript { 2 | ext.kotlin_version = '1.3.50' 3 | repositories { 4 | google() 5 | jcenter() 6 | } 7 | 8 | dependencies { 9 | classpath 'com.android.tools.build:gradle:4.1.0' 10 | classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version" 11 | } 12 | } 13 | 14 | allprojects { 15 | repositories { 16 | google() 17 | jcenter() 18 | } 19 | } 20 | 21 | rootProject.buildDir = '../build' 22 | subprojects { 23 | project.buildDir = "${rootProject.buildDir}/${project.name}" 24 | project.evaluationDependsOn(':app') 25 | } 26 | 27 | task clean(type: Delete) { 28 | delete rootProject.buildDir 29 | } 30 | -------------------------------------------------------------------------------- /ios/.gitignore: -------------------------------------------------------------------------------- 1 | *.mode1v3 2 | *.mode2v3 3 | *.moved-aside 4 | *.pbxuser 5 | *.perspectivev3 6 | **/*sync/ 7 | .sconsign.dblite 8 | .tags* 9 | **/.vagrant/ 10 | **/DerivedData/ 11 | Icon? 12 | **/Pods/ 13 | **/.symlinks/ 14 | profile 15 | xcuserdata 16 | **/.generated/ 17 | Flutter/App.framework 18 | Flutter/Flutter.framework 19 | Flutter/Flutter.podspec 20 | Flutter/Generated.xcconfig 21 | Flutter/ephemeral/ 22 | Flutter/app.flx 23 | Flutter/app.zip 24 | Flutter/flutter_assets/ 25 | Flutter/flutter_export_environment.sh 26 | ServiceDefinitions.json 27 | Runner/GeneratedPluginRegistrant.* 28 | 29 | # Exceptions to above rules. 30 | !default.mode1v3 31 | !default.mode2v3 32 | !default.pbxuser 33 | !default.perspectivev3 34 | -------------------------------------------------------------------------------- /lib/main.dart: -------------------------------------------------------------------------------- 1 | import 'package:example/pages/animated_container.dart'; 2 | import 'package:example/pages/expenses.dart'; 3 | import 'package:flutter/material.dart'; 4 | 5 | void main() => runApp( 6 | MaterialApp( 7 | debugShowCheckedModeBanner: false, 8 | home: ExpensesPage(), 9 | ) 10 | ); 11 | 12 | class HomePage extends StatelessWidget { 13 | const HomePage({ Key? key }) : super(key: key); 14 | 15 | @override 16 | Widget build(BuildContext context) { 17 | return Scaffold( 18 | extendBody: true, 19 | body: Container( 20 | width: double.infinity, 21 | height: double.infinity, 22 | padding: EdgeInsets.all(20), 23 | color: Color(0xff8186F0), 24 | child: Center(child: Box()), 25 | ), 26 | ); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /ios/Flutter/AppFrameworkInfo.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | App 9 | CFBundleIdentifier 10 | io.flutter.flutter.app 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | App 15 | CFBundlePackageType 16 | FMWK 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1.0 23 | MinimumOSVersion 24 | 8.0 25 | 26 | 27 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Miscellaneous 2 | *.class 3 | *.log 4 | *.pyc 5 | *.swp 6 | .DS_Store 7 | .atom/ 8 | .buildlog/ 9 | .history 10 | .svn/ 11 | 12 | # IntelliJ related 13 | *.iml 14 | *.ipr 15 | *.iws 16 | .idea/ 17 | 18 | # The .vscode folder contains launch configuration and tasks you configure in 19 | # VS Code which you may wish to be included in version control, so this line 20 | # is commented out by default. 21 | #.vscode/ 22 | 23 | # Flutter/Dart/Pub related 24 | **/doc/api/ 25 | **/ios/Flutter/.last_build_id 26 | .dart_tool/ 27 | .flutter-plugins 28 | .flutter-plugins-dependencies 29 | .packages 30 | .pub-cache/ 31 | .pub/ 32 | /build/ 33 | 34 | # Web related 35 | lib/generated_plugin_registrant.dart 36 | 37 | # Symbolication related 38 | app.*.symbols 39 | 40 | # Obfuscation related 41 | app.*.map.json 42 | 43 | # Android Studio will place build artifacts here 44 | /android/app/debug 45 | /android/app/profile 46 | /android/app/release 47 | -------------------------------------------------------------------------------- /android/app/src/main/res/values/styles.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 9 | 15 | 18 | 19 | -------------------------------------------------------------------------------- /android/app/src/main/res/values-night/styles.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 9 | 15 | 18 | 19 | -------------------------------------------------------------------------------- /lib/fade_animation.dart: -------------------------------------------------------------------------------- 1 | import 'package:example/pages/button.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class FadeAnimation extends StatefulWidget { 5 | const FadeAnimation({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _FadeAnimationState createState() => _FadeAnimationState(); 9 | } 10 | 11 | class _FadeAnimationState extends State { 12 | bool _visible = true; 13 | 14 | @override 15 | Widget build(BuildContext context) { 16 | return Container( 17 | height: 300, 18 | child: Column( 19 | children: [ 20 | AnimatedOpacity( 21 | opacity: _visible ? 1 : 0, 22 | duration: Duration(milliseconds: 500), 23 | child: Container( 24 | width: 200, 25 | height: 100, 26 | color: Colors.orangeAccent, 27 | ), 28 | ), 29 | SizedBox(height: 40), 30 | BorderedButton(text: "Show/Hide", onPress: () { 31 | setState(() { 32 | _visible = !_visible; 33 | }); 34 | }) 35 | ], 36 | ), 37 | ); 38 | } 39 | } -------------------------------------------------------------------------------- /test/widget_test.dart: -------------------------------------------------------------------------------- 1 | // This is a basic Flutter widget test. 2 | // 3 | // To perform an interaction with a widget in your test, use the WidgetTester 4 | // utility that Flutter provides. For example, you can send tap and scroll 5 | // gestures. You can also use WidgetTester to find child widgets in the widget 6 | // tree, read text, and verify that the values of widget properties are correct. 7 | 8 | import 'package:flutter/material.dart'; 9 | import 'package:flutter_test/flutter_test.dart'; 10 | 11 | import 'package:example/main.dart'; 12 | 13 | void main() { 14 | testWidgets('Counter increments smoke test', (WidgetTester tester) async { 15 | // Build our app and trigger a frame. 16 | await tester.pumpWidget(MyApp()); 17 | 18 | // Verify that our counter starts at 0. 19 | expect(find.text('0'), findsOneWidget); 20 | expect(find.text('1'), findsNothing); 21 | 22 | // Tap the '+' icon and trigger a frame. 23 | await tester.tap(find.byIcon(Icons.add)); 24 | await tester.pump(); 25 | 26 | // Verify that our counter has incremented. 27 | expect(find.text('0'), findsNothing); 28 | expect(find.text('1'), findsOneWidget); 29 | }); 30 | } 31 | -------------------------------------------------------------------------------- /lib/pages/squid_game.dart: -------------------------------------------------------------------------------- 1 | import 'package:elastic_drawer/elastic_drawer.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class SquidGame extends StatefulWidget { 5 | const SquidGame({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _SquidGameState createState() => _SquidGameState(); 9 | } 10 | 11 | class _SquidGameState extends State { 12 | @override 13 | Widget build(BuildContext context) { 14 | return ElasticDrawer( 15 | mainColor: Colors.white, 16 | drawerColor: Colors.black, 17 | mainChild: Column( 18 | children: [ 19 | Expanded( 20 | child: Image.network('https://images.unsplash.com/photo-1634193295627-1cdddf751ebf?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1287&q=80', 21 | fit: BoxFit.cover,), 22 | ) 23 | ] 24 | ), 25 | drawerChild: Column( 26 | children: [ 27 | Expanded( 28 | child: Image.network('https://images.unsplash.com/photo-1634195130430-2be61200b66a?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1287&q=80', 29 | fit: BoxFit.cover,), 30 | ) 31 | ] 32 | ), 33 | ); 34 | } 35 | } -------------------------------------------------------------------------------- /lib/pages/button.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class BorderedButton extends StatelessWidget { 4 | const BorderedButton({ Key? key, required this.text, required this.onPress }) : super(key: key); 5 | 6 | final String text; 7 | final Function onPress; 8 | 9 | @override 10 | Widget build(BuildContext context) { 11 | return Container( 12 | padding: EdgeInsets.only(top: 5, left: 5), 13 | decoration: BoxDecoration( 14 | borderRadius: BorderRadius.circular(50), 15 | border: Border( 16 | bottom: BorderSide(color: Colors.black), 17 | top: BorderSide(color: Colors.black), 18 | left: BorderSide(color: Colors.black), 19 | right: BorderSide(color: Colors.black), 20 | ) 21 | ), 22 | child: MaterialButton( 23 | minWidth: double.infinity, 24 | height: 60, 25 | onPressed: () { 26 | onPress(); 27 | }, 28 | color: Colors.yellowAccent, 29 | elevation: 0, 30 | shape: RoundedRectangleBorder( 31 | borderRadius: BorderRadius.circular(50) 32 | ), 33 | child: Text(text, style: TextStyle( 34 | fontWeight: FontWeight.w600, 35 | fontSize: 18 36 | ),), 37 | ), 38 | ); 39 | } 40 | } -------------------------------------------------------------------------------- /lib/pages/odometer_example.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:odometer/odometer.dart'; 3 | 4 | class OdometerExample extends StatefulWidget { 5 | const OdometerExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | OdometerExampleState createState() => OdometerExampleState(); 9 | } 10 | 11 | class OdometerExampleState extends State { 12 | int _counter = 10000; 13 | 14 | void _incrementCounter() { 15 | setState(() { 16 | _counter += 10000; 17 | }); 18 | } 19 | 20 | @override 21 | Widget build(BuildContext context) { 22 | return Scaffold( 23 | appBar: AppBar( 24 | elevation: 0, 25 | backgroundColor: Colors.white, 26 | title: Text("Odometer Package Example", style: TextStyle(color: Colors.black),), 27 | ), 28 | floatingActionButton: FloatingActionButton( 29 | onPressed: _incrementCounter, 30 | child: Icon(Icons.add), 31 | ), 32 | body: Container( 33 | width: double.infinity, 34 | child: Column( 35 | mainAxisAlignment: MainAxisAlignment.center, 36 | children: [ 37 | AnimatedSlideOdometerNumber( 38 | odometerNumber: OdometerNumber(_counter), 39 | duration: Duration(milliseconds: 1000), 40 | letterWidth: 35, 41 | numberTextStyle: TextStyle( 42 | fontSize: 35, 43 | fontWeight: FontWeight.bold 44 | ), 45 | ) 46 | ], 47 | ), 48 | ), 49 | ); 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /ios/Podfile: -------------------------------------------------------------------------------- 1 | # Uncomment this line to define a global platform for your project 2 | # platform :ios, '12.0' 3 | 4 | # CocoaPods analytics sends network stats synchronously affecting flutter build latency. 5 | ENV['COCOAPODS_DISABLE_STATS'] = 'true' 6 | 7 | project 'Runner', { 8 | 'Debug' => :debug, 9 | 'Profile' => :release, 10 | 'Release' => :release, 11 | } 12 | 13 | def flutter_root 14 | generated_xcode_build_settings_path = File.expand_path(File.join('..', 'Flutter', 'Generated.xcconfig'), __FILE__) 15 | unless File.exist?(generated_xcode_build_settings_path) 16 | raise "#{generated_xcode_build_settings_path} must exist. If you're running pod install manually, make sure flutter pub get is executed first" 17 | end 18 | 19 | File.foreach(generated_xcode_build_settings_path) do |line| 20 | matches = line.match(/FLUTTER_ROOT\=(.*)/) 21 | return matches[1].strip if matches 22 | end 23 | raise "FLUTTER_ROOT not found in #{generated_xcode_build_settings_path}. Try deleting Generated.xcconfig, then run flutter pub get" 24 | end 25 | 26 | require File.expand_path(File.join('packages', 'flutter_tools', 'bin', 'podhelper'), flutter_root) 27 | 28 | flutter_ios_podfile_setup 29 | 30 | target 'Runner' do 31 | use_frameworks! 32 | use_modular_headers! 33 | 34 | flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__)) 35 | target 'RunnerTests' do 36 | inherit! :search_paths 37 | end 38 | end 39 | 40 | post_install do |installer| 41 | installer.pods_project.targets.each do |target| 42 | flutter_additional_ios_build_settings(target) 43 | end 44 | end 45 | -------------------------------------------------------------------------------- /lib/pages/animated_buttons.dart: -------------------------------------------------------------------------------- 1 | import 'package:animated_button/animated_button.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class AnimatedButtonsExample extends StatefulWidget { 5 | const AnimatedButtonsExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _AnimatedButtonsExampleState createState() => _AnimatedButtonsExampleState(); 9 | } 10 | 11 | class _AnimatedButtonsExampleState extends State { 12 | @override 13 | Widget build(BuildContext context) { 14 | return Scaffold( 15 | appBar: AppBar( 16 | backgroundColor: Colors.white, 17 | elevation: 0, 18 | title: Column( 19 | children: [ 20 | Text('AnimatedButtons', style: TextStyle( 21 | color: Colors.black, 22 | ),), 23 | SizedBox(height: 2,), 24 | Text('@theflutterlover', style: TextStyle( 25 | color: Colors.grey.shade600, 26 | fontSize: 15, 27 | ),), 28 | ], 29 | ), 30 | ), 31 | body: Container( 32 | width: double.infinity, 33 | child: Column( 34 | mainAxisAlignment: MainAxisAlignment.center, 35 | children: [ 36 | AnimatedButton( 37 | child: Text( 38 | 'Simple button', 39 | style: TextStyle( 40 | fontSize: 22, 41 | color: Colors.white, 42 | fontWeight: FontWeight.w500, 43 | ), 44 | ), 45 | onPressed: () {}, 46 | ), 47 | ] 48 | ), 49 | ), 50 | ); 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /ios/Runner/Base.lproj/Main.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /ios/Runner/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | $(DEVELOPMENT_LANGUAGE) 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | example 15 | CFBundlePackageType 16 | APPL 17 | CFBundleShortVersionString 18 | $(FLUTTER_BUILD_NAME) 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | $(FLUTTER_BUILD_NUMBER) 23 | LSRequiresIPhoneOS 24 | 25 | UILaunchStoryboardName 26 | LaunchScreen 27 | UIMainStoryboardFile 28 | Main 29 | UISupportedInterfaceOrientations 30 | 31 | UIInterfaceOrientationPortrait 32 | UIInterfaceOrientationLandscapeLeft 33 | UIInterfaceOrientationLandscapeRight 34 | 35 | UISupportedInterfaceOrientations~ipad 36 | 37 | UIInterfaceOrientationPortrait 38 | UIInterfaceOrientationPortraitUpsideDown 39 | UIInterfaceOrientationLandscapeLeft 40 | UIInterfaceOrientationLandscapeRight 41 | 42 | UIViewControllerBasedStatusBarAppearance 43 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /lib/pages/concentric_transition.dart: -------------------------------------------------------------------------------- 1 | import 'package:concentric_transition/page_view.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class ConcentricTransition extends StatefulWidget { 5 | const ConcentricTransition({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _ConcentricTransitionState createState() => _ConcentricTransitionState(); 9 | } 10 | 11 | class _ConcentricTransitionState extends State { 12 | List pages = [ 13 | { 14 | 'image': 'https://ouch-cdn2.icons8.com/yIxQmzj1OHH3S9AiIgelaTGdpj3wApWqSqFh80arSEA/rs:fit:784:828/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvMTMx/L2NmOGIzZmY4LWRh/YjEtNDdiMS1hZGQ4/LWFkMTUwZTQwNzIx/NC5wbmc.png', 15 | }, 16 | { 17 | 'image': 'https://ouch-cdn2.icons8.com/oEXWmNUZgj3vd_T5XSJe2dTB1GFWIBeJ1QEqRWw76O8/rs:fit:784:748/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvMzM1/L2Q3MjMyYzJlLTk0/NTMtNDUzMC1iZTEx/LWQ2MDZiN2RjYmFm/Yy5wbmc.png' 18 | }, 19 | { 20 | 'image': 'https://ouch-cdn2.icons8.com/g8bZd-d4qiYuomOBWh3x61II6HlK8Ir2zp_a2cFTcCA/rs:fit:784:784/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvNDI4/LzdjMjEyYjgzLTg0/NjQtNDQzMS04NzAz/LTNkNzk1YmUyMzli/MC5wbmc.png' 21 | } 22 | ]; 23 | 24 | @override 25 | Widget build(BuildContext context) { 26 | return Scaffold( 27 | body: ConcentricPageView( 28 | radius: 30, 29 | verticalPosition: 0.85, 30 | colors: [Colors.white, Colors.blueAccent, Colors.pinkAccent], 31 | itemBuilder: (index, value) { 32 | int pageIndex = (index % pages.length); 33 | return Container( 34 | child: Column( 35 | mainAxisAlignment: MainAxisAlignment.center, 36 | children: [ 37 | Image.network(pages[pageIndex]['image'], width: 300,) 38 | ], 39 | ), 40 | ); 41 | }, 42 | ) 43 | ); 44 | } 45 | } 46 | -------------------------------------------------------------------------------- /lib/pages/github_users.dart: -------------------------------------------------------------------------------- 1 | import 'dart:convert'; 2 | 3 | import 'package:dio/dio.dart'; 4 | import 'package:flutter/material.dart'; 5 | import 'package:url_launcher/url_launcher.dart'; 6 | 7 | class GithubUsers extends StatefulWidget { 8 | const GithubUsers({ Key? key }) : super(key: key); 9 | 10 | @override 11 | _GithubUsersState createState() => _GithubUsersState(); 12 | } 13 | 14 | class _GithubUsersState extends State { 15 | var users; 16 | 17 | void getGithubUsers() async { 18 | try { 19 | var response = await Dio().get("https://api.github.com/users", 20 | options: Options(headers: { 21 | "Authorization": "token ...", // your github access token 22 | })); 23 | 24 | setState(() { 25 | users = response.data; 26 | }); 27 | } catch (e) {} 28 | } 29 | 30 | @override 31 | void initState() { 32 | getGithubUsers(); 33 | 34 | super.initState(); 35 | } 36 | 37 | @override 38 | Widget build(BuildContext context) { 39 | return Scaffold( 40 | appBar: AppBar( 41 | elevation: 0, 42 | backgroundColor: Colors.white, 43 | title: const Text('Github Users', style: TextStyle(color: Colors.black),), 44 | ), 45 | body: users != null ? ListView.builder( 46 | itemCount: users.length, 47 | itemBuilder: (context, index) { 48 | return ListTile( 49 | leading: CircleAvatar( 50 | backgroundImage: NetworkImage(users[index]['avatar_url']), 51 | ), 52 | title: Text(users[index]['login']), 53 | subtitle: Text(users[index]['html_url']), 54 | onTap: () => _launchURL(users[index]['html_url']), 55 | ); 56 | }, 57 | ) : Center(child: CircularProgressIndicator()), 58 | ); 59 | } 60 | 61 | void _launchURL(String _url) async => 62 | await canLaunch(_url) ? await launch(_url) : throw 'Could not launch $_url'; 63 | } 64 | -------------------------------------------------------------------------------- /android/app/build.gradle: -------------------------------------------------------------------------------- 1 | def localProperties = new Properties() 2 | def localPropertiesFile = rootProject.file('local.properties') 3 | if (localPropertiesFile.exists()) { 4 | localPropertiesFile.withReader('UTF-8') { reader -> 5 | localProperties.load(reader) 6 | } 7 | } 8 | 9 | def flutterRoot = localProperties.getProperty('flutter.sdk') 10 | if (flutterRoot == null) { 11 | throw new GradleException("Flutter SDK not found. Define location with flutter.sdk in the local.properties file.") 12 | } 13 | 14 | def flutterVersionCode = localProperties.getProperty('flutter.versionCode') 15 | if (flutterVersionCode == null) { 16 | flutterVersionCode = '1' 17 | } 18 | 19 | def flutterVersionName = localProperties.getProperty('flutter.versionName') 20 | if (flutterVersionName == null) { 21 | flutterVersionName = '1.0' 22 | } 23 | 24 | apply plugin: 'com.android.application' 25 | apply plugin: 'kotlin-android' 26 | apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle" 27 | 28 | android { 29 | compileSdkVersion 30 30 | 31 | sourceSets { 32 | main.java.srcDirs += 'src/main/kotlin' 33 | } 34 | 35 | defaultConfig { 36 | // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html). 37 | applicationId "com.example.example" 38 | minSdkVersion 16 39 | targetSdkVersion 30 40 | versionCode flutterVersionCode.toInteger() 41 | versionName flutterVersionName 42 | } 43 | 44 | buildTypes { 45 | release { 46 | // TODO: Add your own signing config for the release build. 47 | // Signing with the debug keys for now, so `flutter run --release` works. 48 | signingConfig signingConfigs.debug 49 | } 50 | } 51 | } 52 | 53 | flutter { 54 | source '../..' 55 | } 56 | 57 | dependencies { 58 | implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version" 59 | } 60 | -------------------------------------------------------------------------------- /lib/pages/salomon_bottom_bar.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:salomon_bottom_bar/salomon_bottom_bar.dart'; 3 | 4 | class SalomonBottomNavBar extends StatefulWidget { 5 | const SalomonBottomNavBar({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _SalomonBottomNavBarState createState() => _SalomonBottomNavBarState(); 9 | } 10 | 11 | class _SalomonBottomNavBarState extends State { 12 | int _currentIndex = 0; 13 | 14 | @override 15 | void initState() { 16 | super.initState(); 17 | } 18 | 19 | @override 20 | Widget build(BuildContext context) { 21 | return Scaffold( 22 | appBar: AppBar( 23 | backgroundColor: Colors.blueAccent, 24 | elevation: 0, 25 | title: Text("Salomon Bottom Bar",), 26 | ), 27 | body: Center(child: Text("@theflutterlover", style: TextStyle(fontSize: 20),),), 28 | bottomNavigationBar: SalomonBottomBar( 29 | currentIndex: _currentIndex, 30 | margin: EdgeInsets.symmetric(vertical: 30, horizontal: 20), 31 | onTap: (index) { 32 | setState(() { 33 | _currentIndex = index; 34 | }); 35 | }, 36 | items: [ 37 | SalomonBottomBarItem( 38 | icon: Icon(Icons.home), 39 | title: Text("Home"), 40 | selectedColor: Colors.purple 41 | ), 42 | SalomonBottomBarItem( 43 | icon: Icon(Icons.favorite_border), 44 | title: Text("Likes"), 45 | selectedColor: Colors.pink 46 | ), 47 | SalomonBottomBarItem( 48 | icon: Icon(Icons.search), 49 | title: Text("Search"), 50 | selectedColor: Colors.orange 51 | ), 52 | SalomonBottomBarItem( 53 | icon: Icon(Icons.person), 54 | title: Text("Profile"), 55 | selectedColor: Colors.teal 56 | ) 57 | ], 58 | ), 59 | ); 60 | } 61 | } 62 | -------------------------------------------------------------------------------- /lib/pages/liquid_swipe_example.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:liquid_swipe/liquid_swipe.dart'; 3 | 4 | class LiquidSwipeExample extends StatefulWidget { 5 | const LiquidSwipeExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _LiquidSwipeExampleState createState() => _LiquidSwipeExampleState(); 9 | } 10 | 11 | class _LiquidSwipeExampleState extends State { 12 | 13 | // Photos from google 14 | final pages = [ 15 | Container( 16 | height: double.infinity, 17 | child: Image.network('https://my4kwallpapers.com/wp-content/uploads/2021/10/Squid-Game-Wallaper-1080x1920-1.jpg', fit: BoxFit.cover,),), 18 | Container( 19 | height: double.infinity, 20 | child: Image.network('https://w0.peakpx.com/wallpaper/432/1/HD-wallpaper-el-juego-del-calamar-netflix-squid-game.jpg', fit: BoxFit.cover,),), 21 | Container( 22 | height: double.infinity, 23 | child: Image.network('https://w0.peakpx.com/wallpaper/114/378/HD-wallpaper-squid-game-netflix-electric-blue-magenta-squid-game.jpg', fit: BoxFit.cover,),), 24 | Container( 25 | height: double.infinity, 26 | child: Image.network('https://fsb.zobj.net/crop.php?r=71AngyTpyXhfPVli-wIddS2vviYpIGCVmHX8EkQbAKyEkqH55ohVtsP3jTs0sWamyX5auRdmNOTnvZb0lBvJG9bwdJ8Zi5wZdGo2JLutBDwV3Amcl9RWiMsHFZD1pgdCA8XsPIR-9FWNAXfy7zjd8IvNcU6j1tYROKs5F1iAP8AldI6AmLrv432iiVCGM6kNl3toGH6NzNTQUxKw', fit: BoxFit.cover,),), 27 | ]; 28 | 29 | @override 30 | Widget build(BuildContext context) { 31 | return Scaffold( 32 | body: Builder( 33 | builder: (context) { 34 | return LiquidSwipe( 35 | pages: pages, 36 | fullTransitionValue: 880, 37 | waveType: WaveType.circularReveal, 38 | slideIconWidget: Icon(Icons.arrow_back_ios, color: Colors.white,), 39 | positionSlideIcon: 0.8, 40 | onPageChangeCallback: (page) { 41 | print(page); 42 | }, 43 | liquidController: LiquidController(), 44 | ); 45 | }, 46 | ), 47 | ); 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /lib/pages/play_video.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:flutter_youtube_view/flutter_youtube_view.dart'; 3 | 4 | class PlayVideoExample extends StatefulWidget { 5 | const PlayVideoExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _PlayVideoExampleState createState() => _PlayVideoExampleState(); 9 | } 10 | 11 | class _PlayVideoExampleState extends State 12 | implements YouTubePlayerListener { 13 | 14 | double _currentVideoSecond = 0.0; 15 | String _playerState = ""; 16 | late FlutterYoutubeViewController _controller; 17 | 18 | @override 19 | Widget build(BuildContext context) { 20 | return Scaffold( 21 | body: Stack ( 22 | children: [ 23 | Container( 24 | child: FlutterYoutubeView( 25 | onViewCreated: _onYoutubeCreated, 26 | listener: this, 27 | params: YoutubeParam( 28 | videoId: 'dhKRflZUicU', 29 | showUI: true, 30 | startSeconds: 0, 31 | showYoutube: false, 32 | showFullScreen: true, 33 | ), 34 | )), 35 | ] 36 | ) 37 | ); 38 | } 39 | 40 | @override 41 | void onCurrentSecond(double second) { 42 | print("onCurrentSecond second = $second"); 43 | _currentVideoSecond = second; 44 | } 45 | 46 | @override 47 | void onError(String error) { 48 | print("onError error = $error"); 49 | } 50 | 51 | @override 52 | void onReady() { 53 | print("onReady"); 54 | } 55 | 56 | @override 57 | void onStateChange(String state) { 58 | print("onStateChange state = $state"); 59 | setState(() { 60 | _playerState = state; 61 | }); 62 | } 63 | 64 | @override 65 | void onVideoDuration(double duration) { 66 | print("onVideoDuration duration = $duration"); 67 | } 68 | 69 | void _onYoutubeCreated(FlutterYoutubeViewController controller) { 70 | this._controller = controller; 71 | } 72 | 73 | void _loadOrCueVideo() { 74 | _controller.loadOrCueVideo('gcj2RUWQZ60', _currentVideoSecond); 75 | } 76 | } -------------------------------------------------------------------------------- /lib/pages/animated_container.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class Box extends StatefulWidget { 4 | const Box({ Key? key }) : super(key: key); 5 | 6 | @override 7 | _BoxState createState() => _BoxState(); 8 | } 9 | 10 | class _BoxState extends State with SingleTickerProviderStateMixin { 11 | late AnimationController _controller; 12 | 13 | double width = 50; 14 | double height = 50; 15 | 16 | @override 17 | void initState() { 18 | _controller = AnimationController( 19 | duration: const Duration(milliseconds: 5000), 20 | vsync: this, 21 | ); 22 | _controller.addListener(() { 23 | setState(() { 24 | if (_controller.value <= 0.1) { 25 | width = 180; 26 | height = 170; 27 | } else if(_controller.value <= 0.3) { 28 | width = 50; 29 | height = 50; 30 | } else if (_controller.value <= 0.5) { 31 | width = 180; 32 | height = 170; 33 | } else if (_controller.value <= 0.7) { 34 | width = 150; 35 | height = 50; 36 | } else if (_controller.value <= 1) { 37 | width = 50; 38 | height = 50; 39 | } 40 | }); 41 | }); 42 | super.initState(); 43 | } 44 | 45 | @override 46 | void dispose() { 47 | _controller.dispose(); 48 | super.dispose(); 49 | } 50 | 51 | @override 52 | Widget build(BuildContext context) { 53 | return Container( 54 | height: 400, 55 | child: Column( 56 | children: [ 57 | RotationTransition( 58 | turns: Tween(begin: 0.0, end: 1.0).animate(_controller), 59 | child: AnimatedContainer( 60 | duration: Duration(milliseconds: 1000), 61 | width: width, 62 | height: height, 63 | color: Colors.orangeAccent, 64 | ), 65 | ), 66 | SizedBox(height: 50), 67 | RaisedButton( 68 | child: Text("go"), 69 | onPressed: () => _controller.forward(), 70 | ), 71 | RaisedButton( 72 | child: Text("stop"), 73 | onPressed: () => _controller.reset(), 74 | ), 75 | ], 76 | ), 77 | ); 78 | } 79 | } -------------------------------------------------------------------------------- /lib/pages/no_connection.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class NoConnection extends StatefulWidget { 4 | const NoConnection({ Key? key }) : super(key: key); 5 | 6 | @override 7 | _NoConnectionState createState() => _NoConnectionState(); 8 | } 9 | 10 | class _NoConnectionState extends State { 11 | @override 12 | Widget build(BuildContext context) { 13 | return Scaffold( 14 | backgroundColor: Colors.white, 15 | body: Column( 16 | mainAxisAlignment: MainAxisAlignment.end, 17 | children: [ 18 | Container( 19 | child: Image.asset('assets/no-connection.gif'), 20 | ), 21 | Container( 22 | height: MediaQuery.of(context).size.height / 2.5 , 23 | padding: EdgeInsets.symmetric(horizontal: 50, vertical: 50), 24 | decoration: BoxDecoration( 25 | color: Colors.grey.shade50, 26 | borderRadius: BorderRadius.only( 27 | topLeft: Radius.circular(60), 28 | topRight: Radius.circular(60), 29 | ), 30 | ), 31 | child: Column( 32 | children: [ 33 | Text("Ooops! 😓", style: TextStyle(fontSize: 32, fontWeight: FontWeight.w500, color: Colors.black),), 34 | SizedBox(height: 15,), 35 | Text("No internet connection found. Check your connection or try again.", 36 | textAlign: TextAlign.center, style: TextStyle( 37 | color: Colors.black, 38 | fontSize: 16, 39 | ),), 40 | SizedBox(height: 60,), 41 | MaterialButton( 42 | onPressed: () {}, 43 | height: 45, 44 | padding: EdgeInsets.symmetric(horizontal: 50), 45 | elevation: 0, 46 | shape: RoundedRectangleBorder( 47 | borderRadius: BorderRadius.circular(10) 48 | ), 49 | color: Colors.orange.shade400, 50 | child: Text("Try Again", style: TextStyle(color: Colors.white),), 51 | ) 52 | ], 53 | ), 54 | ) 55 | ], 56 | ), 57 | ); 58 | } 59 | } -------------------------------------------------------------------------------- /android/app/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 3 | 6 | 13 | 17 | 21 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 37 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /ios/Runner/Base.lproj/LaunchScreen.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## Flutter examples 2 | 3 | Here you can find some Flutter examples. 4 | 5 | ## Development Setup 6 | Clone the repository and run the following commands: 7 | ``` 8 | flutter pub get 9 | flutter run 10 | ``` 11 | 12 | ## Screenshots 13 | 14 | ### Wallet 15 | 16 | 17 | ### Expenses 18 | 19 | 20 | ### Stocks 21 | 22 | 23 | ### Register with Phone Page 24 | 25 | 26 | ### Login Page 27 | 28 | 29 | ### Movies List 30 | 31 | 32 | ### Discover Page 33 | 34 | 35 | ### Design Tools 36 | 37 | 38 | ### Onboarding 39 | 40 | 41 | ### Collection Page 42 | 43 | 44 | ### Verification Page 45 | 46 | 47 | ### Dancing Man 48 | 49 | 50 | ### Tea Page 51 | 52 | 53 | ### Helicopter 54 | 55 | 56 | ### Squid Game 57 | 58 | 59 | ### Github Users Page 60 | 61 | 62 | ### Concentric Transition Page 63 | 64 | 65 | ### Vertical Card Pager Page 66 | 67 | 68 | ### Odometer Example Page 69 | 70 | 71 | ### Staggered Grid View Page 72 | 73 | 74 | ### Light Switch Page 75 | 76 | 77 | ### Custom BottomnavigationBar 78 | 79 | 80 | ### No-Connection Page 81 | 82 | 83 | ### Skeleton Loading Page 84 | 85 | 86 | ### Bordered Button 87 | 88 | 89 | ### Fade Animation with AnimatedOpacity 90 | 91 | 92 | ## Links 93 | 94 | * [Website](https://afgprogrammer.com) 95 | * [Youtube channel](https://youtube.com/afgprogrammer) 96 | * [Twitter](https://twitter.com/afgprogrammer) 97 | * [Instagram](https://instagram.com/afgprogrammer) 98 | -------------------------------------------------------------------------------- /lib/pages/skeleton_loading.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:shimmer/shimmer.dart'; 3 | 4 | class SkeletonLoading extends StatefulWidget { 5 | const SkeletonLoading({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _SkeletonLoadingState createState() => _SkeletonLoadingState(); 9 | } 10 | 11 | class _SkeletonLoadingState extends State { 12 | @override 13 | Widget build(BuildContext context) { 14 | return Scaffold( 15 | appBar: AppBar( 16 | backgroundColor: Colors.white, 17 | elevation: 0, 18 | title: Text("Skeleton Loading with shimmer", style: TextStyle(color: Colors.black),), 19 | ), 20 | body: Padding( 21 | padding: const EdgeInsets.all(20.0), 22 | child: ListView.builder( 23 | itemCount: 8, 24 | itemBuilder: (BuildContext ctx, index) { 25 | int timer = 1000; 26 | return Shimmer.fromColors( 27 | baseColor: Colors.grey.shade300, 28 | highlightColor: Colors.white, 29 | period: Duration(milliseconds: timer), 30 | child: box(), 31 | ); 32 | } 33 | ), 34 | ), 35 | floatingActionButton: FloatingActionButton( 36 | onPressed: () {}, 37 | child: Icon(Icons.add), 38 | ), 39 | ); 40 | } 41 | 42 | 43 | Widget box(){ 44 | return Container( 45 | margin: EdgeInsets.only(bottom: 20), 46 | decoration: BoxDecoration( 47 | borderRadius: BorderRadius.circular(15) 48 | ), 49 | child: Row( 50 | children: [ 51 | Container( 52 | width: 50, 53 | height: 50, 54 | decoration: BoxDecoration( 55 | shape: BoxShape.circle, 56 | color: Colors.grey 57 | ), 58 | ), 59 | SizedBox(width: 20), 60 | Expanded( 61 | child: Column( 62 | crossAxisAlignment: CrossAxisAlignment.start, 63 | children: [ 64 | Container( 65 | width: double.infinity, 66 | height: 10, 67 | decoration: BoxDecoration( 68 | borderRadius: BorderRadius.circular(50), 69 | color: Colors.grey 70 | ), 71 | ), 72 | 73 | SizedBox(height: 10,), 74 | Container( 75 | width: 150, 76 | height: 10, 77 | decoration: BoxDecoration( 78 | borderRadius: BorderRadius.circular(50), 79 | color: Colors.grey 80 | ), 81 | ) 82 | ], 83 | ), 84 | ) 85 | ], 86 | ), 87 | ); 88 | } 89 | } -------------------------------------------------------------------------------- /lib/pages/vartical_card_pager.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:vertical_card_pager/vertical_card_pager.dart'; 3 | 4 | class VerticalCardPagerExample extends StatefulWidget { 5 | const VerticalCardPagerExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _VerticalCardPagerExampleState createState() => _VerticalCardPagerExampleState(); 9 | } 10 | 11 | class _VerticalCardPagerExampleState extends State { 12 | final List images = [ 13 | ClipRRect( 14 | borderRadius: BorderRadius.circular(10), 15 | child: Image.network("https://images.unsplash.com/photo-1541778480-fc1752bbc2a9?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Njl8fHdhdGNofGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=400&q=60", fit: BoxFit.cover,), 16 | ), 17 | ClipRRect( 18 | borderRadius: BorderRadius.circular(10), 19 | child: Image.network("https://images.unsplash.com/photo-1434056886845-dac89ffe9b56?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTh8fHdhdGNofGVufDB8fDB8fA%3D%3D&auto=format&fit=crop&w=400&q=60", fit: BoxFit.cover,), 20 | ), 21 | ClipRRect( 22 | borderRadius: BorderRadius.circular(10), 23 | child: Image.network("https://images.unsplash.com/photo-1508685096489-7aacd43bd3b1?ixid=MnwxMjA3fDB8MHxzZWFyY2h8OXx8d2F0Y2h8ZW58MHx8MHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=400&q=60", fit: BoxFit.cover,), 24 | ), 25 | ClipRRect( 26 | borderRadius: BorderRadius.circular(10), 27 | child: Image.network("https://images.unsplash.com/photo-1547996160-81dfa63595aa?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MjJ8fHdhdGNofGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=400&q=60", fit: BoxFit.cover,), 28 | ), 29 | ClipRRect( 30 | borderRadius: BorderRadius.circular(10), 31 | child: Image.network("https://images.unsplash.com/photo-1617714651073-17a0fcd14f9e?ixid=MnwxMjA3fDB8MHxzZWFyY2h8NDd8fHdhdGNofGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=400&q=60", fit: BoxFit.cover,), 32 | ), 33 | ClipRRect( 34 | borderRadius: BorderRadius.circular(10), 35 | child: Image.network("https://images.unsplash.com/photo-1618828272323-9f46e858e55e?ixid=MnwxMjA3fDB8MHxzZWFyY2h8NTB8fHdhdGNofGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=400&q=60", fit: BoxFit.cover,), 36 | ), 37 | ]; 38 | 39 | final List titles = ['', '', '', '', '', '']; 40 | 41 | @override 42 | Widget build(BuildContext context) { 43 | return Scaffold( 44 | body: SafeArea( 45 | child: Padding( 46 | padding: const EdgeInsets.all(30.0), 47 | child: Column( 48 | children: [ 49 | Expanded( 50 | child: VerticalCardPager( 51 | images: images, 52 | titles: titles, 53 | onPageChanged: (page) {}, 54 | onSelectedItem: (index) { 55 | print(index); 56 | }, 57 | ) 58 | ), 59 | ], 60 | ), 61 | ), 62 | ), 63 | ); 64 | } 65 | } -------------------------------------------------------------------------------- /lib/pages/dancing_man.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class DancingMan extends StatefulWidget { 4 | const DancingMan({ Key? key }) : super(key: key); 5 | 6 | @override 7 | _DancingManState createState() => _DancingManState(); 8 | } 9 | 10 | class _DancingManState extends State with SingleTickerProviderStateMixin { 11 | bool _isDancing = false; 12 | 13 | // margin animation from bottom 14 | late AnimationController _marginAnimationController; 15 | Animation? _marginAnimation; 16 | 17 | @override 18 | void initState() { 19 | super.initState(); 20 | 21 | _marginAnimationController = AnimationController( 22 | duration: const Duration(seconds: 2), 23 | vsync: this, 24 | ); 25 | 26 | _marginAnimation = Tween( 27 | begin: 20.0, 28 | end: 0.0, 29 | ).animate( 30 | CurvedAnimation( 31 | parent: _marginAnimationController, 32 | curve: Curves.easeInOut, 33 | ), 34 | ); 35 | 36 | _marginAnimationController.repeat(); 37 | } 38 | 39 | @override 40 | Widget build(BuildContext context) { 41 | return Scaffold( 42 | backgroundColor: Color(0xffF8AD19), 43 | body: Container( 44 | height: MediaQuery.of(context).size.height, 45 | child: GestureDetector( 46 | onPanUpdate: (details) { 47 | if (details.delta.dy > -5) { 48 | setState(() { 49 | _isDancing = false; 50 | }); 51 | } else { 52 | setState(() { 53 | _isDancing = true; 54 | }); 55 | } 56 | }, 57 | child: Column( 58 | mainAxisAlignment: MainAxisAlignment.center, 59 | children: [ 60 | _isDancing ? 61 | Image.asset('assets/dancing-man.gif', 62 | height: 500, fit: BoxFit.cover,) 63 | : Image.asset('assets/stop-man.png', height: 500,), 64 | 65 | SizedBox(height: 50,), 66 | // animated arrow up Icon 67 | _isDancing ? 68 | Column( 69 | children: [ 70 | Text("Swipe Down to Stop"), 71 | SizedBox(height: 20,), 72 | Icon(Icons.keyboard_arrow_down, color: Colors.black, size: 30,), 73 | ], 74 | ) 75 | : 76 | Column( 77 | children: [ 78 | AnimatedBuilder( 79 | animation: _marginAnimation!, 80 | builder: (context, child) { 81 | return Transform.translate( 82 | offset: Offset(0, _marginAnimation!.value), 83 | child: Icon(Icons.keyboard_arrow_up, color: Colors.black, size: 30,), 84 | ); 85 | }, 86 | ), 87 | SizedBox(height: 20,), 88 | Text("Swipe Up To Play"), 89 | ], 90 | ) 91 | ], 92 | ), 93 | ) 94 | ), 95 | ); 96 | } 97 | } -------------------------------------------------------------------------------- /lib/pages/loading.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:loading_indicator/loading_indicator.dart'; 3 | 4 | class LoadingExample extends StatefulWidget { 5 | const LoadingExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _LoadingExampleState createState() => _LoadingExampleState(); 9 | } 10 | 11 | class _LoadingExampleState extends State { 12 | 13 | @override 14 | Widget build(BuildContext context) { 15 | return Scaffold( 16 | body: SafeArea( 17 | child: Container( 18 | padding: EdgeInsets.symmetric(vertical: 50), 19 | width: double.infinity, 20 | child: Column( 21 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 22 | crossAxisAlignment: CrossAxisAlignment.center, 23 | children: [ 24 | Container( 25 | width: 100, 26 | child: LoadingIndicator( 27 | indicatorType: Indicator.ballScaleMultiple, 28 | colors: [Colors.red, Colors.green, Colors.blue, Colors.orange, Colors.deepPurple], 29 | strokeWidth: 2, 30 | ), 31 | ), 32 | Container( 33 | width: 100, 34 | child: LoadingIndicator( 35 | indicatorType: Indicator.ballSpinFadeLoader, 36 | colors: [Colors.red, Colors.green, Colors.blue, Colors.orange, Colors.deepPurple], 37 | strokeWidth: 2, 38 | ), 39 | ), 40 | Container( 41 | width: 100, 42 | child: LoadingIndicator( 43 | indicatorType: Indicator.pacman, 44 | colors: [Colors.red, Colors.green, Colors.blue, Colors.orange, Colors.deepPurple], 45 | strokeWidth: 2, 46 | ), 47 | ), 48 | Container( 49 | width: 100, 50 | child: LoadingIndicator( 51 | indicatorType: Indicator.lineScale, 52 | colors: [Colors.red, Colors.green, Colors.blue, Colors.orange, Colors.deepPurple], 53 | strokeWidth: 2, 54 | ), 55 | ), 56 | Container( 57 | width: 100, 58 | child: LoadingIndicator( 59 | indicatorType: Indicator.ballClipRotateMultiple, 60 | colors: [Colors.red, Colors.green, Colors.blue, Colors.orange, Colors.deepPurple], 61 | strokeWidth: 2, 62 | ), 63 | ), 64 | Container( 65 | width: 100, 66 | child: LoadingIndicator( 67 | indicatorType: Indicator.ballRotate, 68 | colors: [Colors.red, Colors.green, Colors.blue, Colors.orange, Colors.deepPurple], 69 | strokeWidth: 2, 70 | ), 71 | ), 72 | ], 73 | ), 74 | ), 75 | ), 76 | ); 77 | } 78 | } 79 | -------------------------------------------------------------------------------- /ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "size" : "20x20", 5 | "idiom" : "iphone", 6 | "filename" : "Icon-App-20x20@2x.png", 7 | "scale" : "2x" 8 | }, 9 | { 10 | "size" : "20x20", 11 | "idiom" : "iphone", 12 | "filename" : "Icon-App-20x20@3x.png", 13 | "scale" : "3x" 14 | }, 15 | { 16 | "size" : "29x29", 17 | "idiom" : "iphone", 18 | "filename" : "Icon-App-29x29@1x.png", 19 | "scale" : "1x" 20 | }, 21 | { 22 | "size" : "29x29", 23 | "idiom" : "iphone", 24 | "filename" : "Icon-App-29x29@2x.png", 25 | "scale" : "2x" 26 | }, 27 | { 28 | "size" : "29x29", 29 | "idiom" : "iphone", 30 | "filename" : "Icon-App-29x29@3x.png", 31 | "scale" : "3x" 32 | }, 33 | { 34 | "size" : "40x40", 35 | "idiom" : "iphone", 36 | "filename" : "Icon-App-40x40@2x.png", 37 | "scale" : "2x" 38 | }, 39 | { 40 | "size" : "40x40", 41 | "idiom" : "iphone", 42 | "filename" : "Icon-App-40x40@3x.png", 43 | "scale" : "3x" 44 | }, 45 | { 46 | "size" : "60x60", 47 | "idiom" : "iphone", 48 | "filename" : "Icon-App-60x60@2x.png", 49 | "scale" : "2x" 50 | }, 51 | { 52 | "size" : "60x60", 53 | "idiom" : "iphone", 54 | "filename" : "Icon-App-60x60@3x.png", 55 | "scale" : "3x" 56 | }, 57 | { 58 | "size" : "20x20", 59 | "idiom" : "ipad", 60 | "filename" : "Icon-App-20x20@1x.png", 61 | "scale" : "1x" 62 | }, 63 | { 64 | "size" : "20x20", 65 | "idiom" : "ipad", 66 | "filename" : "Icon-App-20x20@2x.png", 67 | "scale" : "2x" 68 | }, 69 | { 70 | "size" : "29x29", 71 | "idiom" : "ipad", 72 | "filename" : "Icon-App-29x29@1x.png", 73 | "scale" : "1x" 74 | }, 75 | { 76 | "size" : "29x29", 77 | "idiom" : "ipad", 78 | "filename" : "Icon-App-29x29@2x.png", 79 | "scale" : "2x" 80 | }, 81 | { 82 | "size" : "40x40", 83 | "idiom" : "ipad", 84 | "filename" : "Icon-App-40x40@1x.png", 85 | "scale" : "1x" 86 | }, 87 | { 88 | "size" : "40x40", 89 | "idiom" : "ipad", 90 | "filename" : "Icon-App-40x40@2x.png", 91 | "scale" : "2x" 92 | }, 93 | { 94 | "size" : "76x76", 95 | "idiom" : "ipad", 96 | "filename" : "Icon-App-76x76@1x.png", 97 | "scale" : "1x" 98 | }, 99 | { 100 | "size" : "76x76", 101 | "idiom" : "ipad", 102 | "filename" : "Icon-App-76x76@2x.png", 103 | "scale" : "2x" 104 | }, 105 | { 106 | "size" : "83.5x83.5", 107 | "idiom" : "ipad", 108 | "filename" : "Icon-App-83.5x83.5@2x.png", 109 | "scale" : "2x" 110 | }, 111 | { 112 | "size" : "1024x1024", 113 | "idiom" : "ios-marketing", 114 | "filename" : "Icon-App-1024x1024@1x.png", 115 | "scale" : "1x" 116 | } 117 | ], 118 | "info" : { 119 | "version" : 1, 120 | "author" : "xcode" 121 | } 122 | } 123 | -------------------------------------------------------------------------------- /lib/pages/bottom_navy_bar.dart: -------------------------------------------------------------------------------- 1 | import 'package:bottom_navy_bar/bottom_navy_bar.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class BottomNavyBarExample extends StatefulWidget { 5 | const BottomNavyBarExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _BottomNavyBarExampleState createState() => _BottomNavyBarExampleState(); 9 | } 10 | 11 | class _BottomNavyBarExampleState extends State { 12 | int _selectedIndex = 0; 13 | PageController _pageController = PageController(initialPage: 0); 14 | 15 | @override 16 | Widget build(BuildContext context) { 17 | return Scaffold( 18 | body: Container( 19 | child: PageView( 20 | controller: _pageController, 21 | onPageChanged: (index) { 22 | setState(() { 23 | _selectedIndex = index; 24 | }); 25 | }, 26 | children: [ 27 | _buildPage( 28 | icon: Icons.apps, 29 | title: '@theflutterlover', 30 | color: Colors.red, 31 | ), 32 | _buildPage( 33 | icon: Icons.person, 34 | title: 'Profile', 35 | color: Colors.pink, 36 | ), 37 | _buildPage( 38 | icon: Icons.message, 39 | title: 'Messages', 40 | color: Colors.orange, 41 | ), 42 | _buildPage( 43 | icon: Icons.settings, 44 | title: 'Settings', 45 | color: Colors.blue, 46 | ), 47 | ], 48 | ), 49 | ), 50 | bottomNavigationBar: BottomNavyBar( 51 | selectedIndex: _selectedIndex, 52 | showElevation: false, 53 | onItemSelected: (index) => setState(() { 54 | _selectedIndex = index; 55 | _pageController.animateToPage(index, 56 | duration: Duration(milliseconds: 300), curve: Curves.ease); 57 | }), 58 | items: [ 59 | BottomNavyBarItem( 60 | icon: Icon(Icons.apps), 61 | title: Text('Home'), 62 | activeColor: Colors.red, 63 | ), 64 | BottomNavyBarItem( 65 | icon: Icon(Icons.people), 66 | title: Text('Users'), 67 | activeColor: Colors.purpleAccent 68 | ), 69 | BottomNavyBarItem( 70 | icon: Icon(Icons.message), 71 | title: Text('Messages'), 72 | activeColor: Colors.pink 73 | ), 74 | BottomNavyBarItem( 75 | icon: Icon(Icons.settings), 76 | title: Text('Settings'), 77 | activeColor: Colors.blue 78 | ), 79 | ], 80 | ) 81 | ); 82 | } 83 | 84 | _buildPage ({ IconData? icon, String? title, Color? color }) { 85 | return Container( 86 | color: color, 87 | child: Center( 88 | child: Column( 89 | mainAxisSize: MainAxisSize.min, 90 | children: [ 91 | Icon(icon, size: 200.0, color: Colors.white), 92 | Text(title!, style: TextStyle(color: Colors.white, fontSize: 20)), 93 | ], 94 | ), 95 | ), 96 | ); 97 | } 98 | } 99 | -------------------------------------------------------------------------------- /lib/pages/bouncing_widget.dart: -------------------------------------------------------------------------------- 1 | import 'package:bouncing_widget/bouncing_widget.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class BouncingWidgetExample extends StatefulWidget { 5 | const BouncingWidgetExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _BouncingWidgetExampleState createState() => _BouncingWidgetExampleState(); 9 | } 10 | 11 | class _BouncingWidgetExampleState extends State { 12 | @override 13 | Widget build(BuildContext context) { 14 | return Scaffold( 15 | appBar: AppBar( 16 | elevation: 0, 17 | backgroundColor: Colors.orange, 18 | title: const Text('Bouncing Widget'), 19 | ), 20 | body: Container( 21 | width: double.infinity, 22 | child: Column( 23 | mainAxisAlignment: MainAxisAlignment.center, 24 | children: [ 25 | BouncingWidget( 26 | duration: Duration(milliseconds: 100), 27 | scaleFactor: 1.5, 28 | onPressed: () { 29 | print("onPressed"); 30 | }, 31 | child: Text( 32 | "@theflutterlover", 33 | style: TextStyle( 34 | color: Colors.orange, 35 | fontWeight: FontWeight.bold, 36 | fontSize: 35, 37 | ), 38 | ), 39 | ), 40 | SizedBox(height: 30,), 41 | // BouncingWidget( 42 | // duration: Duration(milliseconds: 100), 43 | // scaleFactor: 1.5, 44 | // onPressed: () { 45 | // print("onPressed"); 46 | // }, 47 | // child: Container( 48 | // width: 200, 49 | // height: 200, 50 | // color: Colors.red, 51 | // ) 52 | // ), 53 | BouncingWidget( 54 | duration: Duration(milliseconds: 100), 55 | scaleFactor: 1.5, 56 | onPressed: () { 57 | print("onPressed"); 58 | }, 59 | child: MaterialButton( 60 | onPressed: null, 61 | color: Colors.deepOrange, 62 | disabledColor: Colors.deepOrange, 63 | minWidth: 200, 64 | height: 50, 65 | child: Text("Click on Me", style: TextStyle(color: Colors.white, fontSize: 20),), 66 | ) 67 | ), 68 | SizedBox(height: 50,), 69 | BouncingWidget( 70 | duration: Duration(milliseconds: 100), 71 | scaleFactor: 1.5, 72 | onPressed: () { 73 | print("onPressed"); 74 | }, 75 | child: Container( 76 | margin: EdgeInsets.symmetric(horizontal: 20), 77 | width: double.infinity, 78 | height: 50, 79 | decoration: BoxDecoration( 80 | color: Colors.white, 81 | borderRadius: BorderRadius.circular(8), 82 | border: Border.all(color: Colors.grey.shade200), 83 | boxShadow: [ 84 | BoxShadow( 85 | color: Colors.grey.shade200, 86 | offset: Offset(0, 3), 87 | blurRadius: 10 88 | ) 89 | ] 90 | ), 91 | )) 92 | ], 93 | ), 94 | ), 95 | ); 96 | } 97 | } -------------------------------------------------------------------------------- /ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme: -------------------------------------------------------------------------------- 1 | 2 | 5 | 8 | 9 | 15 | 21 | 22 | 23 | 24 | 25 | 30 | 31 | 32 | 33 | 39 | 40 | 41 | 42 | 43 | 44 | 54 | 56 | 62 | 63 | 64 | 65 | 66 | 67 | 73 | 75 | 81 | 82 | 83 | 84 | 86 | 87 | 90 | 91 | 92 | -------------------------------------------------------------------------------- /lib/pages/dream_job.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:flutter/material.dart'; 3 | import 'package:google_fonts/google_fonts.dart'; 4 | 5 | class DreamJob extends StatefulWidget { 6 | const DreamJob({ Key? key }) : super(key: key); 7 | 8 | @override 9 | _DreamJobState createState() => _DreamJobState(); 10 | } 11 | 12 | class _DreamJobState extends State { 13 | @override 14 | Widget build(BuildContext context) { 15 | return Scaffold( 16 | backgroundColor: Color(0xffF1EBDA), 17 | body: Container( 18 | width: double.infinity, 19 | child: Column( 20 | crossAxisAlignment: CrossAxisAlignment.start, 21 | mainAxisAlignment: MainAxisAlignment.spaceAround, 22 | children: [ 23 | SizedBox(height: 50,), 24 | FadeInUp( 25 | duration: Duration(milliseconds: 1500), 26 | child: Image.network('https://cdn.dribbble.com/users/730703/screenshots/4145366/media/eef764c28f9547b693ab61fb655ec371.gif', fit: BoxFit.cover,)), 27 | Padding( 28 | padding: EdgeInsets.symmetric(horizontal: 30.0), 29 | child: Column( 30 | crossAxisAlignment: CrossAxisAlignment.start, 31 | children: [ 32 | FadeInUp( 33 | delay: Duration(milliseconds: 1000), 34 | duration: Duration(milliseconds: 1000), 35 | child: Text("Your dream job is waiting for you!", style: GoogleFonts.robotoSlab( 36 | fontSize: 32, 37 | fontWeight: FontWeight.w600 38 | ),), 39 | ), 40 | SizedBox(height: 10,), 41 | FadeInUp( 42 | delay: Duration(milliseconds: 1200), 43 | duration: Duration(milliseconds: 1000), 44 | child: Text("Discover milions of jobs and get in \ntouch with hiring managers.", style: GoogleFonts.robotoSlab( 45 | fontSize: 16, 46 | height: 1.8, 47 | color: Colors.grey.shade700 48 | ),), 49 | ), 50 | ], 51 | ), 52 | ), 53 | FadeInUp( 54 | delay: Duration(milliseconds: 1300), 55 | duration: Duration(milliseconds: 1000), 56 | child: Padding( 57 | padding: EdgeInsets.symmetric(horizontal: 30, vertical: 20), 58 | child: Row( 59 | mainAxisAlignment: MainAxisAlignment.end, 60 | children: [ 61 | MaterialButton( 62 | onPressed: () { 63 | Navigator.of(context).pushReplacementNamed('/'); 64 | }, 65 | color: Colors.black, 66 | height: 45, 67 | shape: RoundedRectangleBorder( 68 | borderRadius: BorderRadius.circular(8) 69 | ), 70 | padding: EdgeInsets.only(left: 25, right: 25, bottom: 4), 71 | child: Center( 72 | child: Text("Get Started", style: GoogleFonts.robotoSlab( 73 | fontSize: 16, 74 | color: Colors.white 75 | ),), 76 | ) 77 | ), 78 | // TextButton( 79 | // onPressed: () {}, 80 | // child: Text("SKIP", style: GoogleFonts.robotoSlab( 81 | // fontSize: 14, 82 | // fontWeight: FontWeight.w600, 83 | // height: 1.8, 84 | // color: Colors.black 85 | // ),) 86 | // ), 87 | ], 88 | ), 89 | ), 90 | ), 91 | ], 92 | ), 93 | ), 94 | ); 95 | } 96 | } 97 | -------------------------------------------------------------------------------- /lib/pages/learn_flutter.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:flutter/material.dart'; 3 | import 'package:google_fonts/google_fonts.dart'; 4 | 5 | class LearnFlutter extends StatefulWidget { 6 | const LearnFlutter({ Key? key }) : super(key: key); 7 | 8 | @override 9 | _LearnFlutterState createState() => _LearnFlutterState(); 10 | } 11 | 12 | class _LearnFlutterState extends State { 13 | @override 14 | Widget build(BuildContext context) { 15 | return Scaffold( 16 | backgroundColor: Color(0xffF6DEC8), 17 | body: Container( 18 | width: double.infinity, 19 | child: Column( 20 | crossAxisAlignment: CrossAxisAlignment.start, 21 | mainAxisAlignment: MainAxisAlignment.spaceAround, 22 | children: [ 23 | SizedBox(height: 50,), 24 | FadeInUp( 25 | duration: Duration(milliseconds: 1500), 26 | child: Image.network('https://cdn.dribbble.com/users/3484830/screenshots/16787618/media/b134e73ef667b926c76d8ce3f962dba2.gif', fit: BoxFit.cover,)), 27 | Padding( 28 | padding: EdgeInsets.symmetric(horizontal: 30.0), 29 | child: Column( 30 | crossAxisAlignment: CrossAxisAlignment.start, 31 | children: [ 32 | FadeInUp( 33 | delay: Duration(milliseconds: 1000), 34 | duration: Duration(milliseconds: 1000), 35 | child: Text("Learning code is now more easy", style: GoogleFonts.robotoSlab( 36 | fontSize: 36, 37 | fontWeight: FontWeight.w600 38 | ),), 39 | ), 40 | SizedBox(height: 10,), 41 | FadeInUp( 42 | delay: Duration(milliseconds: 1200), 43 | duration: Duration(milliseconds: 1000), 44 | child: Text("Are you ready to learn languages \neasily in the funniest way?", style: GoogleFonts.robotoSlab( 45 | fontSize: 16, 46 | height: 1.8, 47 | color: Colors.grey.shade700 48 | ),), 49 | ), 50 | ], 51 | ), 52 | ), 53 | FadeInUp( 54 | delay: Duration(milliseconds: 1300), 55 | duration: Duration(milliseconds: 1000), 56 | child: Padding( 57 | padding: EdgeInsets.symmetric(horizontal: 30, vertical: 20), 58 | child: Row( 59 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 60 | children: [ 61 | MaterialButton( 62 | onPressed: () { 63 | Navigator.of(context).pushReplacementNamed('/'); 64 | }, 65 | color: Colors.black, 66 | height: 45, 67 | shape: RoundedRectangleBorder( 68 | borderRadius: BorderRadius.circular(8) 69 | ), 70 | padding: EdgeInsets.only(left: 25, right: 25, bottom: 4), 71 | child: Center( 72 | child: Text("Get Started", style: GoogleFonts.robotoSlab( 73 | fontSize: 16, 74 | color: Colors.white 75 | ),), 76 | ) 77 | ), 78 | TextButton( 79 | onPressed: () {}, 80 | child: Text("SKIP", style: GoogleFonts.robotoSlab( 81 | fontSize: 14, 82 | fontWeight: FontWeight.w600, 83 | height: 1.8, 84 | color: Colors.black 85 | ),) 86 | ), 87 | ], 88 | ), 89 | ), 90 | ), 91 | ], 92 | ), 93 | ), 94 | ); 95 | } 96 | } 97 | -------------------------------------------------------------------------------- /web/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | example 27 | 28 | 29 | 30 | 33 | 97 | 98 | 99 | -------------------------------------------------------------------------------- /lib/pages/bottom_navigation_bar.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class CustomBottomNavigationBar extends StatefulWidget { 4 | const CustomBottomNavigationBar({ Key? key }) : super(key: key); 5 | 6 | @override 7 | _CustomBottomNavigationBarState createState() => _CustomBottomNavigationBarState(); 8 | } 9 | 10 | class _CustomBottomNavigationBarState extends State { 11 | 12 | List tabs = [ 13 | Center(child: Text("Home",style: TextStyle(color: Colors.white))), 14 | Center(child: Text("Search",style: TextStyle(color: Colors.white))), 15 | Center(child: Text("Profile",style: TextStyle(color: Colors.white))), 16 | Center(child: Text("Notification",style: TextStyle(color: Colors.white))), 17 | Center(child: Text("Add item",style: TextStyle(color: Colors.white))), 18 | ]; 19 | 20 | int currentPage = 0; 21 | 22 | setPage(index) { 23 | setState(() { 24 | currentPage = index; 25 | }); 26 | } 27 | 28 | @override 29 | Widget build(BuildContext context) { 30 | return Scaffold( 31 | backgroundColor: Colors.grey.shade800, 32 | appBar: AppBar( 33 | elevation: 0, 34 | backgroundColor: Colors.grey.shade900, 35 | title: Text('Navigation Bar'), 36 | ), 37 | body: tabs[currentPage], 38 | floatingActionButton: FloatingActionButton( 39 | backgroundColor: Colors.blue.shade400, 40 | onPressed: () => setPage(4), 41 | child: Icon(Icons.add, color: Colors.white, size: 30,), 42 | ), 43 | floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked, 44 | bottomNavigationBar: BottomAppBar( 45 | color: Colors.grey.shade900, 46 | shape: CircularNotchedRectangle(), 47 | child: Container( 48 | height: 80, 49 | padding: EdgeInsets.symmetric(horizontal: 20), 50 | child: Row( 51 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 52 | children: [ 53 | IconButton( 54 | icon: Icon(Icons.home, color: currentPage == 0 ? Colors.white : 55 | Colors.grey, size: 30,), 56 | onPressed: () => setPage(0), 57 | ), 58 | IconButton( 59 | icon: Icon(Icons.search, color: currentPage == 0 ? Colors.white : 60 | Colors.grey, size: 30,), 61 | onPressed: () => setPage(1), 62 | ), 63 | SizedBox.shrink(), 64 | IconButton( 65 | icon: Icon(Icons.person, color: currentPage == 0 ? Colors.white : 66 | Colors.grey, size: 30,), 67 | onPressed: () => setPage(2), 68 | ), 69 | IconButton( 70 | icon: Icon(Icons.notifications_outlined, color: currentPage == 0 ? Colors.white : 71 | Colors.grey, size: 30,), 72 | onPressed: () => setPage(3), 73 | ) 74 | ], 75 | ) 76 | ) 77 | ), 78 | // bottomNavigationBar: FlashyTabBar( 79 | // selectedIndex: currentPage, 80 | // showElevation: true, 81 | // onItemSelected: (index) => setState(() { 82 | // currentPage = index; 83 | // }), 84 | // items: [ 85 | // FlashyTabBarItem( 86 | // icon: Icon(Icons.event), 87 | // title: Text('Events'), 88 | // ), 89 | // FlashyTabBarItem( 90 | // icon: Icon(Icons.search), 91 | // title: Text('Search'), 92 | // ), 93 | // FlashyTabBarItem( 94 | // icon: Icon(Icons.highlight), 95 | // title: Text('Highlights'), 96 | // ), 97 | // FlashyTabBarItem( 98 | // icon: Icon(Icons.settings), 99 | // title: Text('Settings'), 100 | // ), 101 | // FlashyTabBarItem( 102 | // icon: Icon(Icons.settings), 103 | // title: Text('한국어'), 104 | // ), 105 | // ], 106 | // ), 107 | ); 108 | } 109 | } -------------------------------------------------------------------------------- /lib/pages/light_switch.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class LightSwitch extends StatefulWidget { 4 | const LightSwitch({ Key? key }) : super(key: key); 5 | 6 | @override 7 | _LightSwitchState createState() => _LightSwitchState(); 8 | } 9 | 10 | class _LightSwitchState extends State with SingleTickerProviderStateMixin { 11 | bool _isOn = false; 12 | 13 | late double _scale; 14 | late AnimationController _controller; 15 | 16 | @override 17 | void initState() { 18 | _controller = AnimationController( 19 | vsync: this, 20 | duration: Duration( 21 | milliseconds: 300, 22 | ), 23 | lowerBound: 0.0, 24 | upperBound: 0.1, 25 | )..addListener(() { 26 | setState(() {}); 27 | }); 28 | 29 | super.initState(); 30 | } 31 | 32 | @override 33 | void dispose() { 34 | super.dispose(); 35 | _controller.dispose(); 36 | } 37 | 38 | @override 39 | Widget build(BuildContext context) { 40 | _scale = 1 - _controller.value; 41 | return Scaffold( 42 | body: Stack( 43 | children: [ 44 | Positioned( 45 | top: 0, 46 | bottom: 0, 47 | right: 0, 48 | left: 0, 49 | child: AnimatedContainer( 50 | duration: Duration(milliseconds: 300), 51 | color: _isOn ? Colors.yellow : Colors.grey.shade700, 52 | ), 53 | ), 54 | Positioned( 55 | left: MediaQuery.of(context).size.width / 2 - 4, 56 | right: MediaQuery.of(context).size.width / 2 - 4, 57 | child: Container( 58 | height: 200, 59 | decoration: BoxDecoration( 60 | color: Colors.grey.shade900, 61 | borderRadius: BorderRadius.circular(50), 62 | ), 63 | ), 64 | ), 65 | _isOn ? 66 | Positioned( 67 | left: MediaQuery.of(context).size.width / 2 - 75, 68 | right: MediaQuery.of(context).size.width / 2 - 75, 69 | top: 202, 70 | child: Transform.scale( 71 | scale: _scale, 72 | child: Transform.rotate( 73 | angle: 3.15, 74 | child: GestureDetector( 75 | onTapDown: _tapDown, 76 | onTapUp: _tapUp, 77 | onTap: () { 78 | setState(() { 79 | _isOn = false; 80 | }); 81 | }, 82 | child: Image.network('https://ouch-cdn2.icons8.com/X5fB-F4h5Z-W9fimJnFUJ_So5Z2Kh6ULPuw-I6jK790/rs:fit:784:1134/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvNzQ3/LzU1YzYyNmUxLTI5/ZTctNDFmNS04M2Rk/LTZmOTFiMzkwMTQ4/MS5zdmc.png', width: 150,) 83 | ) 84 | ), 85 | ), 86 | ) : 87 | Positioned( 88 | left: MediaQuery.of(context).size.width / 2 - 75, 89 | right: MediaQuery.of(context).size.width / 2 - 75, 90 | top: 202, 91 | child: Transform.scale( 92 | scale: _scale, 93 | child: Transform.rotate( 94 | angle: 3.15, 95 | child: GestureDetector( 96 | onTapDown: _tapDown, 97 | onTapUp: _tapUp, 98 | onTap: () { 99 | setState(() { 100 | _isOn = true; 101 | }); 102 | }, 103 | child: Image.network('https://ouch-cdn2.icons8.com/GCKndOXpaXkSHmDQvtUOP2yMUrV9LSpXXJRneOqvM2o/rs:fit:784:1134/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvMTY1/L2Q2ZDBkNTkwLTBl/ZDAtNDA5MC05ZjUw/LTIzNGJjZjRmZDdm/Yy5zdmc.png', color: Colors.grey.shade800, width: 150,) 104 | ) 105 | ), 106 | ), 107 | ) 108 | ], 109 | ), 110 | ); 111 | } 112 | 113 | void _tapDown(TapDownDetails details) { 114 | _controller.forward(); 115 | } 116 | 117 | void _tapUp(TapUpDetails details) { 118 | _controller.reverse(); 119 | } 120 | } 121 | -------------------------------------------------------------------------------- /pubspec.yaml: -------------------------------------------------------------------------------- 1 | name: example 2 | description: A new Flutter project. 3 | 4 | # The following line prevents the package from being accidentally published to 5 | # pub.dev using `pub publish`. This is preferred for private packages. 6 | publish_to: 'none' # Remove this line if you wish to publish to pub.dev 7 | 8 | # The following defines the version and build number for your application. 9 | # A version number is three numbers separated by dots, like 1.2.43 10 | # followed by an optional build number separated by a +. 11 | # Both the version and the builder number may be overridden in flutter 12 | # build by specifying --build-name and --build-number, respectively. 13 | # In Android, build-name is used as versionName while build-number used as versionCode. 14 | # Read more about Android versioning at https://developer.android.com/studio/publish/versioning 15 | # In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion. 16 | # Read more about iOS versioning at 17 | # https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html 18 | version: 1.0.0+1 19 | 20 | environment: 21 | sdk: ^3.5.1 22 | 23 | dependencies: 24 | flutter: 25 | sdk: flutter 26 | 27 | # The following adds the Cupertino Icons font to your application. 28 | # Use with the CupertinoIcons class for iOS style icons. 29 | cupertino_icons: ^1.0.2 30 | shimmer: ^2.0.0 31 | # flashy_tab_bar: ^0.0.3 32 | flutter_staggered_grid_view: ^0.4.0 33 | iconsax: ^0.0.8 34 | dio: ^4.0.0 35 | url_launcher: ^6.0.12 36 | concentric_transition: ^1.0.1 37 | odometer: ^2.1.0 38 | vertical_card_pager: ^1.5.0 39 | loading_indicator: ^3.0.2 40 | animate_do: ^2.0.0 41 | # flutter_youtube_view: ^2.0.2 42 | flutter_verification_code: ^1.1.0 43 | liquid_swipe: ^2.1.0 44 | # intl_phone_number_input: ^0.7.0+2 45 | elastic_drawer: ^2.0.1 46 | bouncing_widget: ^2.0.0 47 | bottom_navy_bar: ^6.0.0 48 | salomon_bottom_bar: ^3.1.0 49 | avatar_glow: ^2.0.2 50 | carousel_slider: ^4.2.1 51 | google_fonts: ^2.1.0 52 | fl_chart: ^0.69.0 53 | searchfield: ^0.5.6 54 | circular_menu: ^1.2.3 55 | like_button: ^2.0.3 56 | # flutter_carousel_slider: ^1.0.8 57 | insta_like_button: ^0.1.1 58 | animated_button: ^0.2.0 59 | gradient_ui_widgets: ^1.0.2-nullsafety 60 | material_dialogs: ^1.1.1 61 | confetti: ^0.6.0 62 | curved_navigation_bar: ^1.0.1 63 | day_night_switcher: ^0.2.0+1 64 | flutter_colorpicker: ^1.0.2 65 | 66 | dev_dependencies: 67 | flutter_test: 68 | sdk: flutter 69 | 70 | # For information on the generic Dart part of this file, see the 71 | # following page: https://dart.dev/tools/pub/pubspec 72 | 73 | # The following section is specific to Flutter. 74 | flutter: 75 | 76 | # The following line ensures that the Material Icons font is 77 | # included with your application, so that you can use the icons in 78 | # the material Icons class. 79 | uses-material-design: true 80 | 81 | # To add assets to your application, add an assets section, like this: 82 | assets: 83 | - assets/ 84 | - assets/google_fonts/ 85 | # - assets/screenshots/ 86 | # - images/a_dot_burr.jpeg 87 | # - images/a_dot_ham.jpeg 88 | 89 | # An image asset can refer to one or more resolution-specific "variants", see 90 | # https://flutter.dev/assets-and-images/#resolution-aware. 91 | 92 | # For details regarding adding assets from package dependencies, see 93 | # https://flutter.dev/assets-and-images/#from-packages 94 | 95 | # To add custom fonts to your application, add a fonts section here, 96 | # in this "flutter" section. Each entry in this list should have a 97 | # "family" key with the font family name, and a "fonts" key with a 98 | # list giving the asset and other descriptors for the font. For 99 | # example: 100 | # fonts: 101 | # - family: Schyler 102 | # fonts: 103 | # - asset: fonts/Schyler-Regular.ttf 104 | # - asset: fonts/Schyler-Italic.ttf 105 | # style: italic 106 | # - family: Trajan Pro 107 | # fonts: 108 | # - asset: fonts/TrajanPro.ttf 109 | # - asset: fonts/TrajanPro_Bold.ttf 110 | # weight: 700 111 | # 112 | # For details regarding fonts from package dependencies, 113 | # see https://flutter.dev/custom-fonts/#from-packages 114 | -------------------------------------------------------------------------------- /lib/pages/tea_page.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class TeaPage extends StatefulWidget { 5 | const TeaPage({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _TeaPageState createState() => _TeaPageState(); 9 | } 10 | 11 | class _TeaPageState extends State { 12 | @override 13 | Widget build(BuildContext context) { 14 | return Scaffold( 15 | backgroundColor: Color(0xffFFC3A6), 16 | body: Container( 17 | width: double.infinity, 18 | child: Column( 19 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 20 | children: [ 21 | SizedBox(height: 50), 22 | FadeInRight( 23 | duration: Duration(milliseconds: 1500), 24 | child: Image.network('https://cdn.dribbble.com/users/115278/screenshots/16812737/media/93914b7224e59946c61b9dbde7542628.gif' 25 | ,fit: BoxFit.cover,), 26 | ), 27 | FadeInUp( 28 | duration: Duration(milliseconds: 1000), 29 | delay: Duration(milliseconds: 500), 30 | child: Container( 31 | padding: EdgeInsets.only(left: 50, top: 40, right: 20, bottom: 50), 32 | width: double.infinity, 33 | decoration: BoxDecoration( 34 | color: Colors.white, 35 | borderRadius: BorderRadius.only( 36 | topLeft: Radius.circular(60), 37 | topRight: Radius.circular(60), 38 | ), 39 | boxShadow: [ 40 | BoxShadow( 41 | color: Color(0xffFFC3A6).withOpacity(0.5), 42 | offset: Offset(0, -5), 43 | blurRadius: 20, 44 | ), 45 | ], 46 | ), 47 | child: Column( 48 | crossAxisAlignment: CrossAxisAlignment.start, 49 | children: [ 50 | FadeInUp( 51 | duration: Duration(milliseconds: 1000), 52 | delay: Duration(milliseconds: 1000), 53 | from: 50, 54 | child: Text( 55 | 'Discover the best \norganic asian tea.🔥', 56 | // textAlign: TextAlign.center, 57 | style: TextStyle( 58 | fontSize: 24, 59 | fontWeight: FontWeight.w600, 60 | color: Colors.black, 61 | ), 62 | ), 63 | ), 64 | SizedBox(height: 15), 65 | FadeInUp( 66 | duration: Duration(milliseconds: 1000), 67 | delay: Duration(milliseconds: 1000), 68 | from: 60, 69 | child: Text( 70 | 'Stright from motherland ⛰', 71 | textAlign: TextAlign.center, 72 | style: TextStyle( 73 | fontSize: 14, 74 | color: Colors.grey.shade600, 75 | ), 76 | ), 77 | ), 78 | SizedBox(height: 20), 79 | FadeInUp( 80 | duration: Duration(milliseconds: 1000), 81 | delay: Duration(milliseconds: 1000), 82 | from: 70, 83 | child: Align( 84 | alignment: Alignment.bottomRight, 85 | child: TextButton( 86 | onPressed: () { 87 | // reload the page 88 | Navigator.of(context).pushReplacementNamed('/'); 89 | }, 90 | child: Text( 91 | 'EXPLORE NOW ☕️', 92 | style: TextStyle( 93 | fontSize: 16, 94 | color: Colors.black, 95 | ), 96 | ), 97 | ), 98 | ), 99 | ) 100 | ] 101 | ) 102 | ), 103 | ), 104 | ], 105 | ), 106 | ), 107 | ); 108 | } 109 | } -------------------------------------------------------------------------------- /lib/pages/helicopter.dart: -------------------------------------------------------------------------------- 1 | import 'package:carousel_slider/carousel_slider.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class HelicopterPage extends StatefulWidget { 5 | const HelicopterPage({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _HelicopterPageState createState() => _HelicopterPageState(); 9 | } 10 | 11 | class _HelicopterPageState extends State { 12 | List _helicopters = [ 13 | { 14 | 'color': Color(0xff2DAAFA), 15 | 'image': 'https://cdn.dribbble.com/users/4584084/screenshots/9271491/media/f32107904c73530191707403fa4fa6ea.gif', 16 | }, 17 | { 18 | 'color': Color(0xffE7CB91), 19 | 'image': 'https://cdn.dribbble.com/users/721278/screenshots/6274521/helicopter_toy.gif', 20 | }, 21 | { 22 | 'color': Color(0xff731A01), 23 | 'image': 'https://cdn.dribbble.com/users/210956/screenshots/3829094/media/3b6073f14271b5f7f809f34b468ae07c.gif', 24 | } 25 | ]; 26 | 27 | int _current = 0; 28 | dynamic _selectedIndex = {}; 29 | 30 | CarouselController _carouselController = new CarouselController(); 31 | 32 | @override 33 | Widget build(BuildContext context) { 34 | return Scaffold( 35 | appBar: AppBar( 36 | elevation: 0, 37 | backgroundColor: Colors.white, 38 | title: Text('@theflutterlover', style: TextStyle( 39 | color: Colors.black, 40 | ),), 41 | ), 42 | body: Container( 43 | width: double.infinity, 44 | height: double.infinity, 45 | child: CarouselSlider( 46 | carouselController: _carouselController, 47 | options: CarouselOptions( 48 | height: 250.0, 49 | aspectRatio: 4/3, 50 | // viewportFraction: 0.70, 51 | // enlargeCenterPage: true, 52 | pageSnapping: true, 53 | onPageChanged: (index, reason) { 54 | setState(() { 55 | _current = index; 56 | }); 57 | } 58 | ), 59 | items: _helicopters.map((helicopter) { 60 | return Builder( 61 | builder: (BuildContext context) { 62 | return GestureDetector( 63 | onTap: () { 64 | // go to product view page with navigation push 65 | Navigator.of(context).push( 66 | MaterialPageRoute( 67 | builder: (context) => HelicopterView( 68 | helicopter: helicopter, 69 | ), 70 | ), 71 | ); 72 | }, 73 | child: AnimatedContainer( 74 | duration: Duration(milliseconds: 300), 75 | width: MediaQuery.of(context).size.width, 76 | margin: EdgeInsets.symmetric(horizontal: 10.0), 77 | decoration: BoxDecoration( 78 | color: Colors.white, 79 | borderRadius: BorderRadius.circular(20), 80 | boxShadow: [ 81 | BoxShadow( 82 | color: Colors.grey.withOpacity(0.2), 83 | blurRadius: 20, 84 | offset: Offset(0, 5) 85 | ) 86 | ] 87 | ), 88 | child: SingleChildScrollView( 89 | child: Column( 90 | children: [ 91 | Hero( 92 | transitionOnUserGestures: true, 93 | tag: helicopter['color'], 94 | child: Container( 95 | height: 250, 96 | // margin: EdgeInsets.only(top: 15), 97 | clipBehavior: Clip.hardEdge, 98 | decoration: BoxDecoration( 99 | borderRadius: BorderRadius.circular(20), 100 | ), 101 | child: Image.network(helicopter['image'], fit: BoxFit.cover), 102 | ), 103 | ), 104 | ], 105 | ), 106 | ), 107 | ), 108 | ); 109 | }, 110 | ); 111 | }).toList() 112 | ), 113 | ), 114 | ); 115 | } 116 | } 117 | 118 | class HelicopterView extends StatefulWidget { 119 | final dynamic helicopter; 120 | const HelicopterView({ Key? key, required this.helicopter }) : super(key: key); 121 | 122 | @override 123 | _HelicopterViewState createState() => _HelicopterViewState(); 124 | } 125 | 126 | class _HelicopterViewState extends State { 127 | @override 128 | Widget build(BuildContext context) { 129 | return Container( 130 | color: widget.helicopter['color'], 131 | child: Hero( 132 | tag: widget.helicopter['color'], 133 | transitionOnUserGestures: true, 134 | child: Image.network(widget.helicopter['image'])), 135 | ); 136 | } 137 | } 138 | -------------------------------------------------------------------------------- /lib/pages/new_collection.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class NewCollection extends StatefulWidget { 4 | const NewCollection({ Key? key }) : super(key: key); 5 | 6 | @override 7 | _NewCollectionState createState() => _NewCollectionState(); 8 | } 9 | 10 | class _NewCollectionState extends State { 11 | PageController? _pageController; 12 | int currentIndex = 0; 13 | 14 | @override 15 | void initState() { 16 | _pageController = PageController( 17 | initialPage: 0 18 | ); 19 | super.initState(); 20 | } 21 | 22 | @override 23 | void dispose() { 24 | _pageController!.dispose(); 25 | super.dispose(); 26 | } 27 | 28 | @override 29 | Widget build(BuildContext context) { 30 | return Scaffold( 31 | body: Container( 32 | child: Column( 33 | crossAxisAlignment: CrossAxisAlignment.start, 34 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 35 | children: [ 36 | Column( 37 | crossAxisAlignment: CrossAxisAlignment.start, 38 | children: [ 39 | Padding( 40 | padding: const EdgeInsets.only(right: 20.0, left: 20.0, top: 80.0), 41 | child: Column( 42 | crossAxisAlignment: CrossAxisAlignment.start, 43 | children: [ 44 | Text("Collection", style: TextStyle(fontSize: 25, color: Colors.grey.shade500),), 45 | Text("Winter 2021", style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold),), 46 | ], 47 | ), 48 | ), 49 | Row( 50 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 51 | children: [ 52 | Container( 53 | padding: EdgeInsets.all(20), 54 | child: Row( 55 | children: _buildIndicator(), 56 | ), 57 | ), 58 | Padding( 59 | padding: const EdgeInsets.all(20.0), 60 | child: MaterialButton( 61 | height: 50, 62 | minWidth: 50, 63 | padding: EdgeInsets.symmetric(horizontal: 10), 64 | color: Colors.black, 65 | shape: RoundedRectangleBorder( 66 | borderRadius: BorderRadius.circular(50), 67 | ), 68 | onPressed: () { 69 | _pageController!.nextPage(duration: Duration(milliseconds: 500), curve: Curves.ease); 70 | setState(() { 71 | }); 72 | }, 73 | child: Icon(Icons.arrow_forward_ios, color: Colors.white, size: 20,), 74 | ), 75 | ), 76 | ], 77 | ), 78 | ], 79 | ), 80 | Container( 81 | height: MediaQuery.of(context).size.height * 0.7, 82 | width: MediaQuery.of(context).size.width, 83 | child: PageView( 84 | onPageChanged: (int page) { 85 | setState(() { 86 | currentIndex = page; 87 | }); 88 | }, 89 | controller: _pageController, 90 | children: [ 91 | Image.network('https://images.unsplash.com/photo-1525457136159-8878648a7ad0?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTN8fHdpbnRlciUyMGNsb3RoaW5nfGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60', fit: BoxFit.cover,), 92 | Image.network('https://images.unsplash.com/photo-1549902529-a515e31f0c1c?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MjR8fHdpbnRlciUyMGNsb3RoaW5nfGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60', fit: BoxFit.cover,), 93 | Image.network('https://images.unsplash.com/photo-1611080922224-2e0c006a4943?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1yZWxhdGVkfDEyfHx8ZW58MHx8fHw%3D&auto=format&fit=crop&w=800&q=60', fit: BoxFit.cover,), 94 | Image.network('https://images.unsplash.com/flagged/photo-1574876668890-2ff765c77cda?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTU3fHx3aW50ZXIlMjBjbG90aGluZ3xlbnwwfHwwfHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60', fit: BoxFit.cover,), 95 | Image.network('https://images.unsplash.com/photo-1575919988855-f727358015b4?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Njd8fHdpbnRlciUyMGNsb3RoaW5nfGVufDB8fDB8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60', fit: BoxFit.cover,), 96 | ], 97 | ), 98 | ), 99 | ] 100 | ) 101 | ), 102 | ); 103 | } 104 | 105 | _indicator(bool isActive) { 106 | return AnimatedContainer( 107 | duration: Duration(milliseconds: 300), 108 | height: 6, 109 | width: isActive ? 50 : 10, 110 | margin: EdgeInsets.only(right: 5), 111 | decoration: BoxDecoration( 112 | color: isActive ? Colors.black : Colors.grey.shade500, 113 | borderRadius: BorderRadius.circular(5) 114 | ), 115 | ); 116 | } 117 | 118 | List _buildIndicator() { 119 | List indicators = []; 120 | for (int i = 0; i<5; i++) { 121 | if (currentIndex == i) { 122 | indicators.add(_indicator(true)); 123 | } else { 124 | indicators.add(_indicator(false)); 125 | } 126 | } 127 | 128 | return indicators; 129 | } 130 | } -------------------------------------------------------------------------------- /lib/pages/product_card.dart: -------------------------------------------------------------------------------- 1 | import 'package:carousel_slider/carousel_slider.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class ProductCard extends StatefulWidget { 5 | const ProductCard({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _ProductCardState createState() => _ProductCardState(); 9 | } 10 | 11 | class _ProductCardState extends State { 12 | int _current = 0; 13 | dynamic _selectedIndex = {}; 14 | 15 | CarouselController _carouselController = new CarouselController(); 16 | 17 | List _products = [ 18 | { 19 | 'title': 'Adidas Originals \nby Alexander Wang', 20 | 'image': 'https://images.unsplash.com/photo-1606107557195-0e29a4b5b4aa?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MzV8fGFkaWRhc3xlbnwwfHwwfHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=400&q=60', 21 | 'description': 'Limited collection' 22 | }, 23 | { 24 | 'title': 'Adidas Originals \nby Alexander Wang', 25 | 'image': 'https://images.unsplash.com/photo-1582588678413-dbf45f4823e9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2265&q=80', 26 | 'description': 'Limited collection' 27 | }, 28 | { 29 | 'title': 'Adidas Originals \nby Alexander Wang', 30 | 'image': 'https://images.unsplash.com/photo-1589188056053-28910dc61d38?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2264&q=80', 31 | 'description': 'Limited collection' 32 | } 33 | ]; 34 | 35 | @override 36 | Widget build(BuildContext context) { 37 | return Scaffold( 38 | floatingActionButton: _selectedIndex.length > 0 ? FloatingActionButton( 39 | onPressed: () {}, 40 | child: Icon(Icons.arrow_forward_ios), 41 | ) : null, 42 | appBar: AppBar( 43 | elevation: 0, 44 | backgroundColor: Colors.transparent, 45 | title: Text('@theflutterlover', style: TextStyle( 46 | color: Colors.black, 47 | ),), 48 | ), 49 | body: Container( 50 | width: double.infinity, 51 | height: double.infinity, 52 | child: CarouselSlider( 53 | carouselController: _carouselController, 54 | options: CarouselOptions( 55 | height: 450.0, 56 | aspectRatio: 16/9, 57 | viewportFraction: 0.70, 58 | enlargeCenterPage: true, 59 | pageSnapping: true, 60 | onPageChanged: (index, reason) { 61 | setState(() { 62 | _current = index; 63 | }); 64 | } 65 | ), 66 | items: _products.map((movie) { 67 | return Builder( 68 | builder: (BuildContext context) { 69 | return GestureDetector( 70 | onTap: () { 71 | setState(() { 72 | if (_selectedIndex == movie) { 73 | _selectedIndex = {}; 74 | } else { 75 | _selectedIndex = movie; 76 | } 77 | }); 78 | }, 79 | child: AnimatedContainer( 80 | duration: Duration(milliseconds: 300), 81 | width: MediaQuery.of(context).size.width, 82 | decoration: BoxDecoration( 83 | color: Colors.white, 84 | borderRadius: BorderRadius.circular(20), 85 | border: _selectedIndex == movie ? Border.all(color: Colors.blue.shade500, width: 3) : null, 86 | boxShadow: _selectedIndex == movie ? [ 87 | BoxShadow( 88 | color: Colors.blue.shade100, 89 | blurRadius: 30, 90 | offset: Offset(0, 10) 91 | ) 92 | ] : [ 93 | BoxShadow( 94 | color: Colors.grey.withOpacity(0.2), 95 | blurRadius: 20, 96 | offset: Offset(0, 5) 97 | ) 98 | ] 99 | ), 100 | child: SingleChildScrollView( 101 | child: Column( 102 | children: [ 103 | Container( 104 | height: 320, 105 | margin: EdgeInsets.only(top: 10), 106 | clipBehavior: Clip.hardEdge, 107 | decoration: BoxDecoration( 108 | borderRadius: BorderRadius.circular(20), 109 | ), 110 | child: Image.network(movie['image'], fit: BoxFit.cover), 111 | ), 112 | SizedBox(height: 20,), 113 | Text(movie['title'], style: TextStyle( 114 | fontSize: 16, 115 | fontWeight: FontWeight.bold 116 | ),), 117 | SizedBox(height: 20,), 118 | Text(movie['description'], style: TextStyle( 119 | fontSize: 14, 120 | color: Colors.grey.shade600 121 | ),), 122 | ], 123 | ), 124 | ), 125 | ), 126 | ); 127 | }, 128 | ); 129 | }).toList() 130 | ), 131 | ), 132 | ); 133 | } 134 | } -------------------------------------------------------------------------------- /lib/pages/awesome_dropdown_example.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:searchfield/searchfield.dart'; 3 | 4 | class AwesomeDropdownExample extends StatefulWidget { 5 | const AwesomeDropdownExample({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _AwesomeDropdownExampleState createState() => _AwesomeDropdownExampleState(); 9 | } 10 | 11 | class _AwesomeDropdownExampleState extends State { 12 | String? _selectedItem; 13 | 14 | @override 15 | Widget build(BuildContext context) { 16 | return Scaffold( 17 | appBar: AppBar( 18 | elevation: 0, 19 | backgroundColor: Colors.white, 20 | title: const Text('@theflutterlover', style: TextStyle( 21 | color: Colors.black, 22 | ),), 23 | ), 24 | body: Container( 25 | child: Column( 26 | crossAxisAlignment: CrossAxisAlignment.start, 27 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 28 | children: [ 29 | Container( 30 | height: MediaQuery.of(context).size.height * 0.7, 31 | child: Column( 32 | crossAxisAlignment: CrossAxisAlignment.start, 33 | mainAxisAlignment: MainAxisAlignment.center, 34 | children: [ 35 | Padding( 36 | padding: EdgeInsets.all(20.0), 37 | child: Text('Select a country', style: TextStyle( 38 | fontSize: 16, 39 | color: Colors.blueGrey 40 | ),), 41 | ), 42 | Container( 43 | width: double.infinity, 44 | margin: EdgeInsets.symmetric(horizontal: 20), 45 | decoration: BoxDecoration( 46 | color: Colors.white, 47 | borderRadius: BorderRadius.circular(10), 48 | boxShadow: [ 49 | BoxShadow( 50 | color: Colors.grey.withOpacity(0.2), 51 | blurRadius: 10, 52 | offset: Offset(0, 10), 53 | ), 54 | ], 55 | ), 56 | child: SearchField( 57 | hint: 'Search', 58 | searchInputDecoration: InputDecoration( 59 | enabledBorder: OutlineInputBorder( 60 | borderSide: BorderSide( 61 | color: Colors.blueGrey.shade200, 62 | width: 1, 63 | ), 64 | borderRadius: BorderRadius.circular(10), 65 | ), 66 | focusedBorder: OutlineInputBorder( 67 | borderSide: BorderSide( 68 | width: 2, 69 | color: Colors.blue.withOpacity(0.8), 70 | ), 71 | borderRadius: BorderRadius.circular(10), 72 | ), 73 | ), 74 | maxSuggestionsInViewPort: 6, 75 | itemHeight: 50, 76 | suggestionsDecoration: BoxDecoration( 77 | color: Colors.white, 78 | borderRadius: BorderRadius.circular(10), 79 | ), 80 | onTap: (value) { 81 | setState(() { 82 | _selectedItem = value!; 83 | }); 84 | 85 | print(value); 86 | }, 87 | suggestions: [ 88 | 'Afghanistan', 89 | 'Turkey', 90 | 'Germany', 91 | 'France', 92 | 'Italy', 93 | 'Spain', 94 | 'United Kingdom', 95 | 'United States', 96 | 'Canada', 97 | 'Australia', 98 | 'New Zealand', 99 | 'India', 100 | 'Indonesia', 101 | 'Bangladesh', 102 | 'Sri Lanka', 103 | ], 104 | ), 105 | ), 106 | ], 107 | ), 108 | ), 109 | Container( 110 | height: 90, 111 | padding: EdgeInsets.only(right: 20, left: 20, bottom: 20), 112 | decoration: BoxDecoration( 113 | color: Colors.white, 114 | ), 115 | child: Row( 116 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 117 | children: [ 118 | _selectedItem == null ? Text('Please select a Country to Continue', style: TextStyle( 119 | fontSize: 16, 120 | color: Colors.blueGrey 121 | ),) : Text(_selectedItem!, style: TextStyle( 122 | fontSize: 16, 123 | color: Colors.grey.shade800, 124 | fontWeight: FontWeight.w600 125 | )), 126 | MaterialButton( 127 | onPressed: () {}, 128 | color: Colors.black, 129 | minWidth: 50, 130 | height: 50, 131 | shape: RoundedRectangleBorder( 132 | borderRadius: BorderRadius.circular(50), 133 | ), 134 | padding: EdgeInsets.all(0), 135 | child: Icon(Icons.arrow_forward_ios, color: Colors.blueGrey, size: 24,), 136 | ) 137 | ], 138 | ), 139 | ) 140 | ], 141 | ), 142 | ), 143 | ); 144 | } 145 | } 146 | -------------------------------------------------------------------------------- /lib/pages/design_tools.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class DesignTools extends StatefulWidget { 5 | const DesignTools({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _DesignToolsState createState() => _DesignToolsState(); 9 | } 10 | 11 | class _DesignToolsState extends State { 12 | int selectedTool = 0; 13 | 14 | List tools = [ 15 | { 16 | 'image': 'https://cdn-icons-png.flaticon.com/128/732/732244.png', 17 | 'selected_image': 'https://cdn-icons-png.flaticon.com/128/732/732244.png', 18 | 'name': 'Sketch', 19 | 'description': 'The digital design platform.', 20 | }, 21 | { 22 | 'image': 'https://img.icons8.com/color/2x/adobe-xd.png', 23 | 'selected_image': 'https://img.icons8.com/color/2x/adobe-xd--v2.gif', 24 | 'name': 'Adobe XD', 25 | 'description': 'Fast & powerful UI/UX design solution.', 26 | }, 27 | { 28 | 'image': 'https://img.icons8.com/color/2x/figma.png', 29 | 'selected_image': 'https://img.icons8.com/color/2x/figma--v2.gif', 30 | 'name': 'Figma', 31 | 'description': 'The collaborative interface design tool.', 32 | } 33 | ]; 34 | 35 | @override 36 | Widget build(BuildContext context) { 37 | return Scaffold( 38 | body: Container( 39 | padding: EdgeInsets.all(20), 40 | child: Column( 41 | crossAxisAlignment: CrossAxisAlignment.start, 42 | children: [ 43 | SizedBox(height: 50,), 44 | FadeInDown( 45 | from: 30, 46 | child: Row( 47 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 48 | children: [ 49 | Text("Select a Design Tool", style: TextStyle( 50 | fontSize: 16, 51 | color: Colors.grey.shade800, 52 | fontWeight: FontWeight.bold 53 | ),), 54 | IconButton( 55 | onPressed: () {}, 56 | icon: Icon(Icons.close) 57 | ) 58 | ], 59 | ), 60 | ), 61 | SizedBox(height: 30,), 62 | FadeInDown( 63 | from: 50, 64 | child: Text("What do you want to learn?", style: TextStyle( 65 | color: Colors.blueGrey.shade400, 66 | fontSize: 20 67 | ),), 68 | ), 69 | SizedBox(height: 20,), 70 | Container( 71 | height: MediaQuery.of(context).size.height * 0.5, 72 | child: ListView.builder( 73 | itemCount: tools.length, 74 | itemBuilder: (context, index) { 75 | return GestureDetector( 76 | onTap: () { 77 | setState(() { 78 | selectedTool = index; 79 | }); 80 | }, 81 | child: FadeInUp( 82 | delay: Duration(milliseconds: index * 100), 83 | child: AnimatedContainer( 84 | padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10), 85 | margin: EdgeInsets.only(bottom: 20), 86 | duration: Duration(milliseconds: 500), 87 | decoration: BoxDecoration( 88 | color: Colors.white, 89 | borderRadius: BorderRadius.circular(8), 90 | border: Border.all( 91 | color: selectedTool == index ? Colors.blue : Colors.white.withOpacity(0), 92 | width: 2 93 | ), 94 | boxShadow: [ 95 | selectedTool == index ? 96 | BoxShadow( 97 | color: Colors.blue.shade100, 98 | offset: Offset(0, 3), 99 | blurRadius: 10 100 | ) : BoxShadow( 101 | color: Colors.grey.shade200, 102 | offset: Offset(0, 3), 103 | blurRadius: 10 104 | ) 105 | ] 106 | ), 107 | child: Row( 108 | children: [ 109 | selectedTool == index ? 110 | Image.network(tools[index]['selected_image'], width: 50,) : 111 | Image.network(tools[index]['image'], width: 50,), 112 | SizedBox(width: 20,), 113 | Expanded( 114 | child: Column( 115 | crossAxisAlignment: CrossAxisAlignment.start, 116 | children: [ 117 | Text(tools[index]['name'], style: TextStyle( 118 | color: Colors.grey.shade800, 119 | fontSize: 16, 120 | fontWeight: FontWeight.bold 121 | ),), 122 | Text(tools[index]['description'], style: TextStyle( 123 | color: Colors.grey.shade600, 124 | fontSize: 14, 125 | ),) 126 | ], 127 | ), 128 | ), 129 | Icon(Icons.check_circle, color: selectedTool == index ? Colors.blue : Colors.white,) 130 | ], 131 | ), 132 | ), 133 | ), 134 | ); 135 | }, 136 | ), 137 | ) 138 | ], 139 | ), 140 | ) 141 | ); 142 | } 143 | } -------------------------------------------------------------------------------- /lib/pages/register_with_phone.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:example/pages/verification.dart'; 3 | import 'package:flutter/material.dart'; 4 | import 'package:intl_phone_number_input/intl_phone_number_input.dart'; 5 | 6 | class RegisterWithPhoneNumber extends StatefulWidget { 7 | const RegisterWithPhoneNumber({ Key? key }) : super(key: key); 8 | 9 | @override 10 | _RegisterWithPhoneNumberState createState() => _RegisterWithPhoneNumberState(); 11 | } 12 | 13 | class _RegisterWithPhoneNumberState extends State { 14 | final TextEditingController controller = TextEditingController(); 15 | bool _isLoading = false; 16 | 17 | @override 18 | Widget build(BuildContext context) { 19 | return Scaffold( 20 | backgroundColor: Colors.white, 21 | body: SingleChildScrollView( 22 | child: Container( 23 | padding: EdgeInsets.all(30), 24 | width: double.infinity, 25 | height: MediaQuery.of(context).size.height, 26 | child: Column( 27 | mainAxisAlignment: MainAxisAlignment.center, 28 | children: [ 29 | Image.network('https://ouch-cdn2.icons8.com/n9XQxiCMz0_zpnfg9oldMbtSsG7X6NwZi_kLccbLOKw/rs:fit:392:392/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvNDMv/MGE2N2YwYzMtMjQw/NC00MTFjLWE2MTct/ZDk5MTNiY2IzNGY0/LnN2Zw.png', fit: BoxFit.cover, width: 280, ), 30 | SizedBox(height: 50,), 31 | FadeInDown( 32 | child: Text('REGISTER', 33 | style: TextStyle(fontWeight: FontWeight.bold, fontSize: 24, color: Colors.grey.shade900),), 34 | ), 35 | FadeInDown( 36 | delay: Duration(milliseconds: 200), 37 | child: Padding( 38 | padding: const EdgeInsets.symmetric(vertical: 15.0, horizontal: 20), 39 | child: Text('Enter your phone number to continu, we will send you OTP to verifiy.', 40 | textAlign: TextAlign.center, 41 | style: TextStyle(fontSize: 14, color: Colors.grey.shade700),), 42 | ), 43 | ), 44 | SizedBox(height: 30,), 45 | FadeInDown( 46 | delay: Duration(milliseconds: 400), 47 | child: Container( 48 | padding: EdgeInsets.symmetric(vertical: 5, horizontal: 15), 49 | decoration: BoxDecoration( 50 | color: Colors.white, 51 | borderRadius: BorderRadius.circular(8), 52 | border: Border.all(color: Colors.black.withOpacity(0.13)), 53 | boxShadow: [ 54 | BoxShadow( 55 | color: Color(0xffeeeeee), 56 | blurRadius: 10, 57 | offset: Offset(0, 4), 58 | ), 59 | ], 60 | ), 61 | child: Stack( 62 | children: [ 63 | InternationalPhoneNumberInput( 64 | onInputChanged: (PhoneNumber number) { 65 | print(number.phoneNumber); 66 | }, 67 | onInputValidated: (bool value) { 68 | print(value); 69 | }, 70 | selectorConfig: SelectorConfig( 71 | selectorType: PhoneInputSelectorType.BOTTOM_SHEET, 72 | ), 73 | ignoreBlank: false, 74 | autoValidateMode: AutovalidateMode.disabled, 75 | selectorTextStyle: TextStyle(color: Colors.black), 76 | textFieldController: controller, 77 | formatInput: false, 78 | maxLength: 9, 79 | keyboardType: 80 | TextInputType.numberWithOptions(signed: true, decimal: true), 81 | cursorColor: Colors.black, 82 | inputDecoration: InputDecoration( 83 | contentPadding: EdgeInsets.only(bottom: 15, left: 0), 84 | border: InputBorder.none, 85 | hintText: 'Phone Number', 86 | hintStyle: TextStyle(color: Colors.grey.shade500, fontSize: 16), 87 | ), 88 | onSaved: (PhoneNumber number) { 89 | print('On Saved: $number'); 90 | }, 91 | ), 92 | Positioned( 93 | left: 90, 94 | top: 8, 95 | bottom: 8, 96 | child: Container( 97 | height: 40, 98 | width: 1, 99 | color: Colors.black.withOpacity(0.13), 100 | ), 101 | ) 102 | ], 103 | ), 104 | ), 105 | ), 106 | SizedBox(height: 100,), 107 | FadeInDown( 108 | delay: Duration(milliseconds: 600), 109 | child: MaterialButton( 110 | minWidth: double.infinity, 111 | onPressed: () { 112 | setState(() { 113 | _isLoading = true; 114 | }); 115 | 116 | Future.delayed(Duration(seconds: 2), () { 117 | setState(() { 118 | _isLoading = false; 119 | }); 120 | Navigator.push(context, MaterialPageRoute(builder: (context) => Verificatoin())); 121 | }); 122 | }, 123 | color: Colors.black, 124 | shape: RoundedRectangleBorder( 125 | borderRadius: BorderRadius.circular(5) 126 | ), 127 | padding: EdgeInsets.symmetric(vertical: 15, horizontal: 30), 128 | child: _isLoading ? Container( 129 | width: 20, 130 | height: 20, 131 | child: CircularProgressIndicator( 132 | backgroundColor: Colors.white, 133 | color: Colors.black, 134 | strokeWidth: 2, 135 | ), 136 | ) : 137 | Text("Request OTP", style: TextStyle(color: Colors.white),), 138 | ), 139 | ), 140 | SizedBox(height: 20,), 141 | FadeInDown( 142 | delay: Duration(milliseconds: 800), 143 | child: Row( 144 | mainAxisAlignment: MainAxisAlignment.center, 145 | children: [ 146 | Text('Already have an account?', style: TextStyle(color: Colors.grey.shade700),), 147 | SizedBox(width: 5,), 148 | InkWell( 149 | onTap: () { 150 | Navigator.of(context).pushReplacementNamed('/login'); 151 | }, 152 | child: Text('Login', style: TextStyle(color: Colors.black),), 153 | ) 154 | ], 155 | ), 156 | ) 157 | ], 158 | ), 159 | ), 160 | ) 161 | ); 162 | } 163 | } 164 | -------------------------------------------------------------------------------- /lib/pages/furnitures.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class Furnitures extends StatefulWidget { 5 | const Furnitures({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _FurnituresState createState() => _FurnituresState(); 9 | } 10 | 11 | class _FurnituresState extends State with TickerProviderStateMixin { 12 | List _furnitures = [ 13 | { 14 | 'title': 'Modern \nFurnitures', 15 | 'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.', 16 | 'image': 'https://images.unsplash.com/photo-1612015900986-4c4d017d1648?ixid=MnwxMjA3fDB8MHxzZWFyY2h8NTJ8fGZ1cm5pdHVyZXN8ZW58MHx8MHxibGFja3w%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60' 17 | }, 18 | { 19 | 'title': 'Modern \nFurniture', 20 | 'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.', 21 | 'image': 'https://images.unsplash.com/photo-1583847268964-b28dc8f51f92?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MXx8ZnVybml0dXJlc3xlbnwwfDF8MHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60' 22 | }, 23 | { 24 | 'title': 'Modern \nFurniture', 25 | 'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.', 26 | 'image': 'https://images.unsplash.com/photo-1532499012374-fdfae50e73e9?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Nnx8ZnVybml0dXJlc3xlbnwwfDF8MHxibGFja3w%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60' 27 | }, 28 | { 29 | 'title': 'Modern \nFurniture', 30 | 'sub_title': 'Choose From Thousands Of Items That Fits Your Choice.', 31 | 'image': 'https://images.unsplash.com/photo-1633555715049-0c2777ee516e?ixid=MnwxMjA3fDB8MHxzZWFyY2h8OTl8fGZ1cm5pdHVyZXN8ZW58MHwxfDB8YmxhY2t8&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60' 32 | } 33 | ]; 34 | 35 | late final AnimationController _controller = AnimationController( 36 | duration: const Duration(seconds: 20), 37 | vsync: this 38 | )..repeat(reverse: true); 39 | 40 | late final Animation _animation = Tween( 41 | begin: 1.0, 42 | end: 1.5 43 | ).animate(CurvedAnimation( 44 | parent: _controller, 45 | curve: Curves.linear 46 | )); 47 | 48 | @override 49 | void dispose() { 50 | super.dispose(); 51 | _controller.dispose(); 52 | } 53 | 54 | @override 55 | Widget build(BuildContext context) { 56 | return Scaffold( 57 | body: PageView.builder( 58 | onPageChanged: (int index) { 59 | _controller.value = 0.0; 60 | _controller.forward(); 61 | }, 62 | itemBuilder: (context, index) { 63 | return Container( 64 | child: Stack( 65 | children: [ 66 | Container( 67 | height: MediaQuery.of(context).size.height, 68 | width: MediaQuery.of(context).size.width, 69 | clipBehavior: Clip.hardEdge, 70 | decoration: BoxDecoration(), 71 | child: ScaleTransition( 72 | scale: _animation, 73 | child: Image.network( 74 | _furnitures[index]['image'], 75 | fit: BoxFit.cover, 76 | ), 77 | ), 78 | ), 79 | Positioned( 80 | bottom: 0, 81 | child: Container( 82 | padding: EdgeInsets.all(20), 83 | width: MediaQuery.of(context).size.width, 84 | height: MediaQuery.of(context).size.height, 85 | decoration: BoxDecoration( 86 | gradient: LinearGradient( 87 | begin: Alignment.bottomRight, 88 | colors: [ 89 | Colors.black.withOpacity(0.9), 90 | Colors.black.withOpacity(0.8), 91 | Colors.black.withOpacity(0.2), 92 | Colors.black.withOpacity(0.1) 93 | ] 94 | ) 95 | ), 96 | child: Column( 97 | mainAxisAlignment: MainAxisAlignment.end, 98 | crossAxisAlignment: CrossAxisAlignment.start, 99 | children: [ 100 | FadeInDown( 101 | duration: Duration(milliseconds: 500), 102 | child: Text(_furnitures[index]['title'], 103 | style: TextStyle( 104 | color: Colors.white, 105 | fontSize: 42, 106 | fontWeight: FontWeight.bold 107 | ), 108 | ), 109 | ), 110 | SizedBox(height: 10,), 111 | FadeInDown( 112 | delay: Duration(milliseconds: 100), 113 | duration: Duration(milliseconds: 800), 114 | child: Text(_furnitures[index]['sub_title'], 115 | style: TextStyle( 116 | color: Colors.grey.shade400, 117 | fontSize: 18, 118 | ), 119 | ) 120 | ), 121 | SizedBox(height: 50,), 122 | FadeInLeft( 123 | delay: Duration(milliseconds: 100), 124 | duration: Duration(milliseconds: 1000), 125 | child: Align( 126 | alignment: Alignment.bottomRight, 127 | child: MaterialButton( 128 | shape: RoundedRectangleBorder( 129 | borderRadius: BorderRadius.circular(40) 130 | ), 131 | onPressed: () {}, 132 | color: Colors.orange, 133 | padding: EdgeInsets.only(right: 5, left: 30, top: 5, bottom: 5), 134 | child: Container( 135 | height: 40, 136 | width: MediaQuery.of(context).size.width * 0.4, 137 | child: Row( 138 | children: [ 139 | Text('Get Started', 140 | style: TextStyle( 141 | color: Colors.orange.shade50, 142 | fontSize: 16, 143 | ), 144 | ), 145 | Spacer(), 146 | Container( 147 | padding: EdgeInsets.all(8), 148 | decoration: BoxDecoration( 149 | color: Colors.orange.shade300, 150 | borderRadius: BorderRadius.circular(40) 151 | ), 152 | child: Icon(Icons.arrow_forward, color: Colors.orange.shade100,) 153 | ), 154 | ], 155 | ), 156 | ) 157 | ), 158 | ), 159 | ), 160 | SizedBox(height: 50), 161 | ] 162 | ) 163 | ), 164 | ) 165 | ], 166 | ), 167 | ); 168 | }, 169 | itemCount: _furnitures.length, 170 | controller: PageController(viewportFraction: 1.0), 171 | ), 172 | ); 173 | } 174 | } -------------------------------------------------------------------------------- /lib/pages/verification.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:flutter/material.dart'; 3 | import 'dart:async'; 4 | 5 | import 'package:flutter_verification_code/flutter_verification_code.dart'; 6 | 7 | class Verificatoin extends StatefulWidget { 8 | const Verificatoin({ Key? key }) : super(key: key); 9 | 10 | @override 11 | _VerificatoinState createState() => _VerificatoinState(); 12 | } 13 | 14 | class _VerificatoinState extends State { 15 | bool _isResendAgain = false; 16 | bool _isVerified = false; 17 | bool _isLoading = false; 18 | 19 | String _code = ''; 20 | 21 | late Timer _timer; 22 | int _start = 60; 23 | int _currentIndex = 0; 24 | 25 | void resend() { 26 | setState(() { 27 | _isResendAgain = true; 28 | }); 29 | 30 | const oneSec = Duration(seconds: 1); 31 | _timer = new Timer.periodic(oneSec, (timer) { 32 | setState(() { 33 | if (_start == 0) { 34 | _start = 60; 35 | _isResendAgain = false; 36 | timer.cancel(); 37 | } else { 38 | _start--; 39 | } 40 | }); 41 | }); 42 | } 43 | 44 | verify() { 45 | setState(() { 46 | _isLoading = true; 47 | }); 48 | 49 | const oneSec = Duration(milliseconds: 2000); 50 | _timer = new Timer.periodic(oneSec, (timer) { 51 | setState(() { 52 | _isLoading = false; 53 | _isVerified = true; 54 | }); 55 | }); 56 | } 57 | 58 | @override 59 | void initState() { 60 | Timer.periodic(Duration(seconds: 5), (timer) { 61 | setState(() { 62 | _currentIndex++; 63 | 64 | if (_currentIndex == 3) 65 | _currentIndex = 0; 66 | }); 67 | }); 68 | 69 | super.initState(); 70 | } 71 | 72 | @override 73 | Widget build(BuildContext context) { 74 | return Scaffold( 75 | backgroundColor: Colors.white, 76 | body: SingleChildScrollView( 77 | child: Container( 78 | padding: EdgeInsets.symmetric(horizontal: 20), 79 | height: MediaQuery.of(context).size.height, 80 | width: double.infinity, 81 | child: Column( 82 | mainAxisAlignment: MainAxisAlignment.center, 83 | crossAxisAlignment: CrossAxisAlignment.center, 84 | children: [ 85 | Container( 86 | height: 250, 87 | child: Stack( 88 | children: [ 89 | Positioned( 90 | top: 0, 91 | left: 0, 92 | right: 0, 93 | bottom: 0, 94 | child: AnimatedOpacity( 95 | opacity: _currentIndex == 0 ? 1 : 0, 96 | duration: Duration(seconds: 1,), 97 | curve: Curves.linear, 98 | child: Image.network('https://ouch-cdn2.icons8.com/eza3-Rq5rqbcGs4EkHTolm43ZXQPGH_R4GugNLGJzuo/rs:fit:784:784/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvNjk3/L2YzMDAzMWUzLTcz/MjYtNDg0ZS05MzA3/LTNkYmQ0ZGQ0ODhj/MS5zdmc.png',), 99 | ), 100 | ), 101 | Positioned( 102 | top: 0, 103 | left: 0, 104 | right: 0, 105 | bottom: 0, 106 | child: AnimatedOpacity( 107 | opacity: _currentIndex == 1 ? 1 : 0, 108 | duration: Duration(seconds: 1), 109 | curve: Curves.linear, 110 | child: Image.network('https://ouch-cdn2.icons8.com/pi1hTsTcrgVklEBNOJe2TLKO2LhU6OlMoub6FCRCQ5M/rs:fit:784:666/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvMzAv/MzA3NzBlMGUtZTgx/YS00MTZkLWI0ZTYt/NDU1MWEzNjk4MTlh/LnN2Zw.png',), 111 | ), 112 | ), 113 | Positioned( 114 | top: 0, 115 | left: 0, 116 | right: 0, 117 | bottom: 0, 118 | child: AnimatedOpacity( 119 | opacity: _currentIndex == 2 ? 1 : 0, 120 | duration: Duration(seconds: 1), 121 | curve: Curves.linear, 122 | child: Image.network('https://ouch-cdn2.icons8.com/ElwUPINwMmnzk4s2_9O31AWJhH-eRHnP9z8rHUSS5JQ/rs:fit:784:784/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvNzkw/Lzg2NDVlNDllLTcx/ZDItNDM1NC04YjM5/LWI0MjZkZWI4M2Zk/MS5zdmc.png',), 123 | ), 124 | ) 125 | ] 126 | ), 127 | ), 128 | SizedBox(height: 30,), 129 | FadeInDown( 130 | duration: Duration(milliseconds: 500), 131 | child: Text("Verification", style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),)), 132 | SizedBox(height: 30,), 133 | FadeInDown( 134 | delay: Duration(milliseconds: 500), 135 | duration: Duration(milliseconds: 500), 136 | child: Text("Please enter the 4 digit code sent to \n +93 706-399-999", 137 | textAlign: TextAlign.center, 138 | style: TextStyle(fontSize: 16, color: Colors.grey.shade500, height: 1.5),), 139 | ), 140 | SizedBox(height: 30,), 141 | 142 | // Verification Code Input 143 | FadeInDown( 144 | delay: Duration(milliseconds: 600), 145 | duration: Duration(milliseconds: 500), 146 | child: VerificationCode( 147 | length: 4, 148 | textStyle: TextStyle(fontSize: 20, color: Colors.black), 149 | underlineColor: Colors.black, 150 | keyboardType: TextInputType.number, 151 | underlineUnfocusedColor: Colors.black, 152 | onCompleted: (value) { 153 | setState(() { 154 | _code = value; 155 | }); 156 | }, 157 | onEditing: (value) {}, 158 | ), 159 | ), 160 | 161 | 162 | SizedBox(height: 20,), 163 | FadeInDown( 164 | delay: Duration(milliseconds: 700), 165 | duration: Duration(milliseconds: 500), 166 | child: Row( 167 | mainAxisAlignment: MainAxisAlignment.center, 168 | children: [ 169 | Text("Don't resive the OTP?", style: TextStyle(fontSize: 14, color: Colors.grey.shade500),), 170 | TextButton( 171 | onPressed: () { 172 | if (_isResendAgain) return; 173 | resend(); 174 | }, 175 | child: Text(_isResendAgain ? "Try again in " + _start.toString() : "Resend", style: TextStyle(color: Colors.blueAccent),) 176 | ) 177 | ], 178 | ), 179 | ), 180 | SizedBox(height: 50,), 181 | FadeInDown( 182 | delay: Duration(milliseconds: 800), 183 | duration: Duration(milliseconds: 500), 184 | child: MaterialButton( 185 | elevation: 0, 186 | onPressed: _code.length < 4 ? () => {} : () { verify(); }, 187 | color: Colors.orange.shade400, 188 | minWidth: MediaQuery.of(context).size.width * 0.8, 189 | height: 50, 190 | child: _isLoading ? Container( 191 | width: 20, 192 | height: 20, 193 | child: CircularProgressIndicator( 194 | backgroundColor: Colors.white, 195 | strokeWidth: 3, 196 | color: Colors.black, 197 | ), 198 | ) : _isVerified ? Icon(Icons.check_circle, color: Colors.white, size: 30,) : Text("Verify", style: TextStyle(color: Colors.white),), 199 | ), 200 | ) 201 | ],) 202 | ), 203 | ) 204 | ); 205 | } 206 | } 207 | -------------------------------------------------------------------------------- /lib/pages/login.dart: -------------------------------------------------------------------------------- 1 | import 'dart:async'; 2 | 3 | import 'package:flutter/material.dart'; 4 | import 'package:iconsax/iconsax.dart'; 5 | 6 | class LoginPage extends StatefulWidget { 7 | const LoginPage({ Key? key }) : super(key: key); 8 | 9 | @override 10 | _LoginPageState createState() => _LoginPageState(); 11 | } 12 | 13 | class _LoginPageState extends State { 14 | int activeIndex = 0; 15 | 16 | @override 17 | void initState() { 18 | Timer.periodic(Duration(seconds: 5), (timer) { 19 | setState(() { 20 | activeIndex++; 21 | 22 | if (activeIndex == 4) 23 | activeIndex = 0; 24 | }); 25 | }); 26 | 27 | super.initState(); 28 | } 29 | 30 | @override 31 | Widget build(BuildContext context) { 32 | return Scaffold( 33 | body: SingleChildScrollView( 34 | child: Padding( 35 | padding: EdgeInsets.all(20.0), 36 | child: Column( 37 | children: [ 38 | SizedBox(height: 50,), 39 | Container( 40 | height: 350, 41 | child: Stack( 42 | children: [ 43 | Positioned( 44 | top: 0, 45 | left: 0, 46 | right: 0, 47 | bottom: 0, 48 | child: AnimatedOpacity( 49 | opacity: activeIndex == 0 ? 1 : 0, 50 | duration: Duration(seconds: 1,), 51 | curve: Curves.linear, 52 | child: Image.network('https://ouch-cdn2.icons8.com/As6ct-Fovab32SIyMatjsqIaIjM9Jg1PblII8YAtBtQ/rs:fit:784:784/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvNTg4/LzNmMDU5Mzc0LTky/OTQtNDk5MC1hZGY2/LTA2YTkyMDZhNWZl/NC5zdmc.png', height: 400,), 53 | ), 54 | ), 55 | Positioned( 56 | top: 0, 57 | left: 0, 58 | right: 0, 59 | bottom: 0, 60 | child: AnimatedOpacity( 61 | opacity: activeIndex == 1 ? 1 : 0, 62 | duration: Duration(seconds: 1), 63 | curve: Curves.linear, 64 | child: Image.network('https://ouch-cdn2.icons8.com/vSx9H3yP2D4DgVoaFPbE4HVf6M4Phd-8uRjBZBnl83g/rs:fit:784:784/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvNC84/MzcwMTY5OS1kYmU1/LTQ1ZmEtYmQ1Ny04/NTFmNTNjMTlkNTcu/c3Zn.png', height: 400,), 65 | ), 66 | ), 67 | Positioned( 68 | top: 0, 69 | left: 0, 70 | right: 0, 71 | bottom: 0, 72 | child: AnimatedOpacity( 73 | opacity: activeIndex == 2 ? 1 : 0, 74 | duration: Duration(seconds: 1), 75 | curve: Curves.linear, 76 | child: Image.network('https://ouch-cdn2.icons8.com/fv7W4YUUpGVcNhmKcDGZp6pF1-IDEyCjSjtBB8-Kp_0/rs:fit:784:784/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvMTUv/ZjUzYTU4NDAtNjBl/Yy00ZWRhLWE1YWIt/ZGM1MWJmYjBiYjI2/LnN2Zw.png', height: 400,), 77 | ), 78 | ), 79 | Positioned( 80 | top: 0, 81 | left: 0, 82 | right: 0, 83 | bottom: 0, 84 | child: AnimatedOpacity( 85 | opacity: activeIndex == 3 ? 1 : 0, 86 | duration: Duration(seconds: 1), 87 | curve: Curves.linear, 88 | child: Image.network('https://ouch-cdn2.icons8.com/AVdOMf5ui4B7JJrNzYULVwT1z8NlGmlRYZTtg1F6z9E/rs:fit:784:767/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvOTY5/L2NlMTY1MWM5LTRl/ZjUtNGRmZi05MjQ3/LWYzNGQ1MzhiOTQ0/Mi5zdmc.png', height: 400,), 89 | ), 90 | ) 91 | ] 92 | ), 93 | ), 94 | SizedBox(height: 40,), 95 | TextField( 96 | cursorColor: Colors.black, 97 | decoration: InputDecoration( 98 | contentPadding: EdgeInsets.all(0.0), 99 | labelText: 'Email', 100 | hintText: 'Username or e-mail', 101 | labelStyle: TextStyle( 102 | color: Colors.black, 103 | fontSize: 14.0, 104 | fontWeight: FontWeight.w400, 105 | ), 106 | hintStyle: TextStyle( 107 | color: Colors.grey, 108 | fontSize: 14.0, 109 | ), 110 | prefixIcon: Icon(Iconsax.user, color: Colors.black, size: 18, ), 111 | enabledBorder: OutlineInputBorder( 112 | borderSide: BorderSide(color: Colors.grey.shade200, width: 2), 113 | borderRadius: BorderRadius.circular(10.0), 114 | ), 115 | floatingLabelStyle: TextStyle( 116 | color: Colors.black, 117 | fontSize: 18.0, 118 | ), 119 | focusedBorder: OutlineInputBorder( 120 | borderSide: BorderSide(color: Colors.black, width: 1.5), 121 | borderRadius: BorderRadius.circular(10.0), 122 | ), 123 | ), 124 | ), 125 | SizedBox(height: 20,), 126 | TextField( 127 | cursorColor: Colors.black, 128 | decoration: InputDecoration( 129 | contentPadding: EdgeInsets.all(0.0), 130 | labelText: 'Password', 131 | hintText: 'Password', 132 | hintStyle: TextStyle( 133 | color: Colors.grey, 134 | fontSize: 14.0, 135 | ), 136 | labelStyle: TextStyle( 137 | color: Colors.black, 138 | fontSize: 14.0, 139 | fontWeight: FontWeight.w400, 140 | ), 141 | prefixIcon: Icon(Iconsax.key, color: Colors.black, size: 18, ), 142 | enabledBorder: OutlineInputBorder( 143 | borderSide: BorderSide(color: Colors.grey.shade200, width: 2), 144 | borderRadius: BorderRadius.circular(10.0), 145 | ), 146 | floatingLabelStyle: TextStyle( 147 | color: Colors.black, 148 | fontSize: 18.0, 149 | ), 150 | focusedBorder: OutlineInputBorder( 151 | borderSide: BorderSide(color: Colors.black, width: 1.5), 152 | borderRadius: BorderRadius.circular(10.0), 153 | ), 154 | ), 155 | ), 156 | Row( 157 | mainAxisAlignment: MainAxisAlignment.end, 158 | children: [ 159 | TextButton( 160 | onPressed: () {}, 161 | child: Text('Forgot Password?', style: TextStyle(color: Colors.black, fontSize: 14.0, fontWeight: FontWeight.w400),), 162 | ) 163 | ], 164 | ), 165 | SizedBox(height: 30,), 166 | MaterialButton( 167 | onPressed: (){}, 168 | height: 45, 169 | color: Colors.black, 170 | child: Text("Login", style: TextStyle(color: Colors.white, fontSize: 16.0),), 171 | padding: EdgeInsets.symmetric(vertical: 10, horizontal: 50), 172 | shape: RoundedRectangleBorder( 173 | borderRadius: BorderRadius.circular(10.0), 174 | ), 175 | ), 176 | SizedBox(height: 30,), 177 | Row( 178 | mainAxisAlignment: MainAxisAlignment.center, 179 | children: [ 180 | Text('Don\'t have an account?', style: TextStyle(color: Colors.grey.shade600, fontSize: 14.0, fontWeight: FontWeight.w400),), 181 | TextButton( 182 | onPressed: () {}, 183 | child: Text('Register', style: TextStyle(color: Colors.blue, fontSize: 14.0, fontWeight: FontWeight.w400),), 184 | ) 185 | ], 186 | ), 187 | ], 188 | ), 189 | ), 190 | ) 191 | ); 192 | } 193 | } 194 | -------------------------------------------------------------------------------- /lib/pages/movies.dart: -------------------------------------------------------------------------------- 1 | import 'package:carousel_slider/carousel_slider.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | class MoviesPage extends StatefulWidget { 5 | const MoviesPage({ Key? key }) : super(key: key); 6 | 7 | @override 8 | _MoviesPageState createState() => _MoviesPageState(); 9 | } 10 | 11 | class _MoviesPageState extends State { 12 | CarouselController _carouselController = new CarouselController(); 13 | int _current = 0; 14 | 15 | List _movies = [ 16 | { 17 | 'title': 'Black Widow', 18 | 'image': 'https://www.moviepostersgallery.com/wp-content/uploads/2020/08/Blackwidow2.jpg', 19 | 'description': 'Black Widow' 20 | }, 21 | { 22 | 'title': 'The Suicide Squad', 23 | 'image': 'https://static.wikia.nocookie.net/headhuntersholosuite/images/7/77/Suicide_Squad%2C_The.jpg/revision/latest?cb=20210807172814', 24 | 'description': 'The Suicide Squad' 25 | }, 26 | { 27 | 'title': 'Godzilla Vs Kong', 28 | 'image': 'https://pbs.twimg.com/media/EwTsO9CVcAUxoMM?format=jpg&name=large', 29 | 'description': 'Godzilla Vs Kong' 30 | } 31 | ]; 32 | 33 | @override 34 | void initState() { 35 | super.initState(); 36 | } 37 | 38 | @override 39 | Widget build(BuildContext context) { 40 | return Scaffold( 41 | body: Container( 42 | height: MediaQuery.of(context).size.height, 43 | child: Stack( 44 | children: [ 45 | Image.network(_movies[_current]['image'], fit: BoxFit.cover), 46 | Positioned( 47 | top: 0, 48 | left: 0, 49 | right: 0, 50 | bottom: 0, 51 | child: Container( 52 | height: MediaQuery.of(context).size.height * 0.3, 53 | decoration: BoxDecoration( 54 | gradient: LinearGradient( 55 | begin: Alignment.bottomCenter, 56 | end: Alignment.topCenter, 57 | colors: [ 58 | Colors.grey.shade50.withOpacity(1), 59 | Colors.grey.shade50.withOpacity(1), 60 | Colors.grey.shade50.withOpacity(1), 61 | Colors.grey.shade50.withOpacity(1), 62 | Colors.grey.shade50.withOpacity(0.0), 63 | Colors.grey.shade50.withOpacity(0.0), 64 | Colors.grey.shade50.withOpacity(0.0), 65 | Colors.grey.shade50.withOpacity(0.0), 66 | ] 67 | ) 68 | ), 69 | ), 70 | ), 71 | Positioned( 72 | bottom: 50, 73 | height: MediaQuery.of(context).size.height * 0.7, 74 | width: MediaQuery.of(context).size.width, 75 | child: CarouselSlider( 76 | options: CarouselOptions( 77 | height: 500.0, 78 | aspectRatio: 16/9, 79 | viewportFraction: 0.70, 80 | enlargeCenterPage: true, 81 | onPageChanged: (index, reason) { 82 | setState(() { 83 | _current = index; 84 | }); 85 | }, 86 | ), 87 | carouselController: _carouselController, 88 | 89 | items: _movies.map((movie) { 90 | return Builder( 91 | builder: (BuildContext context) { 92 | return Container( 93 | width: MediaQuery.of(context).size.width, 94 | margin: EdgeInsets.symmetric(horizontal: 5.0), 95 | decoration: BoxDecoration( 96 | color: Colors.white, 97 | borderRadius: BorderRadius.circular(20.0), 98 | ), 99 | child: SingleChildScrollView( 100 | child: Column( 101 | children: [ 102 | Container( 103 | height: 320, 104 | margin: EdgeInsets.only(top: 30), 105 | clipBehavior: Clip.hardEdge, 106 | decoration: BoxDecoration( 107 | borderRadius: BorderRadius.circular(20), 108 | ), 109 | child: Image.network(movie['image'], fit: BoxFit.cover), 110 | ), 111 | SizedBox(height: 20), 112 | Text(movie['title'], style: 113 | TextStyle( 114 | fontSize: 16.0, 115 | fontWeight: FontWeight.bold 116 | ), 117 | ), 118 | // rating 119 | SizedBox(height: 20), 120 | Container( 121 | child: Text(movie['description'], style: TextStyle( 122 | fontSize: 14.0, 123 | color: Colors.grey.shade600 124 | ), textAlign: TextAlign.center, 125 | ), 126 | ), 127 | SizedBox(height: 20), 128 | AnimatedOpacity( 129 | duration: Duration(milliseconds: 500), 130 | opacity: _current == _movies.indexOf(movie) ? 1.0 : 0.0, 131 | child: Container( 132 | padding: EdgeInsets.symmetric(horizontal: 20.0), 133 | child: Row( 134 | mainAxisAlignment: MainAxisAlignment.spaceBetween, 135 | children: [ 136 | Container( 137 | child: Row( 138 | children: [ 139 | Icon(Icons.star, color: Colors.yellow, size: 20,), 140 | SizedBox(width: 5), 141 | Text('4.5', style: TextStyle( 142 | fontSize: 14.0, 143 | color: Colors.grey.shade600 144 | ),) 145 | ], 146 | ), 147 | ), 148 | Container( 149 | child: Row( 150 | children: [ 151 | Icon(Icons.access_time, color: Colors.grey.shade600, size: 20,), 152 | SizedBox(width: 5), 153 | Text('2h', style: TextStyle( 154 | fontSize: 14.0, 155 | color: Colors.grey.shade600 156 | ),) 157 | ], 158 | ), 159 | ), 160 | Container( 161 | width: MediaQuery.of(context).size.width * 0.2, 162 | child: Row( 163 | children: [ 164 | Icon(Icons.play_circle_filled, color: Colors.grey.shade600, size: 20,), 165 | SizedBox(width: 5), 166 | Text('Watch', style: TextStyle( 167 | fontSize: 14.0, 168 | color: Colors.grey.shade600 169 | ),) 170 | ], 171 | ), 172 | ), 173 | ], 174 | ), 175 | ), 176 | ), 177 | ], 178 | ), 179 | ) 180 | ); 181 | }, 182 | ); 183 | }).toList(), 184 | ), 185 | ) 186 | ], 187 | ), 188 | ), 189 | ); 190 | } 191 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Apache License 2 | Version 2.0, January 2004 3 | http://www.apache.org/licenses/ 4 | 5 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 6 | 7 | 1. Definitions. 8 | 9 | "License" shall mean the terms and conditions for use, reproduction, 10 | and distribution as defined by Sections 1 through 9 of this document. 11 | 12 | "Licensor" shall mean the copyright owner or entity authorized by 13 | the copyright owner that is granting the License. 14 | 15 | "Legal Entity" shall mean the union of the acting entity and all 16 | other entities that control, are controlled by, or are under common 17 | control with that entity. For the purposes of this definition, 18 | "control" means (i) the power, direct or indirect, to cause the 19 | direction or management of such entity, whether by contract or 20 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 21 | outstanding shares, or (iii) beneficial ownership of such entity. 22 | 23 | "You" (or "Your") shall mean an individual or Legal Entity 24 | exercising permissions granted by this License. 25 | 26 | "Source" form shall mean the preferred form for making modifications, 27 | including but not limited to software source code, documentation 28 | source, and configuration files. 29 | 30 | "Object" form shall mean any form resulting from mechanical 31 | transformation or translation of a Source form, including but 32 | not limited to compiled object code, generated documentation, 33 | and conversions to other media types. 34 | 35 | "Work" shall mean the work of authorship, whether in Source or 36 | Object form, made available under the License, as indicated by a 37 | copyright notice that is included in or attached to the work 38 | (an example is provided in the Appendix below). 39 | 40 | "Derivative Works" shall mean any work, whether in Source or Object 41 | form, that is based on (or derived from) the Work and for which the 42 | editorial revisions, annotations, elaborations, or other modifications 43 | represent, as a whole, an original work of authorship. For the purposes 44 | of this License, Derivative Works shall not include works that remain 45 | separable from, or merely link (or bind by name) to the interfaces of, 46 | the Work and Derivative Works thereof. 47 | 48 | "Contribution" shall mean any work of authorship, including 49 | the original version of the Work and any modifications or additions 50 | to that Work or Derivative Works thereof, that is intentionally 51 | submitted to Licensor for inclusion in the Work by the copyright owner 52 | or by an individual or Legal Entity authorized to submit on behalf of 53 | the copyright owner. For the purposes of this definition, "submitted" 54 | means any form of electronic, verbal, or written communication sent 55 | to the Licensor or its representatives, including but not limited to 56 | communication on electronic mailing lists, source code control systems, 57 | and issue tracking systems that are managed by, or on behalf of, the 58 | Licensor for the purpose of discussing and improving the Work, but 59 | excluding communication that is conspicuously marked or otherwise 60 | designated in writing by the copyright owner as "Not a Contribution." 61 | 62 | "Contributor" shall mean Licensor and any individual or Legal Entity 63 | on behalf of whom a Contribution has been received by Licensor and 64 | subsequently incorporated within the Work. 65 | 66 | 2. Grant of Copyright License. Subject to the terms and conditions of 67 | this License, each Contributor hereby grants to You a perpetual, 68 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 69 | copyright license to reproduce, prepare Derivative Works of, 70 | publicly display, publicly perform, sublicense, and distribute the 71 | Work and such Derivative Works in Source or Object form. 72 | 73 | 3. Grant of Patent License. Subject to the terms and conditions of 74 | this License, each Contributor hereby grants to You a perpetual, 75 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 76 | (except as stated in this section) patent license to make, have made, 77 | use, offer to sell, sell, import, and otherwise transfer the Work, 78 | where such license applies only to those patent claims licensable 79 | by such Contributor that are necessarily infringed by their 80 | Contribution(s) alone or by combination of their Contribution(s) 81 | with the Work to which such Contribution(s) was submitted. If You 82 | institute patent litigation against any entity (including a 83 | cross-claim or counterclaim in a lawsuit) alleging that the Work 84 | or a Contribution incorporated within the Work constitutes direct 85 | or contributory patent infringement, then any patent licenses 86 | granted to You under this License for that Work shall terminate 87 | as of the date such litigation is filed. 88 | 89 | 4. Redistribution. You may reproduce and distribute copies of the 90 | Work or Derivative Works thereof in any medium, with or without 91 | modifications, and in Source or Object form, provided that You 92 | meet the following conditions: 93 | 94 | (a) You must give any other recipients of the Work or 95 | Derivative Works a copy of this License; and 96 | 97 | (b) You must cause any modified files to carry prominent notices 98 | stating that You changed the files; and 99 | 100 | (c) You must retain, in the Source form of any Derivative Works 101 | that You distribute, all copyright, patent, trademark, and 102 | attribution notices from the Source form of the Work, 103 | excluding those notices that do not pertain to any part of 104 | the Derivative Works; and 105 | 106 | (d) If the Work includes a "NOTICE" text file as part of its 107 | distribution, then any Derivative Works that You distribute must 108 | include a readable copy of the attribution notices contained 109 | within such NOTICE file, excluding those notices that do not 110 | pertain to any part of the Derivative Works, in at least one 111 | of the following places: within a NOTICE text file distributed 112 | as part of the Derivative Works; within the Source form or 113 | documentation, if provided along with the Derivative Works; or, 114 | within a display generated by the Derivative Works, if and 115 | wherever such third-party notices normally appear. The contents 116 | of the NOTICE file are for informational purposes only and 117 | do not modify the License. You may add Your own attribution 118 | notices within Derivative Works that You distribute, alongside 119 | or as an addendum to the NOTICE text from the Work, provided 120 | that such additional attribution notices cannot be construed 121 | as modifying the License. 122 | 123 | You may add Your own copyright statement to Your modifications and 124 | may provide additional or different license terms and conditions 125 | for use, reproduction, or distribution of Your modifications, or 126 | for any such Derivative Works as a whole, provided Your use, 127 | reproduction, and distribution of the Work otherwise complies with 128 | the conditions stated in this License. 129 | 130 | 5. Submission of Contributions. Unless You explicitly state otherwise, 131 | any Contribution intentionally submitted for inclusion in the Work 132 | by You to the Licensor shall be under the terms and conditions of 133 | this License, without any additional terms or conditions. 134 | Notwithstanding the above, nothing herein shall supersede or modify 135 | the terms of any separate license agreement you may have executed 136 | with Licensor regarding such Contributions. 137 | 138 | 6. Trademarks. This License does not grant permission to use the trade 139 | names, trademarks, service marks, or product names of the Licensor, 140 | except as required for reasonable and customary use in describing the 141 | origin of the Work and reproducing the content of the NOTICE file. 142 | 143 | 7. Disclaimer of Warranty. Unless required by applicable law or 144 | agreed to in writing, Licensor provides the Work (and each 145 | Contributor provides its Contributions) on an "AS IS" BASIS, 146 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 147 | implied, including, without limitation, any warranties or conditions 148 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 149 | PARTICULAR PURPOSE. You are solely responsible for determining the 150 | appropriateness of using or redistributing the Work and assume any 151 | risks associated with Your exercise of permissions under this License. 152 | 153 | 8. Limitation of Liability. In no event and under no legal theory, 154 | whether in tort (including negligence), contract, or otherwise, 155 | unless required by applicable law (such as deliberate and grossly 156 | negligent acts) or agreed to in writing, shall any Contributor be 157 | liable to You for damages, including any direct, indirect, special, 158 | incidental, or consequential damages of any character arising as a 159 | result of this License or out of the use or inability to use the 160 | Work (including but not limited to damages for loss of goodwill, 161 | work stoppage, computer failure or malfunction, or any and all 162 | other commercial damages or losses), even if such Contributor 163 | has been advised of the possibility of such damages. 164 | 165 | 9. Accepting Warranty or Additional Liability. While redistributing 166 | the Work or Derivative Works thereof, You may choose to offer, 167 | and charge a fee for, acceptance of support, warranty, indemnity, 168 | or other liability obligations and/or rights consistent with this 169 | License. However, in accepting such obligations, You may act only 170 | on Your own behalf and on Your sole responsibility, not on behalf 171 | of any other Contributor, and only if You agree to indemnify, 172 | defend, and hold each Contributor harmless for any liability 173 | incurred by, or claims asserted against, such Contributor by reason 174 | of your accepting any such warranty or additional liability. 175 | 176 | END OF TERMS AND CONDITIONS 177 | 178 | APPENDIX: How to apply the Apache License to your work. 179 | 180 | To apply the Apache License to your work, attach the following 181 | boilerplate notice, with the fields enclosed by brackets "[]" 182 | replaced with your own identifying information. (Don't include 183 | the brackets!) The text should be enclosed in the appropriate 184 | comment syntax for the file format. We also recommend that a 185 | file or class name and description of purpose be included on the 186 | same "printed page" as the copyright notice for easier 187 | identification within third-party archives. 188 | 189 | Copyright [yyyy] [name of copyright owner] 190 | 191 | Licensed under the Apache License, Version 2.0 (the "License"); 192 | you may not use this file except in compliance with the License. 193 | You may obtain a copy of the License at 194 | 195 | http://www.apache.org/licenses/LICENSE-2.0 196 | 197 | Unless required by applicable law or agreed to in writing, software 198 | distributed under the License is distributed on an "AS IS" BASIS, 199 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 200 | See the License for the specific language governing permissions and 201 | limitations under the License. 202 | -------------------------------------------------------------------------------- /lib/pages/stocks.dart: -------------------------------------------------------------------------------- 1 | import 'package:animate_do/animate_do.dart'; 2 | import 'package:fl_chart/fl_chart.dart'; 3 | import 'package:flutter/material.dart'; 4 | import 'package:google_fonts/google_fonts.dart'; 5 | 6 | class StocksPage extends StatefulWidget { 7 | const StocksPage({ Key? key }) : super(key: key); 8 | 9 | @override 10 | _StocksPageState createState() => _StocksPageState(); 11 | } 12 | 13 | class _StocksPageState extends State { 14 | 15 | // crate list of spots for the graph by monthly, yearly of Google Stocks 16 | List _daylySpots = [ 17 | FlSpot(0, 20.0), 18 | FlSpot(1, 20.0), 19 | FlSpot(2, 30.0), 20 | FlSpot(3, 10.0), 21 | FlSpot(4, 40.0), 22 | FlSpot(5, 60.0), 23 | FlSpot(6, 40.0), 24 | FlSpot(7, 80.0), 25 | FlSpot(8, 60.0), 26 | FlSpot(9, 70.0), 27 | FlSpot(10, 50.0), 28 | FlSpot(11, 150.0), 29 | FlSpot(12, 70.0), 30 | FlSpot(13, 80.0), 31 | FlSpot(14, 60.0), 32 | FlSpot(15, 70.0), 33 | FlSpot(16, 60.0), 34 | FlSpot(17, 80.0), 35 | FlSpot(18, 110.0), 36 | FlSpot(19, 130.0), 37 | FlSpot(20, 100.0), 38 | FlSpot(21, 130.0), 39 | FlSpot(22, 160.0), 40 | FlSpot(23, 190.0), 41 | FlSpot(24, 150.0), 42 | FlSpot(25, 170.0), 43 | FlSpot(26, 180.0), 44 | FlSpot(27, 140.0), 45 | FlSpot(28, 150.0), 46 | FlSpot(29, 150.0), 47 | FlSpot(30, 130.0) 48 | ]; 49 | 50 | List _monthlySpots = [ 51 | FlSpot(0, 110.0), 52 | FlSpot(1, 110.0), 53 | FlSpot(2, 130.0), 54 | FlSpot(3, 100.0), 55 | FlSpot(4, 130.0), 56 | FlSpot(5, 160.0), 57 | FlSpot(6, 190.0), 58 | FlSpot(7, 150.0), 59 | FlSpot(8, 170.0), 60 | FlSpot(9, 180.0), 61 | FlSpot(10, 140.0), 62 | FlSpot(11, 150.0), 63 | ]; 64 | 65 | int _currentIndex = 0; 66 | 67 | @override 68 | Widget build(BuildContext context) { 69 | return Scaffold( 70 | backgroundColor: Color(0xff0E1117), 71 | appBar: AppBar( 72 | backgroundColor: Color(0xff0E1117), 73 | elevation: 0, 74 | leading: IconButton( 75 | icon: Icon(Icons.arrow_back_ios, color: Colors.blueGrey), 76 | onPressed: () { 77 | Navigator.pop(context); 78 | }, 79 | ), 80 | title: Text( 81 | 'Stocks', 82 | style: TextStyle( 83 | color: Colors.blueGrey.shade200, 84 | fontSize: 18, 85 | fontWeight: FontWeight.bold, 86 | ), 87 | ), 88 | actions: [ 89 | IconButton( 90 | icon: Icon(Icons.search, color: Colors.blueGrey,), 91 | onPressed: () {}, 92 | ), 93 | ], 94 | ), 95 | body: Container( 96 | child: Column( 97 | mainAxisAlignment: MainAxisAlignment.end, 98 | children: [ 99 | FadeInUp( 100 | duration: Duration(milliseconds: 1000), 101 | from: 30, 102 | child: Text( 103 | '\$ 4,777.12', 104 | style: GoogleFonts.poppins( 105 | textStyle: TextStyle( 106 | color: Colors.blueGrey.shade100, 107 | fontSize: 36, 108 | fontWeight: FontWeight.bold, 109 | ), 110 | ), 111 | ), 112 | ), 113 | SizedBox(height: 10,), 114 | FadeInUp( 115 | duration: Duration(milliseconds: 1000), 116 | from: 30, 117 | child: Text( 118 | '+1.5%', 119 | style: TextStyle( 120 | fontSize: 18, 121 | color: Colors.green, 122 | fontWeight: FontWeight.bold, 123 | ), 124 | ), 125 | ), 126 | SizedBox(height: 100), 127 | FadeInUp( 128 | duration: Duration(milliseconds: 1000), 129 | from: 60, 130 | child: Container( 131 | height: MediaQuery.of(context).size.height * 0.3, 132 | child: LineChart( 133 | mainData(), 134 | swapAnimationCurve: Curves.easeInOutCubic, 135 | swapAnimationDuration: Duration(milliseconds: 1000), 136 | ) 137 | ), 138 | ), 139 | AnimatedContainer( 140 | duration: Duration(milliseconds: 500), 141 | height: MediaQuery.of(context).size.height * 0.3, 142 | padding: EdgeInsets.all(20), 143 | child: Row( 144 | mainAxisAlignment: MainAxisAlignment.spaceEvenly, 145 | children: [ 146 | GestureDetector( 147 | onTap: () { 148 | setState(() { 149 | _currentIndex = 0; 150 | }); 151 | }, 152 | child: Container( 153 | padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 15.0), 154 | decoration: BoxDecoration( 155 | borderRadius: BorderRadius.circular(10), 156 | color: _currentIndex == 0 ? Color(0xff161b22) : Color(0xff161b22).withOpacity(0.0), 157 | ), 158 | child: Text("D", style: TextStyle(color: _currentIndex == 0 ? Colors.blueGrey.shade200 : Colors.blueGrey, fontSize: 20),), 159 | ), 160 | ), 161 | GestureDetector( 162 | onTap: () { 163 | setState(() { 164 | _currentIndex = 1; 165 | }); 166 | }, 167 | child: AnimatedContainer( 168 | duration: Duration(milliseconds: 500), 169 | padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 15.0), 170 | decoration: BoxDecoration( 171 | borderRadius: BorderRadius.circular(10), 172 | color: _currentIndex == 1 ? Color(0xff161b22) : Color(0xff161b22).withOpacity(0.0), 173 | ), 174 | child: Text("M", style: TextStyle(color: _currentIndex == 1 ? Colors.blueGrey.shade200 : Colors.blueGrey, fontSize: 20),), 175 | ), 176 | ), 177 | GestureDetector( 178 | onTap: () { 179 | setState(() { 180 | _currentIndex = 2; 181 | }); 182 | }, 183 | child: AnimatedContainer( 184 | duration: Duration(milliseconds: 500), 185 | padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 15.0), 186 | decoration: BoxDecoration( 187 | borderRadius: BorderRadius.circular(10), 188 | color: _currentIndex == 2 ? Color(0xff161b22) : Color(0xff161b22).withOpacity(0.0), 189 | ), 190 | child: Text("Y", style: TextStyle(color: _currentIndex == 2 ? Colors.blueGrey.shade200 : Colors.blueGrey, fontSize: 20),), 191 | ), 192 | ), 193 | ], 194 | ) 195 | ), 196 | ] 197 | ), 198 | ) 199 | ); 200 | } 201 | 202 | // Charts Data 203 | List gradientColors = [ 204 | const Color(0xffe68823), 205 | const Color(0xffe68823), 206 | ]; 207 | 208 | LineChartData mainData() { 209 | return LineChartData( 210 | borderData: FlBorderData( 211 | show: false, 212 | ), 213 | gridData: FlGridData( 214 | show: false, 215 | horizontalInterval: 1.6, 216 | drawVerticalLine: false 217 | ), 218 | titlesData: FlTitlesData( 219 | show: false, 220 | rightTitles: SideTitles(showTitles: false), 221 | topTitles: SideTitles(showTitles: false), 222 | bottomTitles: SideTitles( 223 | showTitles: false, 224 | reservedSize: 22, 225 | interval: 1, 226 | getTextStyles: (context, value) => const TextStyle( 227 | color: Color(0xff68737d), 228 | fontWeight: FontWeight.bold, 229 | fontSize: 8 230 | ), 231 | getTitles: (value) { 232 | switch (value.toInt()) { 233 | case 1: 234 | return 'JAN'; 235 | case 2: 236 | return 'FEB'; 237 | case 3: 238 | return 'MAR'; 239 | case 4: 240 | return 'APR'; 241 | case 5: 242 | return 'MAY'; 243 | case 6: 244 | return 'JUN'; 245 | case 7: 246 | return 'JUL'; 247 | case 8: 248 | return 'AUG'; 249 | case 9: 250 | return 'SEP'; 251 | case 10: 252 | return 'OCT'; 253 | case 11: 254 | return 'NOV'; 255 | case 12: 256 | return 'DEC'; 257 | } 258 | return ''; 259 | }, 260 | margin: 10, 261 | ), 262 | leftTitles: SideTitles( 263 | showTitles: false, 264 | interval: 1, 265 | getTextStyles: (context, value) => const TextStyle( 266 | color: Color(0xff67727d), 267 | fontWeight: FontWeight.bold, 268 | fontSize: 12, 269 | ), 270 | 271 | getTitles: (value) { 272 | switch (value.toInt()) { 273 | case 1: 274 | return '10k'; 275 | case 3: 276 | return '30k'; 277 | case 5: 278 | return '50k'; 279 | } 280 | return ''; 281 | }, 282 | ), 283 | ), 284 | minX: 0, 285 | maxX: _currentIndex == 0 ? _daylySpots.length-1.toDouble() : _currentIndex == 1 ? _monthlySpots.length-1.toDouble() : _currentIndex == 2 ? _daylySpots.length-20.toDouble() : _daylySpots.length.toDouble(), 286 | minY: 0, 287 | maxY: 200, 288 | lineTouchData: LineTouchData( 289 | getTouchedSpotIndicator: (LineChartBarData barData, List spotIndexes) { 290 | return spotIndexes.map((index) { 291 | return TouchedSpotIndicatorData( 292 | FlLine( 293 | color: Colors.white.withOpacity(0.1), 294 | strokeWidth: 2, 295 | dashArray: [3, 3], 296 | ), 297 | FlDotData( 298 | show: false, 299 | getDotPainter: (spot, percent, barData, index) => 300 | FlDotCirclePainter( 301 | radius: 8, 302 | color: [ 303 | Colors.black, 304 | Colors.black, 305 | ][index], 306 | strokeWidth: 2, 307 | strokeColor: Colors.black, 308 | ), 309 | ), 310 | ); 311 | }).toList(); 312 | }, 313 | enabled: true, 314 | touchTooltipData: LineTouchTooltipData( 315 | tooltipPadding: const EdgeInsets.all(8), 316 | tooltipBgColor: Color(0xff2e3747).withOpacity(0.8), 317 | getTooltipItems: (touchedSpots) { 318 | return touchedSpots.map((touchedSpot) { 319 | return LineTooltipItem( 320 | '\$${touchedSpot.y.round()}.00', 321 | const TextStyle(color: Colors.white, fontSize: 12.0), 322 | 323 | ); 324 | }).toList(); 325 | }, 326 | ), 327 | handleBuiltInTouches: true, 328 | ), 329 | lineBarsData: [ 330 | LineChartBarData( 331 | spots: _currentIndex == 0 ? _daylySpots : _currentIndex == 1 ? _monthlySpots : _daylySpots, 332 | isCurved: true, 333 | colors: gradientColors, 334 | barWidth: 2, 335 | dotData: FlDotData( 336 | show: false, 337 | ), 338 | belowBarData: BarAreaData( 339 | show: true, 340 | gradientFrom: Offset(0, 0), 341 | gradientTo: Offset(0, 1), 342 | colors: [ 343 | Color(0xffe68823).withOpacity(0.1), 344 | Color(0xffe68823).withOpacity(0), 345 | ] 346 | ), 347 | ) 348 | ], 349 | ); 350 | } 351 | } --------------------------------------------------------------------------------