====== Flutter ======

Le langage [[/informatique/dart|dart]]

Quelques notes sur le [[/informatique/flutter/debug|debuggage]].

Et des [[/informatique/flutter/tips_tutos_examples|Tips/Tutos/Examples]].

Ma 1ère appli : [[/app/croustiwiki|CroustiWiki]]

Flutter documentation
  * https://flutter.dev
  * [[https://docs.flutter.dev/cookbook|Flutter Cookbook]] contains recipes that demonstrate how to solve common problems
  * [[https://github.com/flutter/codelabs/|Flutter CodeLabs]]
  * [[https://docs.flutter.dev/ui/layout|Layout]]
  * [[https://docs.flutter.dev/ui/widgets|Widgets]]
    * [[https://docs.flutter.dev/ui/widgets/cupertino|Cupertino widgets]] for iOS style and behavior 
    * [[https://docs.flutter.dev/ui/widgets/material|Material Components widgets]]
      * https://flutter-experimental-m3-demo.web.app/
  * [[https://docs.flutter.dev/cookbook/design/themes|Theme]]
  * [[https://docs.flutter.dev/ui/assets/assets-and-images|assets and images]]
  * Examples
    * https://github.com/flutter/flutter/tree/master/examples
    * https://github.com/flutter/gallery
      * theme: [[https://flutter.github.io/samples/web/material_3_demo/|material_3_demo]]
    * https://flutter.github.io/samples
    * [[https://github.com/flutter/samples/tree/main/compass_app|compass_app]]
      * The Compass sample application is an app that helps users build and book itineraries for trips. It’s a robust sample application with many features, routes, and screens. The app communicates with an HTTP server, has development and production environments, brand-specific styling, and high test coverage. In these ways and more, it simulates a real-world, feature rich Flutter application. It use [[https://pub.dev/packages/provider|package:provider]] which is recommend by teams at Google
  * **Release & Publish to app stores**
    * android
      * [[https://docs.flutter.dev/deployment/flavors|Set up Flutter flavors for Android]]
      * [[https://docs.flutter.dev/deployment/android|Build and release an Android app]]
    * iOS/macOS
      * [[https://docs.flutter.dev/deployment/flavors-ios|Set up Flutter flavors for iOS and macOS]]
      * [[https://docs.flutter.dev/deployment/ios|Build and release an iOS app]]

===== Online pad =====

  * https://try.fwfh.dev/

===== Command line =====

  * [[https://docs.flutter.dev/reference/flutter-cli|The Flutter command-line tool]]
  * [[https://docs.flutter.dev/testing/build-modes|Flutter's build modes]]

<code bash>
flutter create my_app
cd my_app
flutter analyze
flutter test
flutter run lib/main.dart
</code>

<code bash>
flutter pub get
flutter pub outdated
flutter pub upgrade
</code>

Penser à nettoyer les dossiers des projets inutilisés pour réduire le volume utilisé avec ''flutter clean'' : **779Mo -> 2,6Mo**

<code bash>
$ du -hs ./
779M	poc_flutter_tts/
$ flutter clean
$ du -hs ./
2.6M
</code>

Pour compiler la version debug

<code bash>
$ flutter build apk --debug
</code>


===== Flutter Alternatives =====

==== Kotlin Multiplatform Development ====

https://www.jetbrains.com/kotlin-multiplatform/

  * Open-source technology by JetBrains for flexible multiplatform development. Reuse Kotlin code across Android, iOS, web, desktop, and server-side while keeping native code if needed.
  * https://www.jetbrains.com/help/kotlin-multiplatform-dev/get-started.html

==== Ionic Framework ====

https://ionicframework.com/

The mobile SDK for the Web. An open source mobile UI toolkit for building modern, high quality cross-platform mobile apps from a single code base.

Ionic runs inside a native container using Cordova or, more recently, Capacitor.

  * [[https://ionic.io/resources/articles/ionic-vs-flutter-comparison-guide|Ionic vs Flutter: Best Platform for Hybrid App Development]]


===== Visual designer =====

Pour les screenshots des magasins d'Apps:

  * https://app-mockup.com

As a service
  * https://flutterflow.io/pricing
  * https://flutlab.io/pricing
  * https://pixso.net/pricing/

Free
  * https://flutterstudio.app/


Free mais pas encore actifs:
  * https://carpent.io/
  * Flutterviz.com

==== Theme builder ====

  * https://material.io/blog/material-theme-builder
  * https://appainter.dev/
    * A material theme editor and generator for Flutter to configure and preview the overall visual theme of your material app.
    * configuration visuelle d'un thème pour Flutter
    * utilise le package https://pub.dev/packages/json_theme
    * AGPL-3.0 license https://github.com/zeshuaro/appainter

==== Icons ====

  * https://www.fluttericon.com/
  * https://icon.kitchen


===== Application & components templates =====

  * [[https://flutterui.design/|FlutterUI]]
  * De superbes effets [[https://github.com/gskinnerTeam/flutter_vignettes|gskinner vignettes]] par www.gskinner.com
  * https://github.com/instaflutter/awesome-flutter
  * https://blog.logrocket.com/32-free-flutter-templates-mobile-apps/
  * https://dev.to/pablonax/40-free-flutter-templates-2022-5db1
  * https://instaflutter.com/design/best-flutter-app-templates/
  * https://code.market/category/flutter/multipurpose/app-template

https://github.com/X-Wei/flutter_catalog

https://github.com/nisrulz/flutter-examples

https://github.com/fluttercommunity/community

===== Applications faites avec Flutter =====

[[/informatique/flutter/Applications faites avec Flutter]]


===== Packages / Libraries =====


  * https://github.com/flutter/packages/ A collection of useful packages maintained by the Flutter team


==== Widgets ====

  * Flutter core
    * [[https://widgets.apprendre-flutter.dev/|Catalogue des widgets du framework]]
    * AppBar
      * https://api.flutter.dev/flutter/material/AppBar-class.html
      * https://flutterassets.com/flutter-basics-appbar/
  * [[https://github.com/fluttercommunity/community|Flutter Community]]
    * Entre autres:
      * Flutter WebView Plugin
        * https://github.com/fluttercommunity/flutter_webview_plugin
        * Android & iOS
      * Battery, Device, network...
        * https://github.com/fluttercommunity/plus_plugins
  * HTML
    * [[https://github.com/sub6resources/flutter_html|flutter_html]]
      * A Flutter widget for rendering HTML and CSS as Flutter widgets.
    * [[https://pub.dev/packages/flutter_widget_from_html|flutter_widget_from_html]], [[https://pub.dev/packages/flutter_widget_from_html_core|flutter_widget_from_html_core]]
      * Flutter package to render html as widgets that supports hyperlink, image, audio, video, iframe and 70+ other tags.
  * Swiper
    * [[https://pub.dev/packages/flutter_card_swiper|flutter_card_swiper]]
  * Rating
    * [[https://pub.dev/packages/flutter_rating_bar|flutter_rating_bar]]
    * [[https://pub.dev/packages/easy_stars|easy_stars]]
    * [[https://pub.dev/packages/flutter_rating_stars|flutter_rating_stars]]
  * Screens on an app's first launch
    * [[https://pub.dev/packages/introduction_screen|introduction_screen]]
  * List
    * [[https://pub.dev/packages/grouped_list|grouped_list]]
  * Calendar
    * [[https://pub.dev/packages/table_calendar|table_calendar]] ⭐ 3,28k 1,9k ; 25 contributors
      * sélection de plages de dates, gestion d’événements, personnalisation du style, plusieurs formats (mois, semaine, deux semaines).
      * [[https://apcpedagogie.com/le-package-table_calendar-en-flutter/|Tuto]]
    * [[https://pub.dev/packages/syncfusion_flutter_calendar|syncfusion_flutter_calendar]] ⭐ 1.55k 
      * 9 vues configurables (jour, semaine, mois, timeline, etc.), gestion événements.
      * [[https://help.syncfusion.com/flutter/calendar/getting-started|Getting started]]
    * [[https://pub.dev/packages/calendar_view|flutter_calendar_view]] ⭐ 957 505 ; 36 contributors
      * calendrier avec gestion d’événements et personnalisation de l’UI.
    * listes, comparatifs:
      * https://fluttergems.dev/calendar/
      * https://medium.com/flutter-community/flutter-calendar-library-comparison-c08d5ba3cc9e


=== InApp WebView ===

  * original:
    * https://inappwebview.dev/
      * https://github.com/techwithsam/flutter_webview/
  * fork new maintainer
    * https://pub.dev/packages/zikzak_inappwebview
  * [[https://inappwebview.dev/blog/convert-a-pwa-into-a-flutter-app-using-webviews#how-to-convert-a-pwa-to-a-flutter-app|Convert a PWA Into a Flutter App Using WebViews]]

Web Share API n'est pas fonctionnelle avec inappwebview pourtant elle fonctionne avec pwabuilder ...
  * https://github.com/pichillilorenzo/flutter_inappwebview_examples/issues/16
  * https://github.com/GoogleChromeLabs/bubblewrap/discussions/944
==== Application state management ====

The [[https://github.com/brianegan/flutter_architecture_samples/|Flutter Architecture Samples]] project demonstrates some strategies.

=== Bloc ===

  * https://bloclibrary.dev/ https://pub.dev/packages/flutter_bloc
    * [[https://blog.logrocket.com/state-management-flutter-bloc-pattern/|State management in Flutter using the BLoC design pattern]]

=== Redux ===

  * le pattern Redux avec [[https://pub.dev/packages/flutter_redux|flutter_redux]]
    * https://blog.octo.com/mon-application-flutter-avec-redux

=== Signals.dart ===

https://github.com/rodydavis/signals.dart

=== Getx ===

Open screens/snackbars/dialogs/bottomSheets without context, manage states and inject dependencies easily with Get.

https://pub.dev/packages/get/, https://github.com/jonataslaw/getx

Documentation:
  * [[https://pub.dev/packages/get/example|GetX/Example]]
  * [[https://github.com/jonataslaw/getx/blob/master/documentation/en_US/state_management.md|State Management]]
  * [[https://github.com/jonataslaw/getx/blob/master/documentation/en_US/route_management.md|Route Management]]
  * [[https://github.com/jonataslaw/getx/blob/master/documentation/en_US/dependency_management.md|Dependency Management]]
  * https://deepwiki.com/jonataslaw/getx/1-getx-overview

More:
  * other GetX packages https://pub.dev/publishers/getx.site/packages
  * [[https://www.kindacode.com/article/using-getx-get-for-state-management-in-flutter/|Using GetX (Get) for State Management in Flutter]] by A. Goodman 2022-10
  * [[https://flutterjunction.com/fetch-api-with-getx|How to Fetch Api with GetX?]] to fill a list (2023) [[https://github.com/nbnD/getx_demo/|code]]
  * [[https://medium.com/swlh/flutter-dynamic-themes-in-3-lines-c3b375f292e3|Flutter dynamic themes in 3 lines!]]
  * [[https://medium.com/swlh/flutter-fast-navigation-with-get-5412ab84b390|Flutter fast navigation with Get]] by Rod Brown
  * [[https://github.com/Mashood97/Flutter-Getx-Projects|Flutter-Getx-Projects]] (2021)
  * [[https://www.dbestech.com/tutorials/flutter-getx-app-tutorial|flutter-getx-app-tutorial]] (2021)
  * [[https://www.kindacode.com/article/using-getx-get-for-state-management-in-flutter|Using GetX (Get) for State Management in Flutter]] app that displays a list of given products (2022)



=== Provider ===

https://pub.dev/packages/provider

Applications exemples:
  * https://github.com/flutter/samples/tree/main/provider_counter
  * https://github.com/flutter/samples/tree/main/provider_shopper
  * https://github.com/flutter/samples/tree/main/compass_app

=== Riverpod ===

https://pub.dev/packages/riverpod

(anagram of Provider)

==== Storage ====

=== get_storage ===

A fast, extra light and synchronous key-value storage written entirely in Dart
  * https://pub.dev/packages/get_storage

il fonctionne très bien avec Workmanager (isolate context), le partage de données avec l'UI fonctionne 💐
=== Hive ===

Fast, Enjoyable & Secure NoSQL Database. Hive is a lightweight and buzzing-fast key-value database made for Flutter and Dart.
  * https://github.com/isar/hive

=== Drift ===

Drift is a reactive persistence library for Flutter and Dart, built on top of SQLite. 

allowing you to run database code across isolates.

  * https://github.com/simolus3/drift

=== path_provider ===

A Flutter plugin for finding commonly used locations on the filesystem. Supports Android, iOS, Linux, macOS and Windows. Not all methods are supported on all platforms.

https://pub.dev/packages/path_provider

==== Preferences ====

=== shared_preferences ===

[[https://pub.dev/packages/shared_preferences|shared_preferences]] Wraps platform-specific persistent storage for simple data (NSUserDefaults on iOS and macOS, SharedPreferences on Android, etc.).

Packages pour afficher/modifier les préférences:

Dev/debug side
  * [[https://pub.dev/packages/shared_preferences_explorer|shared_preferences_explorer]] on-screen viewing of shared_preferences

Settings page UI (//côté utilisateur//):
  * [[https://pub.dev/packages/settings_ui|settings_ui]] 🚀
  * [[https://pub.dev/packages/flutter_settings_screens|flutter_settings_screens]] 🚀
    * dépendances: path_provider, provider, shared_preferences
  * [[https://pub.dev/packages/cobi_flutter_settings|cobi_flutter_settings]] 🤔
    * dépendances: image_picker, shared_preferences
    * manque de finitions.

=== flutter_settings_screens ===





==== Home Widget ====

Home Screen Widget

Package https://pub.dev/packages/home_widget
  * https://docs.page/abausg/home_widget/android-xml/setup
  * https://codelabs.developers.google.com/flutter-home-screen-widgets?hl=fr
  * https://ejolie.hashnode.dev/developing-ios-android-home-screen-widgets-in-flutter

==== Local Notification ====

Flutter local notifications

  * https://pub.dev/packages/flutter_local_notifications
  * https://pub.dev/packages/awesome_notifications

Articles:
  * [[https://notificare.com/blog/2022/12/09/Deep-dive-into-permissions-in-flutter/|Deep dive intro Permissions in Flutter]] 2022
==== Background task ====

Flutter background service

  * https://pub.dev/packages/workmanager
  * https://pub.dev/packages/flutter_background_service

iOS:
  * Info PList [[https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/iPhoneOSKeys.html#//apple_ref/doc/uid/TP40009252-SW22|UIBackgroundModes]].
  * [[https://help.apple.com/xcode/mac/current/#/dev88ff319e7|Add a capability to a target]]


==== Deep links ====

  * https://docs.flutter.dev/cookbook/navigation/set-up-app-links    
  * https://docs.flutter.dev/ui/navigation/deep-linking

==== Auth ====

OAuth

  * https://pub.dev/packages/flutter_appauth
    * use [[https://appauth.io/|AppAuth]] a native App SDK for OAuth 2.0 and OpenID Connect
  * https://pub.dev/packages/oauth2
    * apparament obsolète [[https://github.com/dart-lang/tools/issues/375|Considering deprecating and discontinuing package:oauth2]]
  * https://pub.dev/packages/oauth2_client
  * https://pub.dev/packages/oidc




==== Theme ====

[[https://github.com/zoeglbrt/hux|HUX]] an open-source state of the art UI library for Flutter 💙 - [[https://thehuxdesign-ui.vercel.app/|demo]]

==== Other ====

  * Permission
    * [[https://pub.dev/packages/permission_handler|permission_handler]] provides a cross-platform (iOS, Android) API to request permissions and check their status. 
  * HTTP
    * [[https://pub-web.flutter-io.cn/packages/dio|dio]] a HTTP client for Dart and Flutter, which supports global settings, Interceptors, FormData, aborting and canceling a request, files uploading and downloading, requests timeout, custom adapters, etc.
    * [[https://pub.dev/packages/http|http]]
    * [[https://pub.dev/packages/get#getconnect|GetConnect]] inside GetX
  * Location
    * [[https://docs.page/Lyokone/flutterlocation|flutterlocation]]
  * Clipboard
    * <del>[[https://pub.dev/packages/rich_clipboard|rich_clipboard]]</del> discontinued
    * [[https://pub.dev/packages/super_clipboard|super_clipboard]]
  * [[https://pub.dev/packages/receive_sharing_intent|receive_sharing_intent]]
    * A Flutter plugin that enables flutter apps to receive sharing photos, videos, text, urls or any other file types from another app.