POC for fit-generation
This app acts as POC to show how to implement:
- BottomAppBar using go_router
- Auth using magic Link
- Chat using Stream
- Easy weight tracker with graph
For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.
To be able to generate a changelog-file out of commit messages, you need write messages as follow:
<"type">: <"short summary"> ─⫸ Summary in present tense. Not capitalized. No period at the end.
│
└─⫸ Commit Type: build|docs|feat|fix|perf|refactor|test
build: Changes that affect the build system or external dependencies
docs: Changes to documentation
feat: A new feature
fix: A bug fix
ref: Refactoring production code; no function change
perf: Performance improvements
test: Adding tests, refactoring test; no production code change
Navigation 2 is done with goRouter. See the docs
and Repo with Samples
.
BottomNavBar is done according
to shared_scaffold sample code
Open GoRouter issues:
As log as these issues are open, ButtonNavBar with GoRouter could not persist view state and
sub-locations after navigation.
A solution would be to have just one page with stacked views in it:
- Basic BottomNavBar Video with stacked Views
- Holding BottomNavBar Sub-Navigation State
- Nested Navigation using GoRouter
To make BottomNavigationBar working with go router we need at least three things:
-
SharedScaffold: The SharedScaffold contain a Scaffold-Widget which contains only the widgets which should be present trough all top views which could be accessed trough the BottomNavigationBar. This is especially the BottomNavigationBar but could also be a Nav-Drawer or an global AppBar.
In the BottomNavigationBar'sonTap
methode must ensure that a new index cause a navigation. Make sure that the index and navigation match theBottomNavigationBarItem
. -
GoRouter The top-routes should not have transition to make it look at you would stay on the same page.
Further we need thenavigatorBuilder
which ensure that the SharedScaffold get the correct page index when navigating to one of top views. Make sure that the index provided bygetSelectedNavBarIndex()
match the BottomNavigationBar. -
When navigating to a route which is not a sub-route of the top views (in BottomNavigationBar)
thenavigatorBuilder
will provide -1 to the to the SharedScaffold which then hide the BottomNavBar.
This way there is no nav-stack when restoring the app state (no back button) and
we therefore must add a possibility to return home manually.
ButtonNavBar Style: Until now, normal Material style is applied. There are packages to enhance the look ad feel: Simple: bottom_navy_bar With Action Button bubble_bottom_bar
GoRouter support Deep-Links out of the box, but you need to enable on iOS/Android:
<meta-data
android:name="flutter_deeplinking_enabled"
android:value="true" />
<key>FlutterDeepLinkingEnabled</key>
<true/>
On Android: Android use "App Links" which works similar to "Universal links" on iOS If the app is installed a bottomSheet will let you decide between opening in app or mobile browser. If the app isn't installed, the link will open in mobile browser.
Social-Media preview Tags and images come out of the box from index.html
<title>dedeApp</title>
<meta name="description" content="Create and share wishlist easy and cost free">
On iOS:
iOS use [Universal Links][17] which work similar to "App Links" on Android. Older iOS Version (<9)
use "customScheme".
You could check if an url is a "universal link" using [apple validation tool][18]
GoRouter don't support multiple navigation stacks: open issue
State Restoration allows the Navigator to restore the navigation stack when a user leaves and returns to the app after it has been killed while running in the background. This is not limited to navigation and also be used for storing the state of a list for example.
To store a state we must add a RootRestorationScope
into runApp()
and extend
the MainAppState as follow: class _MainAppState extends State<MainApp> with RestorationMixin
.
Then add a restorationScopeId
to MaterialApp and every GoRouter route (not needed when
using builder()
).
Not Working currently: To store the state of a listView, add a restorationScopeId
to the ListView.builder
methode.
The assets
directory houses images, fonts, and any other files you want to include with your
application.
The assets/images
directory
contains resolution-aware images
.
This project generates localized messages based on arb files found in the lib/src/localization
directory.
To support additional languages, please visit the tutorial on Internationalizing Flutter apps
This handles all the auth logic incl. reading the magic link using FirebaseDynamicLinks out of the box. !! Sadly the profile page is not working correctly !!
ToDo: enable hosting to read magic-links on desktop and show some meaningful content.
For example -> "open this link with your mobile phone"
Auth Logic which is not handled by the FlutterFireUI is located in auth_repo.dart
Test Login using Magic-Link:
- Android:
adb shell am start -a android.intent.action.VIEW -c android.intent.category.BROWSABLE -d {magic-link}
- iOS: To test deeplink on iOS on Simulator you need to user customscheme as follow:
xcrun simctl openurl booted app.fitgeneration.fitGeneration:{magic-link w/o https}