We have a single codebase for Android & iOS in Flutter.
We tried to use the same codebase for Web in Flutter too, but it hadn't gone well.
As of some libraries/plugins, currently unsupported by Flutter SDK.
To mitigate these issues, we are maintaining two separate repositories, one for Android-iOS and other for Web.
Also, to add up here, for separate repositories because each Flutter product has a unique pubspec.yaml file. Now there are a few plugins that are currently supported in App but Not yet on Flutter Web, namely Awesome Notifications, Clevertap plugin, etc.
Integrating those plugins on the web, stops the web to run. So keeping the same codebase for both is getting technically complicated as the app has many many functions.
It takes so much time in simultaneously testing, debugging and resolving issues in Web.
So, how we can maintain same code for all platforms i.e., Android, iOS & Web, without doing it in other repository for Web and gaining advantage in streamlining our codebase into one for all platforms?
For Ex. If I commented the package awesome_notifications for Web in pubspec file, the issue arises (as shown in the screenshot) in code wherever we used its functionalities.
For successfully working on both Mobile & Web, are there any methods available we can use packages for both (Mobile & Web)?
Ideally you’d want to use a single codebase to host both the web and mobile versions, to minimise code maintenance and improve efficiency. To do this, you’ll need to be able to find the platform the code is running on, so that code can be called programmatically.
You can use the constant kIsWeb to check if the application is compiled for the web, and you can then use that condition to only run platform-specific code (such as the awesome_notifications package) if you’re on a platform that supports it. That way you’ll still be able to import the required packages, but only call them when the app is running on the mobile version of your app.
That should allow you to condense your codebase into one repository without sacrificing any functionality that may not work across all platforms.
Related
I'm interested in using Flutter primarily for my startup MVP on Web and possibly Android. I see the flutter community has made a lot of widgets but a lot of them are tagged iOS or Android. Since Futter is all about using one codebase is it wrong to assume that these widgets would work on web too? I imagine the setup would be different but similar with a Flutter web app as opposed to a Flutter Android app.
I couldn't find a whole lot about this on the Flutter site. I also know that web is still beta but by the time I'm done with the MVP it'll probably be at stable release or close enough.
Well... It depends. If the widget has some sort of native code the answer is no. In Flutter there are two type of packages: the "normal" package, and the plugin.
The packages are made only of dart code, so there are no bounds to native, and you can use everywhere dart (and Flutter) can run.
The plugins are packages with native code and you can use only on the platform supported by that plugin.
For example the package provider, it's a package, and you can use in every supported platform where dart (and Flutter) can run. But url_launcher, it's a plugin, so you can run only on Android, iOS, and web, but for example on desktop, it will no work.
If the package if you found it's only a widget, you should be able to use on the web.
TLDR: No,a PWA it's a web app, so it can't run Android or iOS specific code.
Hi stack overflow community,
I'm a novice programmer in high school and have never written an app for mobile devices before so please bear with me. If I was to write an app using Flutter, will I only be required to write the code once and then be able to distribute different versions of it (iOS, macOS, Windows, Linux, Android, etc)? Or will I need to make small changes for each version such as using XCode to create the iOS version and Android Studio for the Android version? I know this is such a basic question but I've spent a couple of hours looking this stuff up and I'm still confused. Any help would be nice.
Thanks,
Daniel
In a product development environment, after writing the cross-platform code with Flutter, there are some need-to-do tasks related to Native environment.
In the case of Android, there are several cases when you'll need to touch the Native level such as config Firestore settings, Social authentication (Login with Facebook for example), changing the launch icons/ splash screen of the app or publishing to app store, etc
For iOS, the same case apply as well. So I suggest you start with small steps to develop the app first, then when running into something that seems impossible with just Flutter code, there are tutorials and SO to guide you through. It might seem overwhelmed at first, but we are all on a journey, so no need to rush it ;)
You should make small changes too. For eg when adding launcher icons and splash screen you have to edit the respective native folders. When distributing for ios you need to manually customize its Runner from xcode. There are many library that support either android only or ios only. In that case if you need that feature you have to make changes in native code like java ans swift.
if you're creating your own native plugins, you will have unique code to write. But if you're just using things out of pub, almost nothing will require change (unless you are publishing to the store).
To be more precise, I already have a huge app writen in Ionic and now we're considering to migrate it to flutter, but we can't rewrite it from scratch, both ionic and flutter should coexist.
So my question is: can I have a flutter app as a "host" and import / run the ionic app inside it? Something like a micro frontend.
Until now I was able to build the target ionic app and import it on the flutter app, under android folder, but it does not feels like a productive way to approach the problem.
I also googled a little bit about this integration, but did not find anything that solves this problem.
I appreciate any help on this topic.
Yes, it is possible, but very cumbersome.
I did it for a project and embedded 3 ionic apps inside flutter.
I'll not list every problem that i faced but just go through some points to give you an idea.
You will need to take care of some cordova plugins that use native code, for Android copy and paste some folders like CordovaLib,cordova and use it as a library. For iOS you must add the plugin files like *.h to the compiles list inside Xcode and create an Pod to get the cordova resources (that's the way i did)
To "launch" the app for android you need to start the cordova activity and for iOS you need to play with UINavigationController and FlutterViewController, and of course create a method channel to be possible to call it from Flutter.
For multiple apps, you have to mess inside de cordova code to get the app from the right www folder and be sure to equalize every plugin version between apps.
Some packages from flutter may clash with ionic/cordova libs
Every change you do to your ionic application it must be tested outside flutter and within it to see if there's any mismatch behavior that you didn't expect, specially when adding new plugins.
Maybe some permission issues will arrive between applications like camera or localization.
I know thats not the answer, but when searching on how to do it, i stumbled upon this question a few months ago and it still without any answer on this problem.
But my final take is that the effort of joining together all pieces using multiple languages and frameworks together with the job of maintaining this spaghetti behemoth is not worth it and you'll save yourself of a tremendous headache.
Is it possible to reach a specific page in an Ionic3 app , from an external source , like another website , or a python script.
I would like to know if I can transfer data to the app, but without having the app asking for the data
such functionality is typically called “deep links” for apps. Its not easy to build such experience with apps due to platform differences (ios vs android). There are solutions that abstract differences and provide good overall implementation path: branch.io.
Branch features native plugins for Ionic 3+.
You can google guides for actual implementation.
In my company, we are working on a huge product. We have a repo for the Android project and also we have another repo for the iOS project.
I think it is impossible to rewrite the whole of the project in Flutter. So, something that popped in my mind but I am not sure if it is feasible. Each Android/iOS project contains many modules. I am working on a module called Enterprise. It has its own Activities, Fragments and business logic. So, my question is, Am I able to consider this module as a black box (it has a few inputs that are coming from the other modules and a few outputs that will be presented in the app module) and make it by Flutter. Then I will use its .aar version in the Android project as well as the iOS project.
Does an implementation like this is feasible?
Okay, I found Flutter is thinking of a way to solve this issue. I found two links that might be useful to you, too:
Add Flutter to existing apps. According to this page, "The "add-to-app" support is in preview, and is so far only available on the master channel.".
Integrating Flutter into an Existing App.
I will be more than happy to accept your answer if you have a better approach.