Flutter Demo: FaithFit

Transcript

1. Flutter Demo: FaithFit @BenWicks
2. WHERE PHYSICAL TRAINING MEETS SPIRITUAL FORMATION 1 Timothy 4:8 For while bodily training is of some value, godliness is of value in every way, as it holds promise for the present life and also for the life to come. The product is an audio-guided workout program. I’ve been on the project for about a month in my free time. So far I’m just prototyping and seeing if Flutter will provide a workable solution.
3. + + You can think of it like Fitify + your spiritual app of choice + Pocket Casts
4. + + You can think of it like Fitify + your spiritual app of choice + Pocket Casts
5. Outline •Packages / Channels •Async / Await •BLoC Pattern
6. Packages • Flutter supports using shared packages contributed by other developers to the Flutter and Dart ecosystems. This allows you to quickly build your app without having to develop everything from scratch. • Existing packages enable many use cases, for example, making network requests (http), custom navigation/route handling (fluro), integration with device APIs (like url_launcher & battery), and using third-party platform SDKs (like Firebase). https://flutter.io/using-packages/ Show my pubspec.yaml - Packages are pre-v1 release. - cupertino_icons & share - audioplayers - media_notification https://pub.dartlang.org/flutter/packages - This is the centralized repository to find Flutter packages. References: https://www.dartlang.org/tools/pub/dependencies
7. Packages https://flutter.io/using-packages/ Show my pubspec.yaml - Packages are pre-v1 release. - cupertino_icons & share - audioplayers - media_notification https://pub.dartlang.org/flutter/packages - This is the centralized repository to find Flutter packages.
8. Packages https://flutter.io/using-packages/ Show my pubspec.yaml - Packages are pre-v1 release. - cupertino_icons & share - audioplayers - media_notification https://pub.dartlang.org/flutter/packages - This is the centralized repository to find Flutter packages.
9. Packages https://flutter.io/using-packages/ Show my pubspec.yaml - Packages are pre-v1 release. - cupertino_icons & share - audioplayers - media_notification https://pub.dartlang.org/flutter/packages - This is the centralized repository to find Flutter packages.
10. Channels • Flutter uses a flexible system that allows you to call platform-specific APIs whether available in Java or Kotlin code on Android, or in ObjectiveC or Swift code on iOS. • Flutter’s platform-specific API support does not rely on code generation, but rather on a flexible message passing style: • The Flutter portion of your app sends messages to its host, the iOS or Android portion of your app, over a platform channel. • The host listens on the platform channel, and receives the message. It then calls into any number of platform-specific APIs – using the native programming language – and sends back a response to the client, the Flutter portion of your app. https://flutter.io/platform-channels/ Reference https://github.com/iampawan/Flutter-Music-Player/issues/2 Demonstrate how this works in the app on Android. Then… show example of channels (or lack thereof) in https://github.com/Zeratyll/flutter_media_notification
11. Channels https://flutter.io/platform-channels/ Show AudioplayersPlugin (for Android & iOS) Show how Notification works on Android and not on iOS Show cupertino_icons & share (workout_detail_page_route.dart)
12. Async / Await • Use await in an async function to pause execution until a Future completes • A Future represents an asynchronous operation that returns a value (which can be void). When a function that returns a Future is invoked, two things happen: • The function queues up work to be done and returns an uncompleted Future object. • Later, when the operation is finished, the Future object completes with a value or with an error. • When writing code that depends on a Future, you have two options: • Use async and await • Use the Future API https://www.dartlang.org/tutorials/language/futures Show dragging the slider in player_widget.dart
13. BLoC Pattern Business Logic Component https://youtu.be/RS36gBEp8OI https://youtu.be/PLHln7wHgPE
14. BLoC Pattern • https://github.com/filiph/state_experiments • https://docs.flutter.io/flutter/widgets/InheritedWidget-class.html Business Logic Component Explain why I want to convert to bloc pattern -> audio state is not maintained when going back to main screen. Show bloc branch?
15. BLoC Pattern • https://github.com/filiph/state_experiments • https://docs.flutter.io/flutter/widgets/InheritedWidget-class.html Business Logic Component Explain why I want to convert to bloc pattern -> audio state is not maintained when going back to main screen. Show bloc branch?
16. BLoC Pattern • https://github.com/filiph/state_experiments • https://docs.flutter.io/flutter/widgets/InheritedWidget-class.html Business Logic Component Explain why I want to convert to bloc pattern -> audio state is not maintained when going back to main screen. Show bloc branch?
17. Demo / Questions Ask what they want to see in code.
18. GDG Omaha Flutter Study Jam Coming this Fall Probably starting the 1st weekend in November. Ask people if they would prefer Saturday and Sunday or 2 consecutive weekends?
19. Thank You! References: - https://www.dartlang.org/tools/pub/dependencies - https://dev.jimdo.com/bloc-architecture-in-flutter/