├── README.md
└── youtube_test
├── .gitignore
├── .metadata
├── analysis_options.yaml
├── android
├── .gitignore
├── app
│ ├── build.gradle
│ └── src
│ │ ├── debug
│ │ └── AndroidManifest.xml
│ │ ├── main
│ │ ├── AndroidManifest.xml
│ │ ├── kotlin
│ │ │ └── com
│ │ │ │ └── example
│ │ │ │ └── youtube_test
│ │ │ │ └── MainActivity.kt
│ │ └── res
│ │ │ ├── drawable-v21
│ │ │ └── launch_background.xml
│ │ │ ├── drawable
│ │ │ └── launch_background.xml
│ │ │ ├── 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
│ │ │ ├── values-night
│ │ │ └── styles.xml
│ │ │ └── values
│ │ │ └── styles.xml
│ │ └── profile
│ │ └── AndroidManifest.xml
├── build.gradle
├── gradle.properties
├── gradle
│ └── wrapper
│ │ └── gradle-wrapper.properties
└── settings.gradle
├── assets
├── 1.jpg
├── 10.jpg
├── 11.jpg
├── 12.jpg
├── 13.jpg
├── 2.jpg
├── 3.jpg
├── 4.jpg
├── 5.jpg
├── 6.jpg
├── 7.jpg
├── 8.jpg
└── 9.jpg
├── lib
├── main.dart
└── main_screen.dart
├── pubspec.lock
└── pubspec.yaml
/README.md:
--------------------------------------------------------------------------------
1 | # Shop app UI using Flutter
2 | ## Preview
3 | https://www.instagram.com/tv/CfwMBHYD-uw/?utm_source=ig_web_copy_link
4 | ## Links
5 | ### Support Me
6 |
7 | ### Socials
8 |
9 |
10 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/youtube_test/.gitignore:
--------------------------------------------------------------------------------
1 | # Miscellaneous
2 | *.class
3 | *.log
4 | *.pyc
5 | *.swp
6 | .DS_Store
7 | .atom/
8 | .buildlog/
9 | .history
10 | .svn/
11 | migrate_working_dir/
12 |
13 | # IntelliJ related
14 | *.iml
15 | *.ipr
16 | *.iws
17 | .idea/
18 |
19 | # The .vscode folder contains launch configuration and tasks you configure in
20 | # VS Code which you may wish to be included in version control, so this line
21 | # is commented out by default.
22 | #.vscode/
23 |
24 | # Flutter/Dart/Pub related
25 | **/doc/api/
26 | **/ios/Flutter/.last_build_id
27 | .dart_tool/
28 | .flutter-plugins
29 | .flutter-plugins-dependencies
30 | .packages
31 | .pub-cache/
32 | .pub/
33 | /build/
34 |
35 | # Web related
36 | lib/generated_plugin_registrant.dart
37 |
38 | # Symbolication related
39 | app.*.symbols
40 |
41 | # Obfuscation related
42 | app.*.map.json
43 |
44 | # Android Studio will place build artifacts here
45 | /android/app/debug
46 | /android/app/profile
47 | /android/app/release
48 |
--------------------------------------------------------------------------------
/youtube_test/.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.
5 |
6 | version:
7 | revision: cd41fdd495f6944ecd3506c21e94c6567b073278
8 | channel: stable
9 |
10 | project_type: app
11 |
12 | # Tracks metadata for the flutter migrate command
13 | migration:
14 | platforms:
15 | - platform: root
16 | create_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
17 | base_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
18 | - platform: android
19 | create_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
20 | base_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
21 | - platform: ios
22 | create_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
23 | base_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
24 | - platform: linux
25 | create_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
26 | base_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
27 | - platform: macos
28 | create_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
29 | base_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
30 | - platform: web
31 | create_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
32 | base_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
33 | - platform: windows
34 | create_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
35 | base_revision: cd41fdd495f6944ecd3506c21e94c6567b073278
36 |
37 | # User provided section
38 |
39 | # List of Local paths (relative to this file) that should be
40 | # ignored by the migrate tool.
41 | #
42 | # Files that are not part of the templates will be ignored by default.
43 | unmanaged_files:
44 | - 'lib/main.dart'
45 | - 'ios/Runner.xcodeproj/project.pbxproj'
46 |
--------------------------------------------------------------------------------
/youtube_test/analysis_options.yaml:
--------------------------------------------------------------------------------
1 | # This file configures the analyzer, which statically analyzes Dart code to
2 | # check for errors, warnings, and lints.
3 | #
4 | # The issues identified by the analyzer are surfaced in the UI of Dart-enabled
5 | # IDEs (https://dart.dev/tools#ides-and-editors). The analyzer can also be
6 | # invoked from the command line by running `flutter analyze`.
7 |
8 | # The following line activates a set of recommended lints for Flutter apps,
9 | # packages, and plugins designed to encourage good coding practices.
10 | include: package:flutter_lints/flutter.yaml
11 |
12 | linter:
13 | # The lint rules applied to this project can be customized in the
14 | # section below to disable rules from the `package:flutter_lints/flutter.yaml`
15 | # included above or to enable additional rules. A list of all available lints
16 | # and their documentation is published at
17 | # https://dart-lang.github.io/linter/lints/index.html.
18 | #
19 | # Instead of disabling a lint rule for the entire project in the
20 | # section below, it can also be suppressed for a single line of code
21 | # or a specific dart file by using the `// ignore: name_of_lint` and
22 | # `// ignore_for_file: name_of_lint` syntax on the line or in the file
23 | # producing the lint.
24 | rules:
25 | # avoid_print: false # Uncomment to disable the `avoid_print` rule
26 | # prefer_single_quotes: true # Uncomment to enable the `prefer_single_quotes` rule
27 |
28 | # Additional information about this file can be found at
29 | # https://dart.dev/guides/language/analysis-options
30 |
--------------------------------------------------------------------------------
/youtube_test/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 | **/*.keystore
13 | **/*.jks
14 |
--------------------------------------------------------------------------------
/youtube_test/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 flutter.compileSdkVersion
30 | ndkVersion flutter.ndkVersion
31 |
32 | compileOptions {
33 | sourceCompatibility JavaVersion.VERSION_1_8
34 | targetCompatibility JavaVersion.VERSION_1_8
35 | }
36 |
37 | kotlinOptions {
38 | jvmTarget = '1.8'
39 | }
40 |
41 | sourceSets {
42 | main.java.srcDirs += 'src/main/kotlin'
43 | }
44 |
45 | defaultConfig {
46 | // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
47 | applicationId "com.example.youtube_test"
48 | // You can update the following values to match your application needs.
49 | // For more information, see: https://docs.flutter.dev/deployment/android#reviewing-the-build-configuration.
50 | minSdkVersion flutter.minSdkVersion
51 | targetSdkVersion flutter.targetSdkVersion
52 | versionCode flutterVersionCode.toInteger()
53 | versionName flutterVersionName
54 | }
55 |
56 | buildTypes {
57 | release {
58 | // TODO: Add your own signing config for the release build.
59 | // Signing with the debug keys for now, so `flutter run --release` works.
60 | signingConfig signingConfigs.debug
61 | }
62 | }
63 | }
64 |
65 | flutter {
66 | source '../..'
67 | }
68 |
69 | dependencies {
70 | implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
71 | }
72 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/debug/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
3 |
7 |
8 |
9 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
3 |
7 |
15 |
19 |
23 |
24 |
25 |
26 |
27 |
28 |
30 |
33 |
34 |
35 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/kotlin/com/example/youtube_test/MainActivity.kt:
--------------------------------------------------------------------------------
1 | package com.example.youtube_test
2 |
3 | import io.flutter.embedding.android.FlutterActivity
4 |
5 | class MainActivity: FlutterActivity() {
6 | }
7 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/drawable-v21/launch_background.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
12 |
13 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/drawable/launch_background.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
12 |
13 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/mipmap-hdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/mipmap-mdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/values-night/styles.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
9 |
15 |
18 |
19 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/main/res/values/styles.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
9 |
15 |
18 |
19 |
--------------------------------------------------------------------------------
/youtube_test/android/app/src/profile/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
3 |
7 |
8 |
9 |
--------------------------------------------------------------------------------
/youtube_test/android/build.gradle:
--------------------------------------------------------------------------------
1 | buildscript {
2 | ext.kotlin_version = '1.6.10'
3 | repositories {
4 | google()
5 | mavenCentral()
6 | }
7 |
8 | dependencies {
9 | classpath 'com.android.tools.build:gradle:7.1.2'
10 | classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
11 | }
12 | }
13 |
14 | allprojects {
15 | repositories {
16 | google()
17 | mavenCentral()
18 | }
19 | }
20 |
21 | rootProject.buildDir = '../build'
22 | subprojects {
23 | project.buildDir = "${rootProject.buildDir}/${project.name}"
24 | }
25 | subprojects {
26 | project.evaluationDependsOn(':app')
27 | }
28 |
29 | task clean(type: Delete) {
30 | delete rootProject.buildDir
31 | }
32 |
--------------------------------------------------------------------------------
/youtube_test/android/gradle.properties:
--------------------------------------------------------------------------------
1 | org.gradle.jvmargs=-Xmx1536M
2 | android.useAndroidX=true
3 | android.enableJetifier=true
4 |
--------------------------------------------------------------------------------
/youtube_test/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-7.4-all.zip
7 |
--------------------------------------------------------------------------------
/youtube_test/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 |
--------------------------------------------------------------------------------
/youtube_test/assets/1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/1.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/10.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/10.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/11.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/11.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/12.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/12.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/13.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/13.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/2.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/3.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/4.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/5.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/5.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/6.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/6.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/7.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/7.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/8.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/8.jpg
--------------------------------------------------------------------------------
/youtube_test/assets/9.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmirBayat0/Flutter-shop-app-UI/bdceb98707814a183a3736abd32f70cd62e140cd/youtube_test/assets/9.jpg
--------------------------------------------------------------------------------
/youtube_test/lib/main.dart:
--------------------------------------------------------------------------------
1 | import 'package:flutter/material.dart';
2 | import 'package:youtube_test/main_screen.dart';
3 |
4 | void main() {
5 | runApp(const MyApp());
6 | }
7 |
8 | //@CodeWithFlexz on Instagram
9 |
10 | //AmirBayat0 on Github
11 | //Programming with Flexz on Youtube
12 |
13 | class MyApp extends StatelessWidget {
14 | const MyApp({Key? key}) : super(key: key);
15 |
16 | @override
17 | Widget build(BuildContext context) {
18 | return const MaterialApp(
19 | debugShowCheckedModeBanner: false,
20 | home: MainScreen(),
21 | );
22 | }
23 | }
24 |
--------------------------------------------------------------------------------
/youtube_test/lib/main_screen.dart:
--------------------------------------------------------------------------------
1 | import 'dart:async';
2 |
3 | import 'package:flutter/material.dart';
4 | import 'package:bottom_navy_bar/bottom_navy_bar.dart';
5 | import 'package:smooth_page_indicator/smooth_page_indicator.dart';
6 |
7 | class MainScreen extends StatefulWidget {
8 | const MainScreen({Key? key}) : super(key: key);
9 |
10 | @override
11 | State createState() => _MainScreenState();
12 | }
13 |
14 | class _MainScreenState extends State {
15 | int indexOfBTB = 0;
16 | int indexOfPageview = 0;
17 | int indexOfCategories = 0;
18 | PageController pageController = PageController(initialPage: 0);
19 |
20 | @override
21 | void initState() {
22 | super.initState();
23 |
24 | /// For Changing Index of Page View Automatically
25 | Timer.periodic(const Duration(seconds: 3), (Timer timer) {
26 | if (indexOfPageview < 12) {
27 | indexOfPageview++;
28 | pageController.animateToPage(
29 | indexOfPageview,
30 | duration: const Duration(milliseconds: 350),
31 | curve: Curves.ease,
32 | );
33 | } else {
34 | indexOfPageview = -1;
35 | }
36 | });
37 | }
38 |
39 | @override
40 | void dispose() {
41 | pageController.dispose();
42 | super.dispose();
43 | }
44 |
45 | /// List of Icons(for Categories) just for debuging
46 | List icons = [
47 | Icons.safety_check,
48 | Icons.ac_unit,
49 | Icons.label,
50 | Icons.data_saver_on_outlined,
51 | Icons.umbrella_outlined,
52 | Icons.widgets,
53 | Icons.earbuds_battery,
54 | Icons.safety_check,
55 | Icons.wallet,
56 | Icons.gps_fixed,
57 | Icons.hourglass_full,
58 | Icons.spa_rounded
59 | ];
60 |
61 | String showProductName(index) {
62 | switch (index) {
63 | case 0:
64 | return "Dresses";
65 | case 1:
66 | return "Tops, Tees & Blouses";
67 | case 2:
68 | return "Sweaters";
69 | case 3:
70 | return "Jeans";
71 | case 4:
72 | return "Leggings";
73 | case 5:
74 | return "Active";
75 | case 6:
76 | return "Skirts";
77 | case 7:
78 | return "Socks & Hosiery";
79 | case 8:
80 | return "Suiting & Blazers";
81 | case 9:
82 | return "Bodysuits";
83 | case 10:
84 | return "Shorts";
85 | case 11:
86 | return "ُShoes";
87 | case 12:
88 | return "Sweaters";
89 |
90 | default:
91 | return "";
92 | }
93 | }
94 |
95 | @override
96 | Widget build(BuildContext context) {
97 | return SafeArea(
98 | child: Scaffold(
99 | body: Padding(
100 | padding: const EdgeInsets.only(top: 8, left: 4, right: 4),
101 | child: Column(
102 | crossAxisAlignment: CrossAxisAlignment.start,
103 | children: [
104 | /// AppBar
105 | Row(
106 | mainAxisAlignment: MainAxisAlignment.spaceBetween,
107 | children: [
108 | Container(
109 | margin: const EdgeInsets.all(5),
110 | width: 40,
111 | height: 40,
112 | decoration: BoxDecoration(
113 | color: Colors.grey.shade300,
114 | borderRadius: BorderRadius.circular(3)),
115 | child: Center(
116 | child: IconButton(
117 | onPressed: () {},
118 | icon: const Icon(
119 | Icons.menu,
120 | color: Colors.black,
121 | )),
122 | ),
123 | ),
124 | Container(
125 | margin: const EdgeInsets.all(5),
126 | width: 40,
127 | height: 40,
128 | decoration: BoxDecoration(
129 | color: Colors.grey.shade300,
130 | borderRadius: BorderRadius.circular(10)),
131 | child: Center(
132 | child: IconButton(
133 | onPressed: () {},
134 | icon: const Icon(
135 | Icons.search_sharp,
136 | color: Colors.black,
137 | )),
138 | ),
139 | ),
140 | ],
141 | ),
142 |
143 | /// Titles
144 | Padding(
145 | padding: const EdgeInsets.only(top: 12, left: 8),
146 | child: Column(
147 | crossAxisAlignment: CrossAxisAlignment.start,
148 | children: const [
149 | Text(
150 | "Hello Amir 👋",
151 | style: TextStyle(
152 | color: Colors.black,
153 | fontWeight: FontWeight.bold,
154 | fontSize: 30),
155 | ),
156 | Text(
157 | "Lets get somthing?",
158 | style: TextStyle(
159 | color: Colors.grey,
160 | fontWeight: FontWeight.w300,
161 | fontSize: 15),
162 | ),
163 | ],
164 | ),
165 | ),
166 |
167 | /// Page View
168 | Padding(
169 | padding: const EdgeInsets.only(top: 20),
170 | child: SizedBox(
171 | width: double.infinity,
172 | height: 250,
173 | child: PageView.builder(
174 | controller: pageController,
175 | onPageChanged: (val) {
176 | setState(() {
177 | indexOfPageview = val;
178 | });
179 | },
180 | itemCount: 13,
181 | physics: const BouncingScrollPhysics(),
182 | itemBuilder: (ctx, index) {
183 | return Container(
184 | margin: const EdgeInsets.all(5),
185 | decoration: BoxDecoration(
186 | borderRadius: BorderRadius.circular(20),
187 | image: DecorationImage(
188 | image: AssetImage('assets/${index + 1}.jpg'),
189 | fit: BoxFit.cover),
190 | ),
191 | );
192 | }),
193 | ),
194 | ),
195 |
196 | /// Page Indicator
197 | Padding(
198 | padding: const EdgeInsets.only(top: 10),
199 | child:
200 | Align(alignment: Alignment.center, child: pageindicator()),
201 | ),
202 |
203 | /// Top Categories Text
204 | Padding(
205 | padding: const EdgeInsets.only(top: 25, left: 10, right: 10),
206 | child: Row(
207 | crossAxisAlignment: CrossAxisAlignment.center,
208 | mainAxisAlignment: MainAxisAlignment.spaceBetween,
209 | children: const [
210 | Text(
211 | "Top Categories",
212 | style: TextStyle(
213 | fontWeight: FontWeight.bold,
214 | fontSize: 17,
215 | ),
216 | ),
217 | Text(
218 | "SEE ALL",
219 | style: TextStyle(
220 | color: Colors.deepOrange,
221 | fontWeight: FontWeight.bold,
222 | fontSize: 13,
223 | ),
224 | ),
225 | ],
226 | ),
227 | ),
228 |
229 | /// Categories List
230 | Padding(
231 | padding: const EdgeInsets.only(top: 10),
232 | child: SizedBox(
233 | width: double.infinity,
234 | height: 60,
235 | child: ListView.builder(
236 | physics: const BouncingScrollPhysics(),
237 | itemCount: icons.length,
238 | scrollDirection: Axis.horizontal,
239 | itemBuilder: (ctx, index) {
240 | return GestureDetector(
241 | onTap: () {
242 | setState(() {
243 | indexOfCategories = index;
244 | });
245 | },
246 | child: AnimatedContainer(
247 | duration: const Duration(milliseconds: 500),
248 | margin: const EdgeInsets.all(3),
249 | width: 55,
250 | decoration: BoxDecoration(
251 | color: indexOfCategories == index
252 | ? Colors.deepOrangeAccent
253 | : Colors.grey.shade300,
254 | borderRadius: BorderRadius.circular(15)),
255 | child: Center(
256 | child: Icon(
257 | icons[index],
258 | color: indexOfCategories == index
259 | ? Colors.white
260 | : Colors.grey,
261 | ),
262 | ),
263 | ),
264 | );
265 | }),
266 | ),
267 | ),
268 |
269 | /// Product List
270 | SizedBox(
271 | width: double.infinity,
272 | height: 218,
273 | child: Column(
274 | mainAxisAlignment: MainAxisAlignment.center,
275 | children: [
276 | Text(
277 | "A list of Products will be Shown here",
278 | style: TextStyle(color: Colors.grey.shade400),
279 | ),
280 | const SizedBox(
281 | height: 40,
282 | ),
283 | Text(
284 | showProductName(indexOfCategories),
285 | style: const TextStyle(
286 | fontSize: 20,
287 | fontWeight: FontWeight.bold,
288 | color: Colors.deepOrangeAccent),
289 | ),
290 | Icon(
291 | icons[indexOfCategories],
292 | size: 50,
293 | color: Colors.deepOrangeAccent,
294 | )
295 | ],
296 | ),
297 | )
298 | ],
299 | ),
300 | ),
301 | bottomNavigationBar: bottomNav(),
302 | ),
303 | );
304 | }
305 |
306 | /// Bottom Navigation Bar
307 | BottomNavyBar bottomNav() {
308 | return BottomNavyBar(
309 | selectedIndex: indexOfBTB,
310 | iconSize: 25,
311 | curve: Curves.ease,
312 | showElevation: true,
313 | onItemSelected: (index) => setState(() {
314 | indexOfBTB = index;
315 | }),
316 | items: [
317 | BottomNavyBarItem(
318 | icon: const Icon(Icons.home),
319 | title: const Text('Home'),
320 | activeColor: indexOfBTB == 0 ? Colors.deepOrange : Colors.grey,
321 | ),
322 | BottomNavyBarItem(
323 | icon: const Icon(Icons.favorite),
324 | title: const Text('Favorite'),
325 | activeColor: indexOfBTB == 1 ? Colors.deepOrange : Colors.grey),
326 | BottomNavyBarItem(
327 | icon: const Icon(Icons.shopping_cart),
328 | title: const Text('Carts'),
329 | activeColor: indexOfBTB == 2 ? Colors.deepOrange : Colors.grey),
330 | BottomNavyBarItem(
331 | icon: const Icon(Icons.person),
332 | title: const Text('Profile'),
333 | activeColor: indexOfBTB == 3 ? Colors.deepOrange : Colors.grey),
334 | ],
335 | );
336 | }
337 |
338 | /// Smooth Page Indicator Widget
339 | SmoothPageIndicator pageindicator() {
340 | return SmoothPageIndicator(
341 | controller: pageController,
342 | count: 13,
343 | effect: WormEffect(
344 | spacing: 5.0,
345 | radius: 10.0,
346 | dotWidth: 12.0,
347 | dotHeight: 12.0,
348 | dotColor: Colors.grey.shade400,
349 | activeDotColor: Colors.deepOrange),
350 | onDotClicked: (newIndex) {
351 | setState(() {
352 | pageController.animateToPage(newIndex,
353 | duration: const Duration(milliseconds: 500), curve: Curves.ease);
354 | });
355 | },
356 | );
357 | }
358 | }
359 |
--------------------------------------------------------------------------------
/youtube_test/pubspec.lock:
--------------------------------------------------------------------------------
1 | # Generated by pub
2 | # See https://dart.dev/tools/pub/glossary#lockfile
3 | packages:
4 | async:
5 | dependency: transitive
6 | description:
7 | name: async
8 | url: "https://pub.dartlang.org"
9 | source: hosted
10 | version: "2.8.2"
11 | boolean_selector:
12 | dependency: transitive
13 | description:
14 | name: boolean_selector
15 | url: "https://pub.dartlang.org"
16 | source: hosted
17 | version: "2.1.0"
18 | bottom_navy_bar:
19 | dependency: "direct main"
20 | description:
21 | name: bottom_navy_bar
22 | url: "https://pub.dartlang.org"
23 | source: hosted
24 | version: "6.0.0"
25 | characters:
26 | dependency: transitive
27 | description:
28 | name: characters
29 | url: "https://pub.dartlang.org"
30 | source: hosted
31 | version: "1.2.0"
32 | charcode:
33 | dependency: transitive
34 | description:
35 | name: charcode
36 | url: "https://pub.dartlang.org"
37 | source: hosted
38 | version: "1.3.1"
39 | clock:
40 | dependency: transitive
41 | description:
42 | name: clock
43 | url: "https://pub.dartlang.org"
44 | source: hosted
45 | version: "1.1.0"
46 | collection:
47 | dependency: transitive
48 | description:
49 | name: collection
50 | url: "https://pub.dartlang.org"
51 | source: hosted
52 | version: "1.16.0"
53 | cupertino_icons:
54 | dependency: "direct main"
55 | description:
56 | name: cupertino_icons
57 | url: "https://pub.dartlang.org"
58 | source: hosted
59 | version: "1.0.5"
60 | fake_async:
61 | dependency: transitive
62 | description:
63 | name: fake_async
64 | url: "https://pub.dartlang.org"
65 | source: hosted
66 | version: "1.3.0"
67 | flutter:
68 | dependency: "direct main"
69 | description: flutter
70 | source: sdk
71 | version: "0.0.0"
72 | flutter_lints:
73 | dependency: "direct dev"
74 | description:
75 | name: flutter_lints
76 | url: "https://pub.dartlang.org"
77 | source: hosted
78 | version: "2.0.1"
79 | flutter_test:
80 | dependency: "direct dev"
81 | description: flutter
82 | source: sdk
83 | version: "0.0.0"
84 | lints:
85 | dependency: transitive
86 | description:
87 | name: lints
88 | url: "https://pub.dartlang.org"
89 | source: hosted
90 | version: "2.0.0"
91 | matcher:
92 | dependency: transitive
93 | description:
94 | name: matcher
95 | url: "https://pub.dartlang.org"
96 | source: hosted
97 | version: "0.12.11"
98 | material_color_utilities:
99 | dependency: transitive
100 | description:
101 | name: material_color_utilities
102 | url: "https://pub.dartlang.org"
103 | source: hosted
104 | version: "0.1.4"
105 | meta:
106 | dependency: transitive
107 | description:
108 | name: meta
109 | url: "https://pub.dartlang.org"
110 | source: hosted
111 | version: "1.7.0"
112 | path:
113 | dependency: transitive
114 | description:
115 | name: path
116 | url: "https://pub.dartlang.org"
117 | source: hosted
118 | version: "1.8.1"
119 | sky_engine:
120 | dependency: transitive
121 | description: flutter
122 | source: sdk
123 | version: "0.0.99"
124 | smooth_page_indicator:
125 | dependency: "direct main"
126 | description:
127 | name: smooth_page_indicator
128 | url: "https://pub.dartlang.org"
129 | source: hosted
130 | version: "1.0.0+2"
131 | source_span:
132 | dependency: transitive
133 | description:
134 | name: source_span
135 | url: "https://pub.dartlang.org"
136 | source: hosted
137 | version: "1.8.2"
138 | stack_trace:
139 | dependency: transitive
140 | description:
141 | name: stack_trace
142 | url: "https://pub.dartlang.org"
143 | source: hosted
144 | version: "1.10.0"
145 | stream_channel:
146 | dependency: transitive
147 | description:
148 | name: stream_channel
149 | url: "https://pub.dartlang.org"
150 | source: hosted
151 | version: "2.1.0"
152 | string_scanner:
153 | dependency: transitive
154 | description:
155 | name: string_scanner
156 | url: "https://pub.dartlang.org"
157 | source: hosted
158 | version: "1.1.0"
159 | term_glyph:
160 | dependency: transitive
161 | description:
162 | name: term_glyph
163 | url: "https://pub.dartlang.org"
164 | source: hosted
165 | version: "1.2.0"
166 | test_api:
167 | dependency: transitive
168 | description:
169 | name: test_api
170 | url: "https://pub.dartlang.org"
171 | source: hosted
172 | version: "0.4.9"
173 | vector_math:
174 | dependency: transitive
175 | description:
176 | name: vector_math
177 | url: "https://pub.dartlang.org"
178 | source: hosted
179 | version: "2.1.2"
180 | sdks:
181 | dart: ">=2.17.3 <3.0.0"
182 |
--------------------------------------------------------------------------------
/youtube_test/pubspec.yaml:
--------------------------------------------------------------------------------
1 | name: youtube_test
2 | description: A new Flutter project.
3 |
4 | # The following line prevents the package from being accidentally published to
5 | # pub.dev using `flutter 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: ">=2.17.3 <3.0.0"
22 |
23 | # Dependencies specify other packages that your package needs in order to work.
24 | # To automatically upgrade your package dependencies to the latest versions
25 | # consider running `flutter pub upgrade --major-versions`. Alternatively,
26 | # dependencies can be manually updated by changing the version numbers below to
27 | # the latest version available on pub.dev. To see which dependencies have newer
28 | # versions available, run `flutter pub outdated`.
29 | dependencies:
30 | flutter:
31 | sdk: flutter
32 |
33 |
34 | # The following adds the Cupertino Icons font to your application.
35 | # Use with the CupertinoIcons class for iOS style icons.
36 | cupertino_icons: ^1.0.2
37 | bottom_navy_bar: ^6.0.0
38 | smooth_page_indicator: ^1.0.0+2
39 |
40 | dev_dependencies:
41 | flutter_test:
42 | sdk: flutter
43 |
44 | # The "flutter_lints" package below contains a set of recommended lints to
45 | # encourage good coding practices. The lint set provided by the package is
46 | # activated in the `analysis_options.yaml` file located at the root of your
47 | # package. See that file for information about deactivating specific lint
48 | # rules and activating additional ones.
49 | flutter_lints: ^2.0.0
50 |
51 | # For information on the generic Dart part of this file, see the
52 | # following page: https://dart.dev/tools/pub/pubspec
53 |
54 | # The following section is specific to Flutter packages.
55 | flutter:
56 |
57 | # The following line ensures that the Material Icons font is
58 | # included with your application, so that you can use the icons in
59 | # the material Icons class.
60 | uses-material-design: true
61 |
62 | # To add assets to your application, add an assets section, like this:
63 | assets:
64 | - assets/
65 |
66 |
67 | # An image asset can refer to one or more resolution-specific "variants", see
68 | # https://flutter.dev/assets-and-images/#resolution-aware
69 |
70 | # For details regarding adding assets from package dependencies, see
71 | # https://flutter.dev/assets-and-images/#from-packages
72 |
73 | # To add custom fonts to your application, add a fonts section here,
74 | # in this "flutter" section. Each entry in this list should have a
75 | # "family" key with the font family name, and a "fonts" key with a
76 | # list giving the asset and other descriptors for the font. For
77 | # example:
78 | # fonts:
79 | # - family: Schyler
80 | # fonts:
81 | # - asset: fonts/Schyler-Regular.ttf
82 | # - asset: fonts/Schyler-Italic.ttf
83 | # style: italic
84 | # - family: Trajan Pro
85 | # fonts:
86 | # - asset: fonts/TrajanPro.ttf
87 | # - asset: fonts/TrajanPro_Bold.ttf
88 | # weight: 700
89 | #
90 | # For details regarding fonts from package dependencies,
91 | # see https://flutter.dev/custom-fonts/#from-packages
92 |
--------------------------------------------------------------------------------