├── LICENSE ├── Local_Database_example ├── IO │ ├── path_provider.dart │ └── shared_preference.dart ├── helpers │ └── trans_status.dart ├── main.dart ├── module │ ├── Login_Manager.dart │ └── login_data.dart ├── pubspec.yaml └── screens │ ├── login.dart │ └── text_editor.dart ├── README.md ├── about_flutter.md ├── daily_quote ├── Readme.md ├── lib │ ├── constants.dart │ ├── helpers │ │ └── trans_status.dart │ ├── main.dart │ ├── module │ │ └── quote.dart │ ├── screens │ │ └── home.dart │ ├── service │ │ └── https.dart │ └── widgets │ │ ├── alert_message.dart │ │ └── bottom_app_bar.dart └── pubspec.yaml ├── dart_1_tasks.md ├── dart_2_Classes_material.md ├── dart_2_tasks.md ├── design_patterns └── provider_example.dart ├── flutter_shopping_cart_provider_project ├── Capture1.PNG ├── Capture2.PNG ├── Capture3.PNG ├── Capture4.PNG ├── main.dart ├── models │ ├── cart.dart │ └── item.dart ├── pubspec.yaml ├── references.txt └── screens │ └── checkout_page.dart ├── messenger_screen ├── assets │ └── images │ │ ├── person_1.png │ │ ├── person_2.jpg │ │ ├── person_3.jpg │ │ ├── person_4.png │ │ ├── person_5.png │ │ └── person_6.jpg ├── lib │ ├── main.dart │ ├── messenger_screen.dart │ └── model │ │ ├── chat_model.dart │ │ └── story_model.dart └── pubspec.yaml ├── task1.png └── tricks ├── bottom_nav_bar.dart ├── calls_sms_emails.dart ├── snack_bar.dart ├── tab_bar.dart └── transparent_status_bar.dart /LICENSE: -------------------------------------------------------------------------------- 1 | BSD 3-Clause License 2 | 3 | Copyright (c) 2022, Google GDSC Sohag 4 | All rights reserved. 5 | 6 | Redistribution and use in source and binary forms, with or without 7 | modification, are permitted provided that the following conditions are met: 8 | 9 | 1. Redistributions of source code must retain the above copyright notice, this 10 | list of conditions and the following disclaimer. 11 | 12 | 2. Redistributions in binary form must reproduce the above copyright notice, 13 | this list of conditions and the following disclaimer in the documentation 14 | and/or other materials provided with the distribution. 15 | 16 | 3. Neither the name of the copyright holder nor the names of its 17 | contributors may be used to endorse or promote products derived from 18 | this software without specific prior written permission. 19 | 20 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" 21 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 22 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 23 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE 24 | FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL 25 | DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR 26 | SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER 27 | CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, 28 | OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 29 | OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 30 | -------------------------------------------------------------------------------- /Local_Database_example/IO/path_provider.dart: -------------------------------------------------------------------------------- 1 | import 'dart:io' as io; 2 | import 'package:path_provider/path_provider.dart' as pp; 3 | 4 | Future get _localPath async { 5 | final directory = await pp.getApplicationDocumentsDirectory();//Android/com.thomas.appName 6 | return directory.path; 7 | } 8 | 9 | Future get _localFile async { 10 | final path = await _localPath; 11 | print(path); 12 | return io.File('$path/note1.txt'); 13 | } 14 | 15 | Future writeData(String text) async { 16 | final file = await _localFile; 17 | print(text); 18 | return file.writeAsString('$text\r\n', mode: io.FileMode.write); 19 | } 20 | //writeData('My name is Thomas'); 21 | //note1.txt >> My name is Thomas 22 | // 23 | 24 | Future get readData async{ 25 | try{ 26 | final file = await _localFile; 27 | String body = await file.readAsString(); 28 | return body; 29 | } catch(e){ 30 | print(e); 31 | } 32 | } -------------------------------------------------------------------------------- /Local_Database_example/IO/shared_preference.dart: -------------------------------------------------------------------------------- 1 | import 'package:shared_preferences/shared_preferences.dart'; 2 | 3 | Future writeData(String text) async{ 4 | SharedPreferences pref = await SharedPreferences.getInstance(); 5 | pref.setString('note1', text); 6 | } 7 | 8 | Future get readData async{ 9 | SharedPreferences pref = await SharedPreferences.getInstance(); 10 | String? result = pref.getString('note1'); 11 | return result; 12 | } 13 | -------------------------------------------------------------------------------- /Local_Database_example/helpers/trans_status.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:flutter/services.dart'; 3 | 4 | void transStatus(){ 5 | SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle(statusBarColor: Colors.transparent)); 6 | } -------------------------------------------------------------------------------- /Local_Database_example/main.dart: -------------------------------------------------------------------------------- 1 | import 'package:database_project/helpers/trans_status.dart'; 2 | import 'package:database_project/screens/text_editor.dart'; 3 | import 'package:flutter/material.dart'; 4 | 5 | void main() { 6 | transStatus(); 7 | runApp(const MyApp()); 8 | } 9 | 10 | class MyApp extends StatelessWidget { 11 | const MyApp({Key? key}) : super(key: key); 12 | 13 | // This widget is the root of your application. 14 | @override 15 | Widget build(BuildContext context) { 16 | return MaterialApp( 17 | title: 'GDSC Sohag', 18 | debugShowCheckedModeBanner: false, 19 | theme: ThemeData( 20 | primarySwatch: Colors.blue, 21 | ), 22 | home: const TextEditor(), 23 | ); 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /Local_Database_example/module/Login_Manager.dart: -------------------------------------------------------------------------------- 1 | import 'dart:convert'; 2 | import 'package:database_project/module/login_data.dart'; 3 | import 'package:shared_preferences/shared_preferences.dart'; 4 | 5 | class LoginManager { 6 | 7 | Future saveToPreference(List users) async { 8 | SharedPreferences pref = await SharedPreferences.getInstance(); 9 | pref.setString("user 1", userToJson(users)); 10 | } 11 | 12 | Future get loadFromPreference async{ 13 | final SharedPreferences prefs = await SharedPreferences.getInstance(); 14 | final String? user = prefs.getString('user 1') ; 15 | return user; 16 | } 17 | 18 | List userFromJson(String str) => 19 | List.from(json.decode(str).map((x) => User.fromJson(x))); 20 | 21 | String userToJson(List data) => 22 | json.encode(List.from(data.map((x) => x.toJson()))); 23 | } 24 | -------------------------------------------------------------------------------- /Local_Database_example/module/login_data.dart: -------------------------------------------------------------------------------- 1 | 2 | class User{ 3 | final String name; 4 | final String pass; 5 | 6 | User({required this.name, required this.pass}); 7 | 8 | factory User.fromJson(Map json) => User( 9 | name: json["name"], 10 | pass: json["pass"], 11 | ); 12 | 13 | Map toJson() => { 14 | "name": name, 15 | "pass": pass, 16 | }; 17 | } -------------------------------------------------------------------------------- /Local_Database_example/pubspec.yaml: -------------------------------------------------------------------------------- 1 | name: database_project 2 | description: A new Flutter project for google dsc sohag chapter 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.15.0 <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 | path_provider: ^2.0.9 38 | shared_preferences: ^2.0.13 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: ^1.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. 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 | # - images/a_dot_burr.jpeg 65 | # - images/a_dot_ham.jpeg 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 | -------------------------------------------------------------------------------- /Local_Database_example/screens/login.dart: -------------------------------------------------------------------------------- 1 | import 'dart:convert'; 2 | 3 | import 'package:database_project/module/Login_Manager.dart'; 4 | import 'package:database_project/module/login_data.dart'; 5 | import 'package:flutter/material.dart'; 6 | 7 | 8 | class UserLogin extends StatefulWidget { 9 | const UserLogin({Key? key}) : super(key: key); 10 | 11 | @override 12 | _UserLoginState createState() => _UserLoginState(); 13 | } 14 | 15 | class _UserLoginState extends State { 16 | TextEditingController userName = TextEditingController(); 17 | TextEditingController password = TextEditingController(); 18 | 19 | @override 20 | void initState() { 21 | super.initState(); 22 | LoginManager().loadFromPreference.then((value) { 23 | setState(() { 24 | Map map = jsonDecode(value!)[0]; 25 | User myUser = User.fromJson(map); 26 | print(map); 27 | userName.text = myUser.name; 28 | password.text = myUser.pass; 29 | }); 30 | }); 31 | } 32 | 33 | @override 34 | Widget build(BuildContext context) { 35 | return Scaffold( 36 | body: Padding( 37 | padding: const EdgeInsets.all(24.0), 38 | child: Column( 39 | mainAxisAlignment: MainAxisAlignment.center, 40 | children: [ 41 | Padding( 42 | padding: const EdgeInsets.all(8.0), 43 | child: TextField( 44 | controller: userName, 45 | decoration: const InputDecoration( 46 | labelText: 'Username', 47 | border: OutlineInputBorder(), 48 | ), 49 | ), 50 | ), 51 | Padding( 52 | padding: const EdgeInsets.all(8.0), 53 | child: TextField( 54 | controller: password, 55 | decoration: const InputDecoration( 56 | labelText: 'Password', 57 | border: OutlineInputBorder(), 58 | ), 59 | ), 60 | ), 61 | ], 62 | ), 63 | ), 64 | floatingActionButton: FloatingActionButton( 65 | onPressed: () => LoginManager().saveToPreference([ 66 | User(name: userName.text, pass: password.text), 67 | ]), 68 | child: const Icon(Icons.save_alt_outlined), 69 | ), 70 | ); 71 | } 72 | } 73 | -------------------------------------------------------------------------------- /Local_Database_example/screens/text_editor.dart: -------------------------------------------------------------------------------- 1 | // import 'package:database_project/IO/path_provider.dart' as pp; 2 | import 'package:database_project/IO/shared_preference.dart' as pref; 3 | import 'package:flutter/material.dart'; 4 | 5 | class TextEditor extends StatefulWidget { 6 | const TextEditor({Key? key}) : super(key: key); 7 | 8 | @override 9 | _TextEditorState createState() => _TextEditorState(); 10 | } 11 | 12 | class _TextEditorState extends State { 13 | 14 | 15 | TextEditingController controller = TextEditingController(); 16 | @override 17 | void initState() { 18 | super.initState(); 19 | setState(() { 20 | pref.readData.then((String? value){ 21 | controller.text = value!; 22 | }); 23 | }); 24 | 25 | } 26 | @override 27 | Widget build(BuildContext context) { 28 | // Size size = MediaQuery.of(context).size; 29 | return Scaffold( 30 | backgroundColor: Colors.grey[100], 31 | body: Padding( 32 | padding: const EdgeInsets.fromLTRB(12, 38, 8, 12), 33 | child: TextField( 34 | controller: controller, 35 | decoration: const InputDecoration( 36 | hintText: 'Hi this is a hint', 37 | border: InputBorder.none, 38 | ), 39 | autocorrect: false, 40 | autofocus: true, 41 | cursorColor: Colors.blue, 42 | style: const TextStyle( 43 | fontSize: 24.0, 44 | ), 45 | keyboardType: TextInputType.multiline, 46 | maxLines: null, 47 | ), 48 | ), 49 | floatingActionButton: FloatingActionButton( 50 | child: const Icon(Icons.save_alt_outlined), 51 | onPressed: (){ 52 | pref.writeData(controller.text); 53 | }, 54 | ), 55 | ); 56 | } 57 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Flutter-Tasks 2 | 3 | 4 | ## In this repository, you will learn : 5 | 6 | 1) Dart language basics : 7 | - 8 | 9 | 2) Dart OOP (Object Oriented Programming) : 10 | - 11 | 12 | 3) Flutter using Android Studio : 13 | - 14 | 15 | 4) Databases using Dart in a flutter application : 16 | - 17 | -------------------------------------------------------------------------------- /about_flutter.md: -------------------------------------------------------------------------------- 1 |

Flutter Frequently Questions and Answers

2 | 3 | ## *Questions* 4 | [1. What is Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#1-what-is-flutter) 5 | 6 | [2. What are the advantages of using Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#2-what-are-the-advantages-of-using-flutter) 7 | 8 | [3. What is the Flutter architecture?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#3-what-is-the-flutter-architecture) 9 | 10 | [4. What build modes are available in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#4-what-build-modes-are-available-in-flutter) 11 | 12 | [5. What is the Dart programming language?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#5-what-is-the-dart-programming-language) 13 | 14 | [6. Is Dart language necessary for Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 15 | 16 | [7. What are widgets in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#7-what-are-widgets-in-flutter) 17 | 18 | [8. What are the most useful editors for Flutter apps?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#8-what-are-the-most-useful-editors-for-flutter-apps) 19 | 20 | [9. What are packages and plugins in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 21 | 22 | [10. Are there any popular apps which make use of Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#10-are-there-any-popular-apps-which-make-use-of-flutter) 23 | 24 | [11. In What technology is Flutter built?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 25 | 26 | [12.What is the App state?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 27 | 28 | [13. What do you mean by keys in flutter? and its uses](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 29 | 30 | [14. What is Flutter Inspector?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 31 | 32 | [15. Different types of streams in Dart](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 33 | 34 | [16. What is the difference between SizedBox and Container?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 35 | 36 | [17. What is Fat Arrow Notation in Dart and when do you use it?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 37 | 38 | [18. How many types of widgets are there in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 39 | 40 | [19. When should you use WidgetsBindingObserver?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 41 | 42 | [20. What is Dart and why does Flutter use it?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#9-what-are-packages-and-plugins-in-flutter) 43 | 44 | [21. How to define a generic extension in Dart?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 45 | 46 | [22. How do you create a factory?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 47 | 48 | [23. List the responsibilities of FlutterActivity?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 49 | 50 | [24. What is Build context?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 51 | 52 | [25. How will you declare async function as a variable in Dart?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 53 | 54 | [26. Why do we need Mixins?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 55 | 56 | [27. Explain Ticker in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 57 | 58 | [28. Explain Stream in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 59 | 60 | [29. Explain Null aware pointers?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 61 | 62 | [30. How can you run code in debug mode only?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 63 | 64 | [31. What is Provider?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 65 | 66 | [32. What are the limitations of Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 67 | 68 | [33. Explain state management.](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 69 | 70 | [34. What are the similarities and differences between Future and Stream?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 71 | 72 | [35. What is tree shaking in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 73 | 74 | [36. Differentiate setState and Provider?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 75 | 76 | [37. Which one is best between React Native and Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 77 | 78 | [38. Explain Tween Animation?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 79 | 80 | [39. Explain the Stateful Widget Lifecycle?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 81 | 82 | [40. What is a Spacer widget?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 83 | 84 | [41. What is a Navigator and what are Routes in Flutter?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 85 | 86 | [42. What are GlobalKeys?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 87 | 88 | [43.What is an AspectRatio widget used for?](https://github.com/Google-Developers-Sohag/Flutter/blob/main/about_flutter.md#6-is-dart-language-necessary-for-flutter) 89 | 90 |
91 | 92 |

1. What is Flutter?

93 | 94 | Flutter is a UI-based tool for creating mobile applications. You can use Flutter to create natively compiled mobile applications with a single programming language and a single codebase. Fast and beautiful mobile applications can be developed with the right skill sets to code in Flutter. Google developed the framework, and the code is open source. Flutter in itself is not a language, and it makes use of Dart language for coding. 95 | 96 | Flutter can be used to code for both IOS and Android. The optimization is best suited for 2D mobile apps. The following features can be used to make the apps:- 97 | 98 | * Geolocation 99 | * Storage access 100 | * Camera access 101 | * Network 102 | * Third-Party SDKs 103 | 104 |

2. What are the advantages of using Flutter?

105 | 106 | Flutter has various advantages to coding mobile apps:- 107 | 108 | 1. Reduce the amount of code- Hot reload feature provided by Flutter helps in faster performance. The app is coded in C/C++ code to make it as close to machine code as possible for faster app development. The widget availability in Flutter reduces the time spent on coding and uses reusable code. 109 | 2. Cross-Platform development- Flutter code can be used across platforms to reduce the effort on the development team's side. 110 | 3. Live and Hot Reloading- It helps write the code faster and more easily. The code can be easily modified when a change is made. 111 | 4. Works like a Native app- Flutter code is as close to machine code as possible. This reduces the errors due to the interpretation of code. The app works in a native environment, and the coded apps are fast and easy to use. 112 | 5. Community- Flutter has a thriving community to help you with the questions you might have. 113 | 6. Minimal Code- The Flutter app is coded using the Dart programming language. This increases the speed of development, and the UI is fast. Dart uses JIT and AOT compilation which is very fast. 114 | 7. Faster documentation- It has fast and well-organized documentation. The central depository stores the documents for future reference. 115 | 8. Customized designs- The customized layered architecture allows the designing of custom designs, faster rendering and expressive UIs. 116 | 117 |

3. What is the Flutter architecture?

118 | 119 | Flutter has a three-layered architecture:- 120 | 121 | 1. Upper Layer: The upper layer consists of the Dart programming language along with the widgets, animations, illustrations, customizations, etc. 122 | 2. The middle layer or the Flutter Engine: This layer deals with text display, formatting, layout, etc. 123 | 3. Bottom Layer or the built-in service: This layer is for managing plugins or packages. 124 | 125 |

4. What build modes are available in Flutter?

126 | 127 | Flutter is made up of three build modes: - 128 | 129 | 1. Debug Mode- This mode is for debugging apps on a device or a simulator. 130 | 2. Profile Mode- Some debugging abilities are available, along with an analysis of app's performance in testing rounds. 131 | 3. Release Mode- This mode is used when deploying the app. This mode is for faster performance. You cannot debug or edit the code in this mode. 132 | 133 |

5. What is the Dart programming language?

134 | 135 | Dart is an object-oriented programming language with a syntax like the C Language. The language is open source and was developed by Google in 2011. The language was conceptualized to code the mobile app frontend. The app is used for coding frontend user interfaces. Flutter apps make use of the Dart programming language. 136 | 137 |

6. Is Dart language necessary for Flutter?

138 | 139 | It is compulsory to know the Dart language to use Flutter. Flutter applications make use of the Dart language for coding mobile phone apps. 140 | 141 |

7. What are widgets in Flutter?

142 | 143 | Flutter apps make use of widgets to code mobile phone applications. You will almost exclusively build on Flutter using widgets. Widgets define the view of the app. When you change the code, the widget code is automatically adjusted. Widgets are nested with each other to get the final design of the app. This means the widget is the base on which the app is coded. 144 | 145 |

8. What are the most useful editors for Flutter apps?

146 | 147 | Flutter tools make use of plugins to code mobile phone apps. The plugins can help in Dart code compilation, analysis of the code, and development of apps. Some used Flutter tools for IDE development are 148 | 149 | * Visual Studio 150 | * Android Studio 151 | * Xcode 152 | * IntelliJ IDEA 153 | * Eclipse 154 | * Emacs 155 | 156 |

9. What are packages and plugins in Flutter?

157 | 158 | Similar types of classes, interfaces, and sub-packages are known as packages in Flutter or any other object-oriented language. The packages and plugins are used in development to reduce the coder's effort. The coder need not write the code for everything and can use packages and plugins to reduce the coding effort. 159 | 160 | The distinction between packages and plugins is minute. Packages are new components or written code in Dart language. Plugins, on the other hand, use native code to allow more functionality. Sometimes the two terms are confused as the same, but a minute distinction exists. 161 | 162 |

10. Are there any popular apps which make use of Flutter?

163 | 164 | There are many popular apps which use Flutter. Some of the apps are:- 165 | 166 | * Reflectly 167 | * Google Ads 168 | * Alibaba 169 | * Tencent 170 | * Birch Finance 171 | 172 | And many more. The use of Flutter in mobile applications is very high. 173 | 174 |

11. In What technology is Flutter built?

175 | 176 | Flutter is built using C, C++, Skia - 2D rendering engine, and Dart-object-oriented language. 177 | 21. Difference between runApp() and main() in flutter. 178 | 179 | __main()__ 180 | 181 | It is a function used to start the program. 182 | In Flutter, it is impossible to write any program without the main() function. 183 | 184 | __runApp()__ 185 | 186 | It is used to return the widgets that are connected to the screen as the root of the widget tree to be rendered on the screen. 187 | This function is called the main function and is also the driver of the app. 188 | 189 |

12.What is the App state?

190 | 191 | App State is a shared state or application state. App states can be shared across sections of your app and maintain user sessions in the same way. App state includes activities such as login info, user preferences, E-commerce shopping cart, social networking notifications, etc. 192 | 193 |

13. What do you mean by keys in flutter? and its uses

194 | 195 | 196 | * In Flutter, We use Keys as the identifier for Elements, SemanticNodes, and Widgets. We will utilize it when any new widget tries to update the available element; later, its key must be similar to the current widget key related to the element. 197 | * Keys must not be distinct amongst elements in the same parent. 198 | * The subclasses of the Key should be a LocalKey or GlobalKey. 199 | * Keys are helpful when we manipulate(like reordering, adding, or removing) a group of widgets of a similar type that hold a similar state. 200 | 201 | 202 |
__Uses__: 203 | 204 | * Keys in flutter are used primarily to preserve the state of modified widgets in the widget trees. 205 | * It is used to reorganize and modify the collections of widgets having equivalent types and defined states. 206 | * It does not modify a tree that consists of only stateless widgets. 207 | 208 |

14. What is Flutter Inspector?

209 | 210 | The Flutter Inspector is a powerful tool used to visualize the blueprint of your widgets and their properties in Flutter. 211 | * Flutter Inspector can select widget mode in a widget tree. 212 | * It provides the toggle platform. 213 | * It shows paint baselines and debugs paint. 214 | * It can refresh the widgets as well as show or hide the performance overlay. 215 | 216 |

15. Different types of streams in Dart

217 | 218 | There are two types of streams in Dart, single subscription streams and broadcast streams. 219 | 220 | __Single Subscription Streams__ 221 | 222 | * The events within a larger whole are delivered sequentially with single subscription streams. 223 | * They are used for events that are in received matters or for reading a file. 224 | * There is only one listener throughout the sequence to trigger the event, else the event won’t be triggered. 225 | 226 | __Broadcast Streams__ 227 | 228 | * Initially, the event needs to be subscribed to by the listener, then only these streams deliver events to their subscribers and subscribers can immediately start listening to events. 229 | * There are several listeners to events simultaneously. Besides, one can also listen to the event again even after canceling a previous subscription. 230 | 231 |

16. What is the difference between SizedBox and Container?

232 | 233 | __SizedBox__ 234 | 235 | * The SizedBox widget in Flutter has a specified size. 236 | * In SizedBox, we cannot set the color or decoration for the widget. 237 | * We can only use it with a child widget having a specific width or height. 238 | 239 | __Container__ 240 | 241 | * The Container in Flutter is a parent widget containing multiple child widgets to manage them efficiently in width, height, padding, background color, etc. 242 | * If we have a widget that needs some background styling may be a color, shape, or size constraint that can be wrapped in a container widget. 243 | 244 |

17. What is Fat Arrow Notation in Dart and when do you use it?

245 | The fat arrow syntax is simply a short hand for returning an expression and is similar to `(){ return expression; }.` 246 | 247 | The fat arrow is for returning a single line, braces are for returning a code block. 248 | 249 | Only an expression—not a statement—can appear between the arrow (`=>`) and the semicolon (`;`). For example, you can’t put an __if__ statement there, but you can use a __conditional__ expression 250 | ```dart 251 | // Normal function 252 | void function1(int a) { 253 | if (a == 3) { 254 | print('arg was 3'); 255 | } else { 256 | print('arg was not 3'); 257 | } 258 | } 259 | 260 | // Arrow Function 261 | void function2(int a) => print('arg was ${a == 3 ? '' : 'not '}3'); 262 | ``` 263 | 264 |

18. How many types of widgets are there in Flutter?

265 | 266 | *There are two types of widgets:* 267 | 1. __StatelessWidget__: A stateless widget can not change their state during the runtime of an app which means it can not redraw its self while the app is running. Stateless widgets are immutable. 268 | 2. __StatefulWidget__: A stateful widget can redraw itself multiple times, while the app is running which means its state is mutable. For example, when a button is pressed, the state of the widget is changed. 269 | 270 |

19. When should you use WidgetsBindingObserver?

271 | 272 | WidgetsBindingObserver should be used when we want to listen to the *AppLifecycleState* and call stop/start on our services. 273 | 274 |

20. What is Dart and why does Flutter use it?

275 | 276 | __Dart__ is an __object-oriented, garbage-collected__ programming language that you use to develop Flutter apps. It was also created by Google, but is open-source, and has community inside and outside Google. Dart was chosen as the language of Flutter for the following reason: 277 | 278 | * Dart is __AOT__ (Ahead Of Time) compiled to fast, predictable, native code, which allows almost all of Flutter to be written in Dart. This not only makes Flutter fast, virtually everything (including all the widgets) can be customized. 279 | * Dart can also be __JIT__ (Just In Time) compiled for exceptionally fast development cycles and game-changing workflow (including Flutter’s popular sub-second stateful hot reload). 280 | * Dart allows Flutter to avoid the need for a separate declarative layout language like __JSX__ or __XML__, or separate visual interface builders, because Dart’s declarative, programmatic layout is easy to read and visualize. And with all the layout in one language and in one place, it is easy for Flutter to provide advanced tooling that makes layout a snap. 281 | 282 |

21. How to define a generic extension in Dart?

283 | 284 | This could be done by adding a template parameter, like the below, 285 | ```dart 286 | extension MyFancyList on List { 287 | 288 | int get doubleLength => length * 2; 289 | 290 | List operator -() => reversed.toList(); 291 | 292 | List> split(int at) => >[sublist(0, at), sublist(at)]; 293 | 294 | } 295 | ``` 296 |

22. How do you create a factory?

297 | 298 | Factory constructors are developed by using the factory keyword. They can return subtypes or even null. 299 | 300 | e.g., `factory User.fromXml(String xml).` 301 | 302 |

23. List the responsibilities of FlutterActivity?

303 | 304 | FlutterActivity is an Android app that shows a Flutter experience. The different roles of a FlutterActivity are as follows: 305 | 306 | * The Flutter flash screen and the Android launch screen are shown. 307 | * It alters the appearance of the status bar. 308 | * It chooses Flutter’s first direction. 309 | * It chooses an entry point and the execution path for the Dart app bundle. 310 | * Transparency may be added to the Activity if needed. 311 | 312 |

24. What is Build context?

313 | 314 | In Flutter, the BuildContext is a component of the widgets in the Element tree, with each widget having its BuildContext. It’s primarily used to get a connection to another widget or theme. If we want to use a material design feature, we must relate it to the scaffold, for example. Scaffold.of(context) method may be used to obtain it. 315 | 316 |

25. How will you declare async function as a variable in Dart?

317 | 318 | Async functions are normal functions having variable type just specifies that it returns a Future: 319 | ```dart 320 | class Example { 321 | 322 | Future Function() asyncFuncVar; 323 | 324 | Future asyncFunc() async => print(‘Do async stuff…’); 325 | 326 | Example() { 327 | 328 | asyncFuncVar = asyncFunc; 329 | 330 | asyncFuncVar().then((_) => print(‘Hello’)); 331 | 332 | } 333 | 334 | } 335 | 336 | void main() => Example(); 337 | ``` 338 | 339 |

26. Why do we need Mixins?

340 | 341 | Multiple inheritances are not supported in Dart. Mixins are important to formulate multiple inheritances in Flutter/Dart. Mixins allow you to write the code for a reusable class in multiple class hierarchies. 342 | 343 |

27. Explain Ticker in Flutter?

344 | 345 | In Flutter, a ticker represents the rate at which our animation is refreshed. It’s a signal-sending class that sends a signal at a set frequency, such as 60 times per second. Our watch, which tics at regular intervals, helps us grasp it. Ticker offers a callback method for each tick that has the length since the first ticks at each second since it was started. Even if the tickers began at different times, they are immediately synchronized. 346 | 347 |

28. Explain Stream in Flutter?

348 | 349 | A stream is a set of asynchronous events that happen at the same time. It generates an asynchronous data series. It’s like putting any value on one end of a pipe, and if there’s a listener on the other end, it will receive that value. We can keep several listeners in a stream, and when they’re all placed into the pipeline, they’ll all get the same benefit. 350 | 351 | The Stream API’s await for and listen() methods can be used to process a stream. It has a mechanism for dealing with errors. Streams can be created in a variety of ways, but they can all be used in the same way. Consider the following condition: 352 | ```dart 353 | Future sumStream(Stream stream) async { 354 | 355 | var sum = 0; 356 | 357 | await for (var value in stream) { 358 | 359 | sum = sum + value; 360 | 361 | } 362 | 363 | return sum; 364 | 365 | } 366 | ``` 367 | 368 |

29. Explain Null aware pointers?

369 | 370 | Dart has some helpful tips for dealing with null values. 371 | 372 | 1. The “??=” assignment operator, which only assigns a value to a variable if it is null. 373 | ```dart 374 | int x; // Initial value of a is null. 375 | 376 | x??= 2; 377 | 378 | print(x); // It will print 2. 379 | ``` 380 | 381 | 2. The null-aware “??” operator evaluates and returns the value between two expressions. It checks expression 1 and returns its value if it is not null; otherwise, it evaluates and returns the value of expression 2: 382 | ```dart 383 | print(4 ?? 5); // It will print 4. 384 | 385 | print(null ?? 5); // It will print 5. 386 | ``` 387 | 388 |

30. How can you run code in debug mode only?

389 | 390 | To run the code in debug mode only, we must first import the dart foundation as shown below: 391 | 392 | `import ‘package:flutter/foundation.dart’ as Foundation;` 393 | 394 | Next, use the kReleaseMode as shown below: 395 | ```dart 396 | if (Foundation.kReleaseMode){ // is Release Mode ?? 397 | 398 | print(‘release mode’); 399 | 400 | } else { 401 | 402 | print(‘debug mode’); 403 | 404 | } 405 | ``` 406 | 407 |

31. What is Provider?

408 | 409 | A Provider allows to not only expose a value, but also create/listen/dispose it. When you place a Provider widget in your widget tree all the Childs of the Provider will have access to the values exposed by it. 410 | 411 |

32. What are the limitations of Flutter?

412 | 413 | * Lack of Third-Party Libraries and Widgets: Flutter is not too old unlike its contemporaries and lacks the presence of third-party libraries. 414 | * Issues with iOS: Flutter is developed by Google. This is why developers are worried about its implementation for iOS. 415 | * Large File Sizes: One big loophole that ois hard to ignore is the large file size of apps developed in Flutter. In some cases these file sizes could be a significant issue. 416 | 417 |

33. Explain state management.

418 | 419 | Managing state in an application is one of the most important and necessary process in the life cycle of an application. 420 | 421 | State management can be divided into two categories based on the duration the particular state lasts in an application: 422 | 423 | 1. Ephemeral − Last for a few seconds like the current state of an animation or a single page like current rating of a product. Flutter supports this through StatefulWidget. 424 | 2. app state − Lasts for entire application like logged in user details, cart information, etc., Flutter supports this through scoped_model. 425 | 426 |

34. What are the similarities and differences between Future and Stream?

427 | 428 | __Similarities__ 429 | 430 | 1. Stream and Future both work asynchronously. 431 | 2. Both have the same potential 432 | 433 | __Differences__ 434 | 435 | 1. A stream may be a mixture of Futures. 436 | 2. Future has only one response yet Stream can have any number of Responses. 437 | 438 |

35. What is tree shaking in Flutter?

439 | 440 | Tree Shaking is the optimization technique for removing the unutilized module in the bundle in the build process. It is also the code elimination technique used for optimizing our application. 441 | 442 | (for flutter web) When compiling a Flutter web application, the JavaScript bundle is generated by the dart2js compiler. A release build has the highest level of optimization, which includes tree shaking your code. Tree shaking is the process of eliminating dead code, by only including code that is guaranteed to be executed. This means that you do not need to worry about the size of your app’s included libraries because unused classes or functions are excluded from the compiled JavaScript bundle 443 | 444 |

36. Differentiate setState and Provider?

445 | 446 | __setState()__ 447 | 448 | We use it for managing the local state in a similar stateful widget and its child. The downside is everything is in the same class like UI code, business logic, and mixin UI, which splits clean code principles. 449 | 450 | __Provider__ 451 | 452 | In the provider pattern, we define everything in a separate class indicating that the UI presentation is defined in the different logics that specify in different thus code appears high quality and clean. Moreover, we don’t need to transmit the state from one screen to another through the constructor. 453 | 454 |

37. Which one is best between React Native and Flutter?

455 | 456 | Flutter and React Native both are utilized for developing the native hybrid app through a single codebase. These applications can be executed on Android and iOS platforms. 457 | 458 | 1. React Native was developed by Facebook, while Flutter Framework was developed by Google. Therefore, both frameworks have good features and communities. 459 | 2. Flutter utilizes Dart programming language for creating the applications and React Native utilizes Javascript for developing the applications. 460 | 3. From the Developer’s perspective, it is very complex to select them. Therefore, it is very hard to select the winner between React Native and Flutter. 461 | 462 |

38. Explain Tween Animation?

463 | 464 | Tween Animation is a short form of in-betweening. In Tween Animation, we must define the starting and endpoint of the automation. It indicates that the animation starts with the starting value, after that, it goes through a series of intermediary values, and lastly arrives at the end value. It also offers the curve and timeline that defines the speed and time of the variation. 465 | 466 |

39. Explain the Stateful Widget Lifecycle?

467 | 468 | The lifecycle has the following simplified steps: 469 | * createState() 470 | * [mounted == true](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#2-mounted-is-true) 471 | * [initState()](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#3-initstate) 472 | * [didChangeDependencies()](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#4-didChangeDependencies) 473 | * [build()](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#5-build) 474 | * [didUpdateWidget()](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#6-didupdatewidget) 475 | * [setState()](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#7-setstate) 476 | * [deactivate()](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#8-deactivate) 477 | * [dispose()](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#9-dispose) 478 | * [mounted == false](https://flutterbyexample.com/lesson/stateful-widget-lifecycle#10-mounted-is-false) 479 | 480 |

40. What is a Spacer widget?

481 | 482 | Spacer manages the empty space between the widgets with flex container. Evenly with the Row and Column MainAxis alignment we can manage the space as well 483 | 484 |

41. What is a Navigator and what are Routes in Flutter?

485 | 486 | Navigation and routing are some of the core concepts of all mobile application, which allows the user to move between different pages. We know that every mobile application contains several screens for displaying different types of information. For example, an app can have a screen that contains various products. When the user taps on that product, immediately it will display detailed information about that product 487 | 488 |

42. What are GlobalKeys?

489 | 490 | GlobalKeys have two uses: they allow widgets to change parents anywhere in your app without losing state, or they can be used to access information about another widget in a completely different part of the widget tree. An example of the first scenario might if you wanted to show the same widget on two different screens, but holding all the same state, you’d want to use a GlobalKey 491 | 492 |

43.What is an AspectRatio widget used for?

493 | 494 | AspectRatio Widget tries to find the best size to maintain aspect ration while respecting it’s layout constraints. The AspectRatio Widget can be used to adjust the aspect ratio of widgets in your app 495 | -------------------------------------------------------------------------------- /daily_quote/Readme.md: -------------------------------------------------------------------------------- 1 | hi 2 |

3 | 4 |

5 | -------------------------------------------------------------------------------- /daily_quote/lib/constants.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/cupertino.dart'; 2 | 3 | const String kLanguageCode = 'en'; 4 | const String kAppName = 'Quotes'; 5 | const Color kLightGrey = Color(0xFFFEFEFF); 6 | const String kTimesFamily = 'Times'; 7 | const Radius kBottomBarUpBorder = Radius.circular(50); 8 | const Radius kBottomBarBottomBorder = Radius.zero; 9 | 10 | const BorderRadius kBottomBarBorder = BorderRadius.only( 11 | topLeft: kBottomBarUpBorder, 12 | bottomLeft: kBottomBarBottomBorder, 13 | bottomRight: kBottomBarBottomBorder, 14 | topRight: kBottomBarUpBorder, 15 | ); 16 | 17 | const NotchedShape kRoundedBottomBar = AutomaticNotchedShape( 18 | RoundedRectangleBorder(borderRadius: kBottomBarBorder), 19 | StadiumBorder(), 20 | ); 21 | 22 | const NotchedShape kRoundedBottomFAB = CircularNotchedRectangle(); 23 | 24 | // TODO: add the Constants of Quotes API. 25 | const String url = 'https://quotes15.p.rapidapi.com/quotes/random/'; 26 | 27 | const Map headers = { 28 | 'X-RapidAPI-Host': 'quotes15.p.rapidapi.com', 29 | 'X-RapidAPI-Key': '341df03672msh37dd75eaa3cc2a7p1fea4cjsn4689f810105b' 30 | }; 31 | -------------------------------------------------------------------------------- /daily_quote/lib/helpers/trans_status.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:flutter/services.dart'; 3 | 4 | void transStatus(){ 5 | SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle(statusBarColor: Colors.transparent)); 6 | } -------------------------------------------------------------------------------- /daily_quote/lib/main.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | import 'constants.dart'; 4 | import 'helpers/trans_status.dart'; 5 | import 'screens/home.dart'; 6 | 7 | void main() { 8 | transStatus(); 9 | runApp(const MyApp()); 10 | } 11 | 12 | class MyApp extends StatelessWidget { 13 | const MyApp({Key? key}) : super(key: key); 14 | 15 | // This widget is the root of your application. 16 | @override 17 | Widget build(BuildContext context) { 18 | return MaterialApp( 19 | debugShowCheckedModeBanner: false, 20 | title: kAppName, 21 | theme: ThemeData( 22 | primarySwatch: Colors.green, 23 | ), 24 | home: const MyHome(), 25 | ); 26 | } 27 | } -------------------------------------------------------------------------------- /daily_quote/lib/module/quote.dart: -------------------------------------------------------------------------------- 1 | /** To parse this JSON data, do 2 | * ! final quotes = quotesFromJson(jsonString); 3 | **/ 4 | 5 | import 'dart:convert'; 6 | 7 | Quotes quotesFromJson(String str) => Quotes.fromJson(json.decode(str)); 8 | 9 | String quotesToJson(Quotes data) => json.encode(data.toJson()); 10 | 11 | class Quotes { 12 | Quotes({ 13 | this.id, 14 | this.languageCode, 15 | this.content = 'This is a quote', 16 | this.url, 17 | required this.originator, 18 | this.tags, 19 | }); 20 | 21 | int? id; 22 | String? languageCode; 23 | String content; 24 | String? url; 25 | Originator originator; 26 | List? tags; 27 | 28 | factory Quotes.fromJson(Map json) => Quotes( 29 | id: json["id"], 30 | languageCode: json["language_code"], 31 | content: json["content"], 32 | url: json["url"], 33 | originator: Originator.fromJson(json["originator"]), 34 | tags: List.from(json["tags"].map((x) => x)), 35 | ); 36 | 37 | Map toJson() => { 38 | "id": id, 39 | "language_code": languageCode, 40 | "content": content, 41 | "url": url, 42 | "originator": originator.toJson(), 43 | "tags": List.from(tags!.map((x) => x)), 44 | }; 45 | } 46 | 47 | class Originator { 48 | Originator({ 49 | this.id, 50 | this.name = 'Developer', 51 | this.url, 52 | }); 53 | 54 | int? id; 55 | String name; 56 | String? url; 57 | 58 | factory Originator.fromJson(Map json) => Originator( 59 | id: json["id"], 60 | name: json["name"], 61 | url: json["url"], 62 | ); 63 | 64 | Map toJson() => { 65 | "id": id, 66 | "name": name, 67 | "url": url, 68 | }; 69 | } 70 | // TODO: add all constructors in the UI 71 | -------------------------------------------------------------------------------- /daily_quote/lib/screens/home.dart: -------------------------------------------------------------------------------- 1 | import 'package:daily_quotes/module/quote.dart'; 2 | import 'package:daily_quotes/service/https.dart'; 3 | import 'package:daily_quotes/widgets/bottom_app_bar.dart'; 4 | import 'package:flutter/material.dart'; 5 | 6 | import '../constants.dart'; 7 | 8 | class MyHome extends StatefulWidget { 9 | const MyHome({Key? key}) : super(key: key); 10 | 11 | @override 12 | _MyHomeState createState() => _MyHomeState(); 13 | } 14 | 15 | class _MyHomeState extends State { 16 | String doubleQuotes = '"'; 17 | Quotes quote = Quotes(originator: Originator()); 18 | 19 | Future get getData async => quote = quotesFromJson(await fetchData); 20 | 21 | @override 22 | Widget build(BuildContext context) { 23 | return Scaffold( 24 | backgroundColor: kLightGrey, 25 | appBar: AppBar( 26 | title: Center( 27 | child: Text( 28 | kAppName, 29 | style: TextStyle( 30 | color: Colors.green[700], 31 | fontSize: 28, 32 | ), 33 | )), 34 | backgroundColor: kLightGrey, 35 | elevation: 0, 36 | ), 37 | body: Center( 38 | child: Column( 39 | mainAxisAlignment: MainAxisAlignment.center, 40 | crossAxisAlignment: CrossAxisAlignment.center, 41 | children: [ 42 | Padding( 43 | padding: 44 | const EdgeInsets.symmetric(vertical: 8.0, horizontal: 32), 45 | child: Text( 46 | '$doubleQuotes ${quote.content} $doubleQuotes', 47 | maxLines: null, 48 | softWrap: true, 49 | textAlign: TextAlign.center, 50 | style: const TextStyle(fontSize: 24, fontFamily: kTimesFamily), 51 | ), 52 | ), 53 | const SizedBox( 54 | height: 12, 55 | ), 56 | RichText( 57 | text: TextSpan(children: [ 58 | const TextSpan( 59 | text: 'written by ', style: TextStyle(color: Colors.grey)), 60 | TextSpan( 61 | text: quote.originator.name, 62 | style: const TextStyle( 63 | color: Colors.black, 64 | fontFamily: kTimesFamily, 65 | fontWeight: FontWeight.w700, 66 | fontStyle: FontStyle.italic, 67 | )), 68 | ]), 69 | ), 70 | ], 71 | ), 72 | ), 73 | floatingActionButton: SizedBox( 74 | height: 98, 75 | width: 98, 76 | // To match the icon size with the parent 77 | child: FittedBox( 78 | child: FloatingActionButton( 79 | onPressed: () => 80 | setState(() { 81 | print('clicked'); 82 | getData; 83 | // write a new quote object 84 | // fetch respond body 85 | // translate json to quote object 86 | }), 87 | child: const Icon(Icons.format_quote), 88 | backgroundColor: Colors.green[700], 89 | ), 90 | ), 91 | ), 92 | floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked, 93 | extendBody: true, 94 | bottomNavigationBar: demoBottomAppBar(context), 95 | ); 96 | } 97 | } 98 | 99 | 100 | -------------------------------------------------------------------------------- /daily_quote/lib/service/https.dart: -------------------------------------------------------------------------------- 1 | import 'package:daily_quotes/constants.dart'; 2 | import 'package:http/http.dart' as http; 3 | 4 | Future get fetchData async{ 5 | var request = http.Request('GET', Uri.parse(url)); 6 | 7 | request.headers.addAll(headers); 8 | 9 | http.StreamedResponse streamedResponse = await request.send(); 10 | var response = await http.Response.fromStream(streamedResponse); 11 | 12 | return response.body; 13 | 14 | } -------------------------------------------------------------------------------- /daily_quote/lib/widgets/alert_message.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | Future alertMessage({required BuildContext context,required String title}) { 4 | return showDialog( 5 | context: context, 6 | builder: (ctx) => AlertDialog( 7 | title: Text(title), 8 | content: const Text('you can add the described feature in the title by yourself'), 9 | actions: [ 10 | TextButton( 11 | onPressed: () { 12 | Navigator.of(ctx).pop(); 13 | }, 14 | child: const Text("okay"), 15 | ), 16 | ], 17 | ), 18 | ); 19 | } 20 | -------------------------------------------------------------------------------- /daily_quote/lib/widgets/bottom_app_bar.dart: -------------------------------------------------------------------------------- 1 | import 'package:daily_quotes/constants.dart'; 2 | import 'package:flutter/material.dart'; 3 | 4 | import 'alert_message.dart'; 5 | 6 | BottomAppBar demoBottomAppBar(BuildContext context) { 7 | return BottomAppBar( 8 | color: Colors.black, 9 | notchMargin: 12.0, 10 | // to scale the FAB 11 | child: SizedBox( 12 | height: 78, 13 | child: Row( 14 | mainAxisAlignment: MainAxisAlignment.spaceAround, 15 | children: [ 16 | IconButton( 17 | tooltip: 'Open navigation menu', 18 | icon: const Icon(Icons.menu, color: Colors.white), 19 | onPressed: () { 20 | print('HI'); 21 | alertMessage( 22 | context: context, 23 | title: 'Add new Page with saved Favourite quotes'); 24 | },), 25 | const SizedBox(height: 8), 26 | IconButton( 27 | tooltip: 'Favorite', 28 | icon: const Icon( 29 | Icons.favorite, 30 | color: Colors.white, 31 | ), 32 | onPressed: () => alertMessage( 33 | context: context, title: 'Make the Quote Favorite')), 34 | ], 35 | ), 36 | ), 37 | shape: kRoundedBottomBar 38 | ); 39 | } 40 | -------------------------------------------------------------------------------- /daily_quote/pubspec.yaml: -------------------------------------------------------------------------------- 1 | name: daily_quotes 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.15.0 <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 | http: any 38 | 39 | dev_dependencies: 40 | flutter_test: 41 | sdk: flutter 42 | 43 | # The "flutter_lints" package below contains a set of recommended lints to 44 | # encourage good coding practices. The lint set provided by the package is 45 | # activated in the `analysis_options.yaml` file located at the root of your 46 | # package. See that file for information about deactivating specific lint 47 | # rules and activating additional ones. 48 | flutter_lints: ^1.0.0 49 | 50 | # For information on the generic Dart part of this file, see the 51 | # following page: https://dart.dev/tools/pub/pubspec 52 | 53 | # The following section is specific to Flutter. 54 | flutter: 55 | 56 | # The following line ensures that the Material Icons font is 57 | # included with your application, so that you can use the icons in 58 | # the material Icons class. 59 | uses-material-design: true 60 | 61 | # To add assets to your application, add an assets section, like this: 62 | # assets: 63 | # - images/a_dot_burr.jpeg 64 | # - images/a_dot_ham.jpeg 65 | 66 | # An image asset can refer to one or more resolution-specific "variants", see 67 | # https://flutter.dev/assets-and-images/#resolution-aware. 68 | 69 | # For details regarding adding assets from package dependencies, see 70 | # https://flutter.dev/assets-and-images/#from-packages 71 | 72 | # To add custom fonts to your application, add a fonts section here, 73 | # in this "flutter" section. Each entry in this list should have a 74 | # "family" key with the font family name, and a "fonts" key with a 75 | # list giving the asset and other descriptors for the font. For 76 | # example: 77 | # fonts: 78 | # - family: Schyler 79 | # fonts: 80 | # - asset: fonts/Schyler-Regular.ttf 81 | # - asset: fonts/Schyler-Italic.ttf 82 | # style: italic 83 | # - family: Trajan Pro 84 | # fonts: 85 | # - asset: fonts/TrajanPro.ttf 86 | # - asset: fonts/TrajanPro_Bold.ttf 87 | # weight: 700 88 | # 89 | # For details regarding fonts from package dependencies, 90 | # see https://flutter.dev/custom-fonts/#from-packages 91 | -------------------------------------------------------------------------------- /dart_1_tasks.md: -------------------------------------------------------------------------------- 1 | Hello we have multible stages of tasks here 2 | 3 | ### Easy Tasks 4 | 5 | 1- make a Map with String keys and dynamic values in each one the key will be the Data type Name that we take in course and the value will be the example of this data type. 6 | 7 | ex:- `{"double" : 3.147}` 8 | 9 | 2- make a list of Maps which have student name as key and grade as value 10 | 11 | 3- compare by 1 and '1' in if else statement 12 | 13 | 4- do the example of dynamic and object data types that tells the difference between them 14 | 15 | 5- print from 1 to 100 by for loop once and while loop in another, _note: 100 is included_ 16 |
17 | 18 | ### Medium Task 19 | 20 | 1- add a Subtract functional button _so called horizontal_rule_ in this Flutter code 21 | [task(1).txt](https://github.com/Google-Developers-Sohag/Flutter-Tasks/files/8037828/task.1.txt) 22 | 23 | to get the result like that : 24 | 25 | https://user-images.githubusercontent.com/50797015/153331865-609b04c7-bc39-43c0-88e3-0d31c8d4739d.mp4 26 | 27 |
28 | 29 | ### Hard Task 30 | 1- Make three functions 1-inputHandler 2-SummationOfNums 3-mapOfSummations at least, of course you can make more. 31 | 32 | the target is that SummationOfNums will get integer ex:`5` and sum all numbers from 1 to 5, the answer should be 15 33 | 34 | inputHandler will take endless list of input like that 35 | 36 | ![image](https://user-images.githubusercontent.com/50797015/153332909-9b65fe0d-8d9b-459b-beaa-ec9fc4f6f40b.png) 37 | 38 | _here "anything .." sentence is my input and 'end of list' is just printed string to interact with user_ 39 | 40 | ___Note: only the user who can dedict the size of the list___ 41 | 42 | lastly the mapOfSummation will make the input integer as the String key of map and the value is the result of summation 43 | 44 |
45 | Done. 46 | 47 |
48 | 49 | My take for Hard Task 50 | ```dart 51 | import 'dart:io'; 52 | 53 | void main() { 54 | print(mapOfSummition()); 55 | } 56 | 57 | List inputHandler() { 58 | bool notDone = true; 59 | List ranges = []; 60 | while (notDone) { 61 | String? input = stdin.readLineSync(); 62 | try { 63 | int range = int.parse(input!); 64 | ranges.add(range); 65 | } catch (e) { 66 | notDone = false; 67 | print("end of list"); 68 | } 69 | } 70 | return ranges; 71 | } 72 | 73 | int summationOfNums(int range) { 74 | int commulative = 0; 75 | for (int i = 0; i <= range; i++) { 76 | commulative += i; 77 | } 78 | return commulative; 79 | } 80 | 81 | Map mapOfSummition() { 82 | Map results = {}; 83 | List ranges = inputHandler(); 84 | int l = ranges.length; 85 | for (int i = 0; i < l; i++) { 86 | results["Sum of ${ranges[i]}"] = summationOfNums(ranges[i]); 87 | } 88 | return results; 89 | } 90 | ``` 91 | -------------------------------------------------------------------------------- /dart_2_Classes_material.md: -------------------------------------------------------------------------------- 1 | **Dart is an object-oriented programming language, so it supports the concept of class, object … etc. In Dart, we can define classes and objects of our own. We use the class keyword to do so. 2 | Declaring class in Dart** 3 | 4 | Syntax: 5 | 6 | ```dart 7 | class class_name { 8 | 9 | // Body of class 10 | } 11 | ``` 12 | In the above syntax: 13 | 14 | Class is the keyword use to initialize the class. 15 | class_name is the name of the class. 16 | Body of class consists of fields, constructors, getter and setter methods, etc. 17 | 18 | ### Declaring objects in Dart – 19 | 20 | Objects are the instance of the class and they are declared by using new keyword followed by the class name. 21 | 22 | Syntax: 23 | 24 | `var object_name = new class_name([ arguments ]);` 25 | 26 | In the above syntax: 27 | 28 | new is the keyword use to declare the instance of the class 29 | object_name is the name of the object and its naming is similar to the variable name in dart. 30 | class_name is the name of the class whose instance variable is been created. 31 | arguments are the input which are needed to be pass if we are willing to call a constructor. 32 | 33 | After the object is created, there will be the need to access the fields which we will create. We use the dot(.) operator for that purpose. 34 | 35 | Syntax: 36 | ```dart 37 | // For accessing the property 38 | object_name.property_name; 39 | 40 | // For accessing the method 41 | object_name.method_name(); 42 | ``` 43 |
44 | 45 | ## Dart Constructors 46 | 47 | A constructor is a special function of the class that is responsible for initializing the variables of the class. Dart defines a constructor with the same name as that of the class. A constructor is a function and hence can be parameterized. However, unlike a function, constructors cannot have a return type. If you don’t declare a constructor, a default no-argument constructor is provided for you. 48 | Syntax 49 | ```dart 50 | Class_name(parameter_list) { 51 | //constructor body 52 | } 53 | ``` 54 | **_Example_** 55 | 56 | The following example shows how to use constructors in Dart 57 | ```dart 58 | void main() { 59 | Car c = new Car('BMW'); 60 | } 61 | class Car { 62 | Car(String engine) { 63 | print(engine); 64 | } 65 | } 66 | ``` 67 | It should produce the following output − 68 | 69 | `BMW` 70 | 71 | ### Named Constructors 72 | 73 | Dart provides named constructors to enable a class define multiple constructors. The syntax of named constructors is as given below − 74 | Syntax : Defining the constructor 75 | 76 | `Class_name.constructor_name(param_list)` 77 | 78 | **_Example_** 79 | 80 | The following example shows how you can use named constructors in Dart − 81 | ```dart 82 | void main() { 83 | Car c1 = new Car.namedConst('E1001'); 84 | Car c2 = new Car(); 85 | } 86 | class Car { 87 | Car() { 88 | print("Non-parameterized constructor invoked"); 89 | } 90 | Car.namedConst(String engine) { 91 | print("The engine is : ${engine}"); 92 | } 93 | } 94 | ``` 95 | It should produce the following output − 96 | 97 | The engine is : E1001 98 | Non-parameterized constructor invoked 99 | 100 | OR and the most preferable way: 101 | ```dart 102 | void main() { 103 | Car c1 = new Car(typeName: "Tesla"); 104 | c1.display(); 105 | } 106 | class Car { 107 | final String typeName; 108 | Car({required String this.typeName}); 109 | 110 | void display(){ 111 | print("$typeName"); 112 | } 113 | } 114 | ``` 115 | **OutPut** : `Tesla` 116 | 117 | 118 | ### The this Keyword 119 | 120 | The this keyword refers to the current instance of the class. Here, the parameter name and the name of the class’s field are the same. Hence to avoid ambiguity, the class’s field is prefixed with the this keyword. The following example explains the same − 121 | Example 122 | 123 | The following example explains how to use the this keyword in Dart − 124 | ```dart 125 | void main() { 126 | Car c1 = new Car('E1001'); 127 | } 128 | class Car { 129 | String engine; 130 | Car(String engine) { 131 | this.engine = engine; 132 | print("The engine is : ${engine}"); 133 | } 134 | } 135 | ``` 136 |
137 | 138 | ## Const And Final Keyword 139 | 140 | Dart supports the assignment of constant value to a variable. These are done by the use of the following keyword: 141 | 142 | * const keyword 143 | * final keyword 144 | 145 | These keywords are used to keep the value of a variable static throughout the code base, meaning once the variable is defined its state cannot be altered. There are no limitations if these keywords have a defined data type or not. 146 | Final Keyword In Dart 147 | 148 | The final keyword is used to hardcode the values of the variable and it cannot be altered in future, neither any kind of operations performed on these variables can alter its value (state). 149 | ``` 150 | // Without datatype 151 | final variable_name; 152 | 153 | // With datatype 154 | final data_type variable_name; 155 | ``` 156 | Example: Using the final keywords in a Dart program. 157 | ```dart 158 | void main() { 159 | 160 | // Assigning value to gdsc 161 | // variable without datatype 162 | final gdsc = "Google DSC"; 163 | 164 | // Printing variable gdsc 165 | print(gdsc); 166 | 167 | // Assigning value to gdsc2 168 | // variable with datatype 169 | final String gdsc2 = "Google DSC Again!!"; 170 | 171 | // Printing variable geek2 172 | print(gdsc2); 173 | } 174 | ``` 175 | **Output:** 176 | ` 177 | Google DSC 178 | Google DSC Again!! 179 | ` 180 | If we try to reassign the same variable then it will display error. 181 | 182 | 183 | ### Const Keyword in Dart 184 | 185 | The Const keyword in Dart behaves exactly like the final keyword. The only difference between final and const is that the const makes the variable constant from compile-time only. Using const on an object, makes the object’s entire deep state strictly fixed at compile-time and that the object with this state will be considered frozen and completely immutable. 186 | 187 | Example: Using const keywords in a Dart program. 188 | ```dart 189 | void main() { 190 | 191 | // Assigning value to gdsc 192 | // variable without datatype 193 | const gdsc = "Google DSC"; 194 | 195 | // Printing variable gdsc 196 | print(gdsc); 197 | 198 | // Assigning value to gdsc2 199 | // variable with datatype 200 | const String gdsc2 = "Google DSC Again!!"; 201 | 202 | // Printing variable gdsc2 203 | print(gdsc2); 204 | } 205 | 206 | ``` 207 | **Output:** 208 | ` 209 | Google DSC 210 | Google DSC Again!! 211 | ` 212 | 213 | 214 | Example: Assigning value without const keyword and then by const keyword. 215 | 216 | ### Without Const Keyword 217 | ```dart 218 | // Declaring a function 219 | gfg() => [1, 2]; 220 | 221 | // Main function 222 | void main() { 223 | // Assigning value 224 | // through function 225 | var geek1 = gfg(); 226 | var geek2 = gfg(); 227 | 228 | // Printing result 229 | // false 230 | print(geek1 == geek2); 231 | print(geek1); 232 | print(geek2); 233 | } 234 | ``` 235 | **Output :** 236 | ` 237 | false 238 | [1, 2] 239 | [1, 2] 240 | ` 241 | 242 | 243 | With Const Keyword: 244 | ```dart 245 | // Declaring a function 246 | gfg() => const[1, 2]; 247 | 248 | // Main function 249 | void main() { 250 | // Assigning value 251 | // through function 252 | var geek1 = gfg(); 253 | var geek2 = gfg(); 254 | 255 | // Printing result 256 | // true 257 | print(geek1 == geek2); 258 | print(geek1); 259 | print(geek2); 260 | } 261 | ``` 262 | **Output :** 263 | ` 264 | true 265 | [1, 2] 266 | [1, 2] 267 | ` 268 | ### Const Keyword Properties: 269 | 270 | * It is necessary to create them from the data available during the compile time. For instance: setting string “Google DSC” is fine but setting the current time is not. 271 | * They are deeply and transitively immutable. 272 | * They are canonicalised. 273 | -------------------------------------------------------------------------------- /dart_2_tasks.md: -------------------------------------------------------------------------------- 1 | ## Easy Tasks 2 | Make a function that return a random number from 1 to the range that has been entered as argument (parameter). 3 | 4 | 1- first time: use positional parameter 5 | 6 | 2- in another version: use named optional parameter 7 | 8 | 3- use optional parameter 9 | 10 |
11 | 12 | ## Medium Task 13 | Make ***Named*** constructors to this code for text and Icon 14 | ```dart 15 | class InfoRow extends StatelessWidget { 16 | 17 | const InfoRow({Key? key}) : super(key: key); 18 | @override 19 | Widget build(BuildContext context) { 20 | return Padding( 21 | padding: const EdgeInsets.all(24.0), 22 | child: Container( 23 | width: double.infinity, 24 | padding: const EdgeInsets.only(top: 15.0, bottom: 15.0), 25 | decoration: BoxDecoration( 26 | border: Border.all(width: 0.5), 27 | borderRadius: const BorderRadius.all(Radius.circular(15.0))), 28 | child: Row( 29 | children: [ 30 | Padding( 31 | child: Text( 32 | //change me as a constructor 33 | ' ', 34 | style: const TextStyle(fontSize: 18), 35 | ), 36 | padding: const EdgeInsets.only(left: 10.0), 37 | ), 38 | const Spacer(), 39 | Padding( 40 | child: SizedBox( 41 | child: Icon( 42 | //change me as a constructor 43 | Icons.notes, 44 | ), 45 | height: 25.0, 46 | ), 47 | padding: const EdgeInsets.only(right: 15.0), 48 | ) 49 | ], 50 | ), 51 | ), 52 | 53 | ); 54 | } 55 | } 56 | ``` 57 | so it could be used as this example 58 | 59 | 60 | 61 | 62 |
63 | to be as this when finished 64 | 65 | 66 | -------------------------------------------------------------------------------- /design_patterns/provider_example.dart: -------------------------------------------------------------------------------- 1 | // This class is what Provider will work with. 2 | // It will _provide_ an instance of the class to any widget 3 | // in the tree that cares about it. 4 | class Person { 5 | Person({this.name, this.age}); 6 | 7 | final String name; 8 | final int age; 9 | } 10 | 11 | // Here, we are running an app as you'd expect with any Flutter app 12 | // But, we're also wrapping `MyApp` in a widget called 'Provider' 13 | // Importantly, `Provider` is itself a widget, so it can live in the widget tree. 14 | // This class uses a property called `create` to make an instance of `Person` 15 | // whenever it's needed by a widget in the tree. 16 | // The object returned by the function passed to `create` is what the rest of our app 17 | // has access to. 18 | void main() { 19 | runApp( 20 | Provider( 21 | create: (_) => Person(name: "Yohan", age: 25), 22 | child: MyApp(), 23 | ), 24 | ); 25 | } 26 | 27 | 28 | // Just a plain ol' StatelessWidget 29 | class MyApp extends StatelessWidget { 30 | @override 31 | Widget build(BuildContext context) { 32 | return const MaterialApp( 33 | home: MyHomePage(), 34 | ); 35 | } 36 | } 37 | 38 | // Again, just a stateless widget 39 | class MyHomePage extends StatelessWidget { 40 | const MyHomePage({Key key}) : super(key: key); 41 | 42 | @override 43 | Widget build(BuildContext context) { 44 | return Scaffold( 45 | appBar: AppBar( 46 | title: const Text('Provider Class'), 47 | ), 48 | body: Center( 49 | child: Text( 50 | // this string is where we use Provider to fetch the instance 51 | // of `Person` created above in the `create` property 52 | ''' 53 | Hi ${Provider.of(context).name}! 54 | You are ${Provider.of(context).age} years old''', 55 | ), 56 | ), 57 | ); 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/Capture1.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/flutter_shopping_cart_provider_project/Capture1.PNG -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/Capture2.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/flutter_shopping_cart_provider_project/Capture2.PNG -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/Capture3.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/flutter_shopping_cart_provider_project/Capture3.PNG -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/Capture4.PNG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/flutter_shopping_cart_provider_project/Capture4.PNG -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/main.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:messenger/models/cart.dart'; 3 | import 'package:messenger/models/item.dart'; 4 | import 'package:messenger/screens/checkout_page.dart'; 5 | import 'package:provider/provider.dart'; 6 | 7 | void main() { 8 | runApp( 9 | ChangeNotifierProvider( 10 | create: (context) => Cart(), 11 | child: MyApp(), 12 | )); 13 | } 14 | 15 | class MyApp extends StatelessWidget { 16 | @override 17 | Widget build(BuildContext context) { 18 | return MaterialApp( 19 | home: HomePage(), 20 | debugShowCheckedModeBanner: false, 21 | ); 22 | } 23 | } 24 | 25 | class HomePage extends StatefulWidget { 26 | @override 27 | _HomePageState createState() => _HomePageState(); 28 | } 29 | 30 | class _HomePageState extends State { 31 | final List items = [ 32 | Item(title: 'laptop ', price: 500.0), 33 | Item(title: 'iphone x ', price: 400.0), 34 | Item(title: 'keyboard ', price: 40.0), 35 | ]; 36 | @override 37 | Widget build(BuildContext context) { 38 | return Consumer(builder: (context, cart, child) { 39 | return Scaffold( 40 | appBar: AppBar( 41 | title: Text('Shopping cart'), 42 | actions: [ 43 | Padding( 44 | padding: EdgeInsets.all(8.0), 45 | child: Row( 46 | children: [ 47 | IconButton( 48 | icon: Icon( 49 | Icons.shopping_cart, 50 | color: Colors.white, 51 | ), 52 | onPressed: () { 53 | Navigator.of(context).push(MaterialPageRoute( 54 | builder: (context) => CheckoutPage())); 55 | }, 56 | ), 57 | Text(cart.count.toString()) 58 | ], 59 | ), 60 | ) 61 | ], 62 | centerTitle: true, 63 | ), 64 | body: ListView.builder( 65 | itemCount: items.length, 66 | itemBuilder: (context, index) { 67 | return ListTile( 68 | title: Text(items[index].title), 69 | subtitle: Text(items[index].price.toString()), 70 | trailing: Icon(Icons.add), 71 | onTap: () { 72 | cart.add(items[index]); 73 | }, 74 | ); 75 | }, 76 | ), 77 | ); 78 | }); 79 | } 80 | } 81 | -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/models/cart.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:messenger/models/item.dart'; 3 | 4 | class Cart extends ChangeNotifier { 5 | List _items = []; 6 | double _totalPrice = 0.0; 7 | 8 | void add(Item item) { 9 | _items.add(item); 10 | _totalPrice += item.price; 11 | notifyListeners(); 12 | } 13 | 14 | 15 | void remove(Item item) { 16 | _totalPrice -= item.price; 17 | _items.remove(item); 18 | notifyListeners(); 19 | } 20 | 21 | int get count { 22 | return _items.length; 23 | } 24 | 25 | double get totalPrice { 26 | return _totalPrice; 27 | } 28 | 29 | List get basketItems { 30 | return _items; 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/models/item.dart: -------------------------------------------------------------------------------- 1 | class Item { 2 | String title; 3 | double price; 4 | Item({required this.title, required this.price}); 5 | } 6 | -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/pubspec.yaml: -------------------------------------------------------------------------------- 1 | name: messenger 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.15.1 <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 | provider: 38 | 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: ^1.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. 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/images/ 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 | -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/references.txt: -------------------------------------------------------------------------------- 1 | https://docs.flutter.dev/development/data-and-backend/state-mgmt/intro 2 | 3 | 4 | https://docs.flutter.dev/development/data-and-backend/state-mgmt/ephemeral-vs-app 5 | 6 | 7 | https://docs.flutter.dev/development/data-and-backend/state-mgmt/ephemeral-vs-app 8 | 9 | 10 | https://docs.flutter.dev/development/data-and-backend/state-mgmt/simple -------------------------------------------------------------------------------- /flutter_shopping_cart_provider_project/screens/checkout_page.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | import 'package:messenger/models/cart.dart'; 3 | import 'package:provider/provider.dart'; 4 | 5 | class CheckoutPage extends StatefulWidget { 6 | @override 7 | _CheckoutPageState createState() => _CheckoutPageState(); 8 | } 9 | 10 | class _CheckoutPageState extends State { 11 | 12 | 13 | 14 | 15 | @override 16 | Widget build(BuildContext context) { 17 | 18 | 19 | return Consumer( 20 | builder: (context, cart, child) { 21 | return Scaffold( 22 | appBar: AppBar( 23 | title: Text('Checkout Page [\$ ${cart.totalPrice}]'), 24 | ), 25 | body: cart.basketItems.length == 0 26 | ? Text('no items in your cart') 27 | : ListView.builder( 28 | itemCount: cart.basketItems.length, 29 | itemBuilder: (context, index) { 30 | return Card( 31 | child: ListTile( 32 | title: Text(cart.basketItems[index].title), 33 | subtitle: 34 | Text(cart.basketItems[index].price.toString()), 35 | trailing: IconButton( 36 | icon: Icon(Icons.delete), 37 | onPressed: () { 38 | cart.remove(cart.basketItems[index]); 39 | }, 40 | ), 41 | ), 42 | ); 43 | }, 44 | )); 45 | }, 46 | ); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /messenger_screen/assets/images/person_1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/messenger_screen/assets/images/person_1.png -------------------------------------------------------------------------------- /messenger_screen/assets/images/person_2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/messenger_screen/assets/images/person_2.jpg -------------------------------------------------------------------------------- /messenger_screen/assets/images/person_3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/messenger_screen/assets/images/person_3.jpg -------------------------------------------------------------------------------- /messenger_screen/assets/images/person_4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/messenger_screen/assets/images/person_4.png -------------------------------------------------------------------------------- /messenger_screen/assets/images/person_5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/messenger_screen/assets/images/person_5.png -------------------------------------------------------------------------------- /messenger_screen/assets/images/person_6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/messenger_screen/assets/images/person_6.jpg -------------------------------------------------------------------------------- /messenger_screen/lib/main.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | import 'messenger_screen.dart'; 4 | 5 | void main() { 6 | runApp(const MyApp()); 7 | } 8 | 9 | class MyApp extends StatelessWidget { 10 | const MyApp({Key? key}) : super(key: key); 11 | 12 | @override 13 | Widget build(BuildContext context) { 14 | return MaterialApp( 15 | title: 'Flutter Demo', 16 | home: MassengerScreen(), 17 | ); 18 | } 19 | } 20 | 21 | -------------------------------------------------------------------------------- /messenger_screen/lib/messenger_screen.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/cupertino.dart'; 2 | import 'package:flutter/material.dart'; 3 | import 'package:flutter/widgets.dart'; 4 | import 'package:messenger/model/chat_model.dart'; 5 | 6 | import 'model/story_model.dart'; 7 | 8 | class MassengerScreen extends StatelessWidget { 9 | MassengerScreen({Key? key}) : super(key: key); 10 | 11 | @override 12 | Widget build(BuildContext context) { 13 | List items = [ 14 | StoryModel("Mohammad", Colors.red, "assets/images/person_1.png"), 15 | StoryModel( 16 | "Maessa Ahmed hhhhhh", Colors.grey, "assets/images/person_2.jpg"), 17 | StoryModel("Lamyaa", Colors.green, "assets/images/person_3.jpg"), 18 | StoryModel("Mohammad", Colors.red, "assets/images/person_1.png"), 19 | StoryModel( 20 | "Maessa Ahmed hhhhhh", Colors.grey, "assets/images/person_2.jpg"), 21 | StoryModel("Lamyaa", Colors.green, "assets/images/person_3.jpg"), 22 | StoryModel("Mohammad", Colors.red, "assets/images/person_1.png"), 23 | StoryModel( 24 | "Maessa Ahmed hhhhhh", Colors.grey, "assets/images/person_2.jpg"), 25 | StoryModel("Lamyaa", Colors.green, "assets/images/person_3.jpg"), 26 | StoryModel("Mohammad", Colors.red, "assets/images/person_1.png"), 27 | StoryModel( 28 | "Maessa Ahmed hhhhhh", Colors.grey, "assets/images/person_2.jpg"), 29 | StoryModel("Lamyaa", Colors.green, "assets/images/person_3.jpg"), 30 | StoryModel("Mohammad", Colors.red, "assets/images/person_1.png"), 31 | StoryModel( 32 | "Maessa Ahmed hhhhhh", Colors.grey, "assets/images/person_2.jpg"), 33 | StoryModel("Lamyaa", Colors.green, "assets/images/person_3.jpg"), 34 | ]; 35 | 36 | List chatList = [ 37 | ChatModel( 38 | "Hossam", 39 | Colors.cyanAccent, 40 | "assets/images/person_3.jpg", 41 | "2:00pm", 42 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 43 | ChatModel( 44 | "Hossam", 45 | Colors.cyanAccent, 46 | "assets/images/person_3.jpg", 47 | "2:00pm", 48 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 49 | ChatModel( 50 | "Hossam", 51 | Colors.cyanAccent, 52 | "assets/images/person_3.jpg", 53 | "2:00pm", 54 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 55 | ChatModel( 56 | "Hossam", 57 | Colors.cyanAccent, 58 | "assets/images/person_3.jpg", 59 | "2:00pm", 60 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 61 | 62 | ChatModel( 63 | "Hossam", 64 | Colors.cyanAccent, 65 | "assets/images/person_3.jpg", 66 | "2:00pm", 67 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 68 | ChatModel( 69 | "Hossam", 70 | Colors.cyanAccent, 71 | "assets/images/person_3.jpg", 72 | "2:00pm", 73 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 74 | ChatModel( 75 | "Hossam", 76 | Colors.cyanAccent, 77 | "assets/images/person_3.jpg", 78 | "2:00pm", 79 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 80 | ChatModel( 81 | "Hossam", 82 | Colors.cyanAccent, 83 | "assets/images/person_3.jpg", 84 | "2:00pm", 85 | "Hello My name is hossam i study flutter now i'am ready for any thing ......"), 86 | ]; 87 | 88 | Size size = MediaQuery.of(context).size; 89 | 90 | 91 | return Scaffold( 92 | appBar: AppBar( 93 | backgroundColor: Colors.white, 94 | elevation: 0.0, 95 | title: Row( 96 | children: [ 97 | CircleAvatar( 98 | radius: 20, 99 | backgroundImage: AssetImage('assets/images/person_1.png'), 100 | ), 101 | SizedBox( 102 | width: 15, 103 | ), 104 | Text( 105 | "Chats", 106 | style: TextStyle(color: Colors.black), 107 | ), 108 | ], 109 | ), 110 | actions: [ 111 | IconButton( 112 | onPressed: () { 113 | print("HELLO"); 114 | }, 115 | icon: CircleAvatar( 116 | radius: 15, 117 | backgroundColor: Colors.blue, 118 | child: Icon( 119 | Icons.camera_alt, 120 | size: 16, 121 | color: Colors.white, 122 | ), 123 | ), 124 | ), 125 | IconButton( 126 | onPressed: () { 127 | print("HELLO"); 128 | }, 129 | icon: CircleAvatar( 130 | radius: 15, 131 | backgroundColor: Colors.blue, 132 | child: Icon( 133 | Icons.edit, 134 | size: 16, 135 | color: Colors.white, 136 | ), 137 | ), 138 | ), 139 | ], 140 | ), 141 | body: Padding( 142 | padding: EdgeInsets.all(size.width * 0.03), 143 | child: SingleChildScrollView( 144 | child: Column( 145 | children: [ 146 | Container( 147 | padding: EdgeInsets.all(5.0), 148 | decoration: BoxDecoration( 149 | borderRadius: BorderRadius.circular(5), 150 | color: Colors.grey[300], 151 | ), 152 | child: Row( 153 | children: [ 154 | Icon(Icons.search), 155 | SizedBox( 156 | width: 15, 157 | ), 158 | Text( 159 | "Search", 160 | ), 161 | ], 162 | ), 163 | ), 164 | SizedBox( 165 | height: 30, 166 | ), 167 | Container( 168 | height: size.height * 0.15, 169 | child: ListView.separated( 170 | scrollDirection: Axis.horizontal, 171 | itemBuilder: (context, index) { 172 | return buildStory(items[index]); 173 | }, 174 | separatorBuilder: (context, index) { 175 | return SizedBox( 176 | width: 20, 177 | ); 178 | }, 179 | itemCount: items.length, 180 | ), 181 | ), 182 | SizedBox( 183 | height: 10, 184 | ), 185 | ListView.separated( 186 | physics: NeverScrollableScrollPhysics(), 187 | shrinkWrap: true, 188 | itemBuilder: (context, index) { 189 | return buildChat(chatList[index]); 190 | }, 191 | separatorBuilder: (context, index) { 192 | return SizedBox( 193 | height: 20, 194 | ); 195 | }, 196 | itemCount: chatList.length) 197 | ], 198 | ), 199 | ), 200 | ), 201 | ); 202 | } 203 | 204 | Widget buildStory(StoryModel item) { 205 | return Container( 206 | width: 60, 207 | child: Column( 208 | children: [ 209 | Stack( 210 | alignment: Alignment.bottomRight, 211 | children: [ 212 | CircleAvatar( 213 | radius: 30, 214 | backgroundImage: AssetImage(item.image), 215 | ), 216 | Padding( 217 | padding: EdgeInsets.only(bottom: 3.0), 218 | child: CircleAvatar( 219 | radius: 7, 220 | backgroundColor: item.color, 221 | ), 222 | ), 223 | ], 224 | ), 225 | SizedBox( 226 | height: 6.0, 227 | ), 228 | Text( 229 | item.name, 230 | maxLines: 2, 231 | overflow: TextOverflow.ellipsis, 232 | ), 233 | ], 234 | ), 235 | ); 236 | } 237 | 238 | Widget buildChat(ChatModel item) { 239 | return Row( 240 | children: [ 241 | Stack( 242 | alignment: Alignment.bottomRight, 243 | children: [ 244 | CircleAvatar( 245 | radius: 30, 246 | backgroundImage: AssetImage(item.image), 247 | ), 248 | Padding( 249 | padding: EdgeInsets.only(bottom: 3.0), 250 | child: CircleAvatar( 251 | radius: 7, 252 | backgroundColor: item.color, 253 | ), 254 | ), 255 | ], 256 | ), 257 | SizedBox( 258 | width: 10, 259 | ), 260 | Expanded( 261 | child: Column( 262 | crossAxisAlignment: CrossAxisAlignment.start, 263 | children: [ 264 | Text( 265 | item.name, 266 | style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold), 267 | ), 268 | SizedBox( 269 | height: 5, 270 | ), 271 | Row( 272 | children: [ 273 | Expanded( 274 | child: Text( 275 | item.message, 276 | overflow: TextOverflow.ellipsis, 277 | maxLines: 2, 278 | )), 279 | Padding( 280 | padding: const EdgeInsets.symmetric(horizontal: 10), 281 | child: Container( 282 | width: 5, 283 | height: 5, 284 | decoration: BoxDecoration( 285 | color: Colors.cyan, 286 | shape: BoxShape.circle, 287 | ), 288 | ), 289 | ), 290 | Text(item.time,), 291 | ], 292 | ) 293 | ], 294 | ), 295 | ), 296 | ], 297 | ); 298 | } 299 | } 300 | -------------------------------------------------------------------------------- /messenger_screen/lib/model/chat_model.dart: -------------------------------------------------------------------------------- 1 | import 'dart:ui'; 2 | 3 | class ChatModel{ 4 | String image; 5 | String name; 6 | Color color; 7 | String message; 8 | String time; 9 | ChatModel(this.name,this.color,this.image,this.time,this.message); 10 | } -------------------------------------------------------------------------------- /messenger_screen/lib/model/story_model.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | class StoryModel{ 4 | String name; 5 | Color color; 6 | String image; 7 | 8 | StoryModel(this.name,this.color,this.image); 9 | 10 | } -------------------------------------------------------------------------------- /messenger_screen/pubspec.yaml: -------------------------------------------------------------------------------- 1 | name: messenger 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.15.1 <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 | 38 | dev_dependencies: 39 | flutter_test: 40 | sdk: flutter 41 | 42 | # The "flutter_lints" package below contains a set of recommended lints to 43 | # encourage good coding practices. The lint set provided by the package is 44 | # activated in the `analysis_options.yaml` file located at the root of your 45 | # package. See that file for information about deactivating specific lint 46 | # rules and activating additional ones. 47 | flutter_lints: ^1.0.0 48 | 49 | # For information on the generic Dart part of this file, see the 50 | # following page: https://dart.dev/tools/pub/pubspec 51 | 52 | # The following section is specific to Flutter. 53 | flutter: 54 | 55 | # The following line ensures that the Material Icons font is 56 | # included with your application, so that you can use the icons in 57 | # the material Icons class. 58 | uses-material-design: true 59 | 60 | # To add assets to your application, add an assets section, like this: 61 | assets: 62 | - assets/images/ 63 | 64 | 65 | # An image asset can refer to one or more resolution-specific "variants", see 66 | # https://flutter.dev/assets-and-images/#resolution-aware. 67 | 68 | # For details regarding adding assets from package dependencies, see 69 | # https://flutter.dev/assets-and-images/#from-packages 70 | 71 | # To add custom fonts to your application, add a fonts section here, 72 | # in this "flutter" section. Each entry in this list should have a 73 | # "family" key with the font family name, and a "fonts" key with a 74 | # list giving the asset and other descriptors for the font. For 75 | # example: 76 | # fonts: 77 | # - family: Schyler 78 | # fonts: 79 | # - asset: fonts/Schyler-Regular.ttf 80 | # - asset: fonts/Schyler-Italic.ttf 81 | # style: italic 82 | # - family: Trajan Pro 83 | # fonts: 84 | # - asset: fonts/TrajanPro.ttf 85 | # - asset: fonts/TrajanPro_Bold.ttf 86 | # weight: 700 87 | # 88 | # For details regarding fonts from package dependencies, 89 | # see https://flutter.dev/custom-fonts/#from-packages 90 | -------------------------------------------------------------------------------- /task1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Google-Developers-Sohag/Flutter/c3723385eccc29976b489a10f09cc3f4c92d30b9/task1.png -------------------------------------------------------------------------------- /tricks/bottom_nav_bar.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | void main() { 4 | runApp(const MyApp()); 5 | } 6 | 7 | class MyApp extends StatelessWidget { 8 | const MyApp({Key? key}) : super(key: key); 9 | 10 | // This widget is the root of your application. 11 | @override 12 | Widget build(BuildContext context) { 13 | return MaterialApp( 14 | title: 'Bottom NavBar Demo', 15 | theme: ThemeData( 16 | splashColor: Colors.transparent, 17 | highlightColor: Colors.transparent, 18 | hoverColor: Colors.transparent, 19 | ), 20 | debugShowCheckedModeBanner: false, 21 | home: const HomePage(), 22 | ); 23 | } 24 | } 25 | 26 | class HomePage extends StatefulWidget { 27 | const HomePage({Key? key}) : super(key: key); 28 | 29 | @override 30 | _HomePageState createState() => _HomePageState(); 31 | } 32 | 33 | class _HomePageState extends State { 34 | int pageIndex = 0; 35 | 36 | final pages = [ 37 | const Page1(), 38 | const Page2(), 39 | const Page3(), 40 | const Page4(), 41 | ]; 42 | 43 | @override 44 | Widget build(BuildContext context) { 45 | return Scaffold( 46 | backgroundColor: const Colors.blue, 47 | appBar: AppBar( 48 | leading: Icon( 49 | Icons.menu, 50 | color: Theme.of(context).primaryColor, 51 | ), 52 | title: Text( 53 | "Google DSC Flutter", 54 | style: TextStyle( 55 | color: Theme.of(context).primaryColor, 56 | fontSize: 25, 57 | fontWeight: FontWeight.w600, 58 | ), 59 | ), 60 | centerTitle: true, 61 | backgroundColor: Colors.white, 62 | ), 63 | body: pages[pageIndex], 64 | bottomNavigationBar: buildMyNavBar(context), 65 | ); 66 | } 67 | 68 | Container buildMyNavBar(BuildContext context) { 69 | return Container( 70 | height: 60, 71 | decoration: BoxDecoration( 72 | color: Theme.of(context).primaryColor, 73 | borderRadius: const BorderRadius.only( 74 | topLeft: Radius.circular(20), 75 | topRight: Radius.circular(20), 76 | ), 77 | ), 78 | child: Row( 79 | mainAxisAlignment: MainAxisAlignment.spaceAround, 80 | children: [ 81 | IconButton( 82 | enableFeedback: false, 83 | onPressed: () { 84 | setState(() { 85 | pageIndex = 0; 86 | }); 87 | }, 88 | icon: pageIndex == 0 89 | ? const Icon( 90 | Icons.home_filled, 91 | color: Colors.white, 92 | size: 35, 93 | ) 94 | : const Icon( 95 | Icons.home_outlined, 96 | color: Colors.white, 97 | size: 35, 98 | ), 99 | ), 100 | IconButton( 101 | enableFeedback: false, 102 | onPressed: () { 103 | setState(() { 104 | pageIndex = 1; 105 | }); 106 | }, 107 | icon: pageIndex == 1 108 | ? const Icon( 109 | Icons.work_rounded, 110 | color: Colors.white, 111 | size: 35, 112 | ) 113 | : const Icon( 114 | Icons.work_outline_outlined, 115 | color: Colors.white, 116 | size: 35, 117 | ), 118 | ), 119 | IconButton( 120 | enableFeedback: false, 121 | onPressed: () { 122 | setState(() { 123 | pageIndex = 2; 124 | }); 125 | }, 126 | icon: pageIndex == 2 127 | ? const Icon( 128 | Icons.widgets_rounded, 129 | color: Colors.white, 130 | size: 35, 131 | ) 132 | : const Icon( 133 | Icons.widgets_outlined, 134 | color: Colors.white, 135 | size: 35, 136 | ), 137 | ), 138 | IconButton( 139 | enableFeedback: false, 140 | onPressed: () { 141 | setState(() { 142 | pageIndex = 3; 143 | }); 144 | }, 145 | icon: pageIndex == 3 146 | ? const Icon( 147 | Icons.person, 148 | color: Colors.white, 149 | size: 35, 150 | ) 151 | : const Icon( 152 | Icons.person_outline, 153 | color: Colors.white, 154 | size: 35, 155 | ), 156 | ), 157 | ], 158 | ), 159 | ); 160 | } 161 | } 162 | 163 | class Page1 extends StatelessWidget { 164 | const Page1({Key? key}) : super(key: key); 165 | 166 | @override 167 | Widget build(BuildContext context) { 168 | return Container( 169 | color: const Colors.blue, 170 | child: Center( 171 | child: Text( 172 | "Page Number 1", 173 | style: TextStyle( 174 | color: Colors.blue[900], 175 | fontSize: 45, 176 | fontWeight: FontWeight.w500, 177 | ), 178 | ), 179 | ), 180 | ); 181 | } 182 | } 183 | 184 | class Page2 extends StatelessWidget { 185 | const Page2({Key? key}) : super(key: key); 186 | 187 | @override 188 | Widget build(BuildContext context) { 189 | return Container( 190 | color: const Colors.blue), 191 | child: Center( 192 | child: Text( 193 | "Page Number 2", 194 | style: TextStyle( 195 | color: Colors.blue[900], 196 | fontSize: 45, 197 | fontWeight: FontWeight.w500, 198 | ), 199 | ), 200 | ), 201 | ); 202 | } 203 | } 204 | 205 | class Page3 extends StatelessWidget { 206 | const Page3({Key? key}) : super(key: key); 207 | 208 | @override 209 | Widget build(BuildContext context) { 210 | return Container( 211 | color: const Colors.blue, 212 | child: Center( 213 | child: Text( 214 | "Page Number 3", 215 | style: TextStyle( 216 | color: Colors.blue[900], 217 | fontSize: 45, 218 | fontWeight: FontWeight.w500, 219 | ), 220 | ), 221 | ), 222 | ); 223 | } 224 | } 225 | 226 | class Page4 extends StatelessWidget { 227 | const Page4({Key? key}) : super(key: key); 228 | 229 | @override 230 | Widget build(BuildContext context) { 231 | return Container( 232 | color: const Colors.blue, 233 | child: Center( 234 | child: Text( 235 | "Page Number 4", 236 | style: TextStyle( 237 | color: Colors.blue[900], 238 | fontSize: 45, 239 | fontWeight: FontWeight.w500, 240 | ), 241 | ), 242 | ), 243 | ); 244 | } 245 | } 246 | -------------------------------------------------------------------------------- /tricks/calls_sms_emails.dart: -------------------------------------------------------------------------------- 1 | 2 | // add dependecy in pubspec.yaml 3 | 4 | // dependencies: 5 | // url_launcher: ^6.1.3 6 | 7 | // Call the launch method from url_launcher package: 8 | //launch("tel://214324234"); 9 | 10 | //Here's the complete code: 11 | 12 | import 'package:flutter/material.dart'; 13 | import 'package:url_launcher/url_launcher.dart'; 14 | 15 | class MyApp extends StatelessWidget { 16 | @override 17 | Widget build(BuildContext context) { 18 | return new MaterialApp( 19 | title: 'Flutter Demo', 20 | home: new Home(), 21 | ); 22 | } 23 | } 24 | 25 | class Home extends StatelessWidget { 26 | Home({Key key}) : super(key: key); 27 | 28 | @override 29 | Widget build(BuildContext context) => new Scaffold( 30 | appBar: new AppBar( 31 | title: new Text("View"), 32 | ), 33 | body: new Center( 34 | child: new FlatButton( 35 | onPressed: () => launch("tel://21213123123"), 36 | child: new Text("Call me")), 37 | ), 38 | ); 39 | } 40 | 41 | void main() { 42 | runApp( 43 | new MyApp(), 44 | ); 45 | } 46 | -------------------------------------------------------------------------------- /tricks/snack_bar.dart: -------------------------------------------------------------------------------- 1 | class HomePage extends StatelessWidget { 2 | @override 3 | Widget build(BuildContext context) { 4 | return Scaffold( 5 | appBar: AppBar( 6 | title: Text('Hello world'), 7 | ), 8 | body: Center( 9 | child: TextButton( 10 | onPressed: () { 11 | final now = DateFormat('yyyy-MM-dd – kk:mm').format(DateTime.now()); 12 | ScaffoldMessenger.of(context).removeCurrentSnackBar(); 13 | ScaffoldMessenger.of(context).showSnackBar( 14 | SnackBar( 15 | behavior: SnackBarBehavior.floating, 16 | elevation: 3.0, 17 | backgroundColor: 18 | Colors.green[600]!.withOpacity(0.8), 19 | shape: RoundedRectangleBorder( 20 | borderRadius: BorderRadius.circular(10), 21 | side: BorderSide( 22 | color: Colors.black.withOpacity(0.4), 23 | width: 2.0, 24 | ), 25 | ), 26 | content: Text('Some text $now'), 27 | ), 28 | ); 29 | }, 30 | child: Text('Show toast'), 31 | ), 32 | ), 33 | ); 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /tricks/tab_bar.dart: -------------------------------------------------------------------------------- 1 | import 'package:flutter/material.dart'; 2 | 3 | void main() { 4 | runApp(TabBarDemo()); 5 | } 6 | 7 | class TabBarDemo extends StatelessWidget { 8 | @override 9 | Widget build(BuildContext context) { 10 | return MaterialApp( 11 | home: DefaultTabController( 12 | length: 5, 13 | child: Scaffold( 14 | appBar: AppBar( 15 | //first put TabBar titles 16 | bottom: TabBar( 17 | tabs: [ 18 | Tab(icon: Icon(Icons.music_note)), 19 | Tab(icon: Icon(Icons.music_video)), 20 | Tab(icon: Icon(Icons.camera_alt)), 21 | Tab(icon: Icon(Icons.grade)), 22 | Tab(icon: Icon(Icons.email)), 23 | ], 24 | ), 25 | title: Text('Google DSC Flutter'), 26 | backgroundColor: Colors.green, 27 | ), 28 | body: TabBarView( 29 | //What will be shown in screens 30 | children: [ 31 | Icon(Icons.music_note), 32 | Icon(Icons.music_video), 33 | Icon(Icons.camera_alt), 34 | Icon(Icons.grade), 35 | Icon(Icons.email), 36 | ], 37 | ), 38 | ), 39 | ), 40 | ); 41 | } 42 | -------------------------------------------------------------------------------- /tricks/transparent_status_bar.dart: -------------------------------------------------------------------------------- 1 | void main() { 2 | // trans status bar 3 | SystemChrome.setSystemUIOverlayStyle( 4 | const SystemUiOverlayStyle(statusBarColor: Colors.transparent)); 5 | runApp(const MyApp()); 6 | } 7 | --------------------------------------------------------------------------------